/* ============================================================
   GiveRefer Brand Portal — brand dashboard, settings, analytics,
   brand login pages.

   Built on the same foundation as rewards-redesign.css: the site
   runs Bootstrap 3 (html{font-size:10px}) and main.css sets global
   !important rules on button / h1-h6 / p / a / img. Everything is
   scoped under .gr-portal and uses the same nuclear reset so the
   brand pages match the rest of the redesigned site (Inter font,
   coral palette, neutral surfaces).
   ============================================================ */

:root {
    --grp-primary: #ef4f4b;
    --grp-primary-dark: #d9433f;
    --grp-accent: #e44d8c;
    --grp-indigo: #6c63ff;
    --grp-text: #1a1a2e;
    --grp-muted: #6b7280;
    --grp-muted-light: #f3f4f6;
    --grp-bg: #fefdfb;
    --grp-card: #ffffff;
    --grp-border: #e5e7eb;
    --grp-radius: 16px;
    --grp-radius-sm: 10px;
    --grp-shadow: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
    --grp-shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.08), 0 4px 6px -4px rgba(0,0,0,0.05);
    --grp-gradient: linear-gradient(135deg, #ef4f4b 0%, #eb4580 50%, #e44d8c 100%);
}

/* ---------- Scope base ---------- */
.gr-portal {
    font-family: 'Inter', 'Poppins', system-ui, -apple-system, sans-serif !important;
    font-size: 16px !important; /* counter Bootstrap 3 html{font-size:10px} */
    color: var(--grp-text);
    background: var(--grp-bg);
    padding: 40px 0 64px;
    min-height: 60vh;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.gr-portal .container {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---------- Nuclear reset (counter global !important) ---------- */
.gr-portal *,
.gr-portal *::before,
.gr-portal *::after {
    box-sizing: border-box;
    max-height: none !important;
}

.gr-portal,
.gr-portal div, .gr-portal span, .gr-portal p,
.gr-portal h1, .gr-portal h2, .gr-portal h3,
.gr-portal h4, .gr-portal h5, .gr-portal h6,
.gr-portal a, .gr-portal button, .gr-portal input,
.gr-portal select, .gr-portal textarea, .gr-portal label,
.gr-portal td, .gr-portal th {
    font-family: 'Inter', 'Poppins', system-ui, -apple-system, sans-serif !important;
}

.gr-portal h1, .gr-portal h2, .gr-portal h3,
.gr-portal h4, .gr-portal h5, .gr-portal h6 {
    margin: 0 !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    color: var(--grp-text);
}

.gr-portal p {
    margin: 0 !important;
    line-height: 1.6 !important;
}

.gr-portal a {
    color: inherit !important;
    text-decoration: none !important;
}

/* Reset global button { background:#FB6765 !important; padding:14px 10px !important; color:#fff !important } */
.gr-portal button {
    font-size: 14px !important;
    padding: 0 !important;
    margin: 0 !important;
    color: inherit !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    line-height: 1.5 !important;
    position: static !important;
    font-family: inherit !important;
    cursor: pointer;
    width: auto !important;
}

.gr-portal img {
    max-width: 100% !important;
    height: auto !important;
    vertical-align: middle;
}

/* ---------- Layout utilities ---------- */
.gr-portal .d-flex { display: flex; }
.gr-portal .align-items-start { align-items: flex-start; }
.gr-portal .align-items-center { align-items: center; }
.gr-portal .justify-content-between { justify-content: space-between; }
.gr-portal .justify-content-end { justify-content: flex-end; }
.gr-portal .flex-wrap { flex-wrap: wrap; }
.gr-portal .gap-5 { gap: 18px; }
.gr-portal .mb-3 { margin-bottom: 16px; }
.gr-portal .mb-4 { margin-bottom: 24px; }
.gr-portal .mb-5 { margin-bottom: 40px; }
.gr-portal .mt-3 { margin-top: 16px; }
.gr-portal .mt-4 { margin-top: 24px; }
.gr-portal .me-2 { margin-right: 8px; }
.gr-portal .pt-4 { padding-top: 24px; }
.gr-portal .text-muted { color: var(--grp-muted) !important; }
.gr-portal .text-center { text-align: center; }
.gr-portal .table-responsive { overflow-x: auto; }

/* ---------- Page header ---------- */
.gr-portal .dashboard-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 32px;
}

.gr-portal .dashboard-title {
    font-size: 30px !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em;
    margin: 0 !important;
    color: var(--grp-text);
}

.gr-portal .dashboard-title span {
    background: var(--grp-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.gr-portal .dashboard-user-info {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 14px;
    color: var(--grp-muted);
    background: var(--grp-card);
    border: 1px solid var(--grp-border);
    border-radius: 50px;
    padding: 9px 20px;
    box-shadow: var(--grp-shadow);
}

.gr-portal .dashboard-user-info .user-name {
    color: var(--grp-text);
    font-weight: 700;
}

.gr-portal .logout-link {
    display: inline-block;
    color: var(--grp-primary) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    cursor: pointer;
    text-decoration: none !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

.gr-portal .logout-link:hover { text-decoration: underline !important; }

/* ---------- Alerts ---------- */
.gr-portal .alert {
    border-radius: var(--grp-radius-sm);
    padding: 14px 18px;
    font-size: 14px;
    margin-bottom: 22px;
    border: 1px solid transparent;
}

.gr-portal .alert ul { margin: 0; padding-left: 18px; }
.gr-portal .alert li { line-height: 1.6; }
.gr-portal .alert-danger  { background: #fee2e2; border-color: #fbcfcf; color: #b42318; }
.gr-portal .alert-success { background: #d1fae5; border-color: #a7f3cf; color: #0f7a4d; }
.gr-portal .alert-warning {
    background: #fef3c7;
    border-color: #fde68a;
    color: #92600a;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

/* ---------- Cards ---------- */
.gr-portal .dashboard-cards-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 36px;
}

.gr-portal .dashboard-card {
    background: var(--grp-card);
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius);
    box-shadow: var(--grp-shadow);
    padding: 26px;
    transition: box-shadow .25s ease, transform .25s ease;
}

.gr-portal .dashboard-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--grp-shadow-lg);
}

.gr-portal .card-icon { flex-shrink: 0; }
.gr-portal .card-content { flex: 1; min-width: 0; }

.gr-portal .card-title {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--grp-text);
    margin-bottom: 6px !important;
}

.gr-portal .card-desc {
    font-size: 14px !important;
    color: var(--grp-muted);
    line-height: 1.55 !important;
    margin-bottom: 18px !important;
}

.gr-portal .card-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 10px 22px !important;
    border-radius: var(--grp-radius-sm);
    text-decoration: none !important;
    color: #fff !important;
    border: none;
    cursor: pointer;
    transition: opacity .2s ease, transform .2s ease, box-shadow .2s ease;
}

.gr-portal .card-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px -6px rgba(239, 79, 75, 0.5);
}

.gr-portal .card-btn-edit { background: var(--grp-gradient); }
.gr-portal .card-btn-view { background: linear-gradient(135deg, #6c63ff 0%, #4f46e5 100%); }
.gr-portal .card-btn-view:hover { box-shadow: 0 8px 18px -6px rgba(79, 70, 229, 0.5); }

.gr-portal .card-btn .btn-icon { display: inline-flex; }
.gr-portal .card-btn svg, .gr-portal .card-btn svg path { fill: #fff; }

/* ---------- Table section ---------- */
.gr-portal .dashboard-table-section {
    background: var(--grp-card);
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius);
    box-shadow: var(--grp-shadow);
    padding: 26px 28px;
}

.gr-portal .table-title {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--grp-text);
    margin-bottom: 18px !important;
}

.gr-portal .dashboard-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.gr-portal .dashboard-table th {
    text-align: left;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--grp-muted);
    padding: 12px 14px;
    border-bottom: 1px solid var(--grp-border);
    white-space: nowrap;
}

.gr-portal .dashboard-table td {
    padding: 15px 14px;
    border-bottom: 1px solid var(--grp-border);
    color: var(--grp-text);
    vertical-align: middle;
}

.gr-portal .dashboard-table tbody tr:last-child td { border-bottom: none; }
.gr-portal .dashboard-table tbody tr:hover { background: #fafafa; }

/* Status badges */
.gr-portal .status-badge {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 50px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    text-transform: capitalize;
}

.gr-portal .status-badge.draft         { background: #eef0f3; color: #4b5563; }
.gr-portal .status-badge.submitted     { background: #cff4fc; color: #0c6e8e; }
.gr-portal .status-badge.in-review,
.gr-portal .status-badge.pending       { background: #e0e7ff; color: #3730a3; }
.gr-portal .status-badge.need-revision { background: #fef3c7; color: #92600a; }
.gr-portal .status-badge.approved,
.gr-portal .status-badge.published     { background: #d1fae5; color: #0f7a4d; }
.gr-portal .status-badge.rejected      { background: #fee2e2; color: #b42318; }

/* Small table buttons */
.gr-portal .table-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 7px 14px !important;
    border-radius: var(--grp-radius-sm);
    border: 1px solid var(--grp-border) !important;
    background: var(--grp-card) !important;
    color: var(--grp-text) !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: border-color .2s ease, color .2s ease;
}

.gr-portal .table-btn:hover {
    border-color: var(--grp-primary) !important;
    color: var(--grp-primary) !important;
}

.gr-portal .table-btn svg, .gr-portal .table-btn svg path { fill: currentColor; }

.gr-portal .badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 50px;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
}

.gr-portal .badge.bg-danger { background: var(--grp-primary); }

/* ---------- Feedback modal (sits outside .gr-portal in the DOM) ---------- */
.feedback-modal { display: none; }
.feedback-modal.active { display: block; }

.feedback-modal * {
    font-family: 'Inter', 'Poppins', system-ui, -apple-system, sans-serif !important;
    box-sizing: border-box;
}

.feedback-modal .modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(26, 26, 46, .55);
    z-index: 1050;
}

.feedback-modal .modal-content {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1055;
    background: #fff;
    border-radius: var(--grp-radius);
    width: min(560px, 94vw);
    max-height: 88vh;
    overflow-y: auto;
    box-shadow: 0 24px 60px rgba(26, 26, 46, .35);
}

.feedback-modal .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #eef0f3;
}

.feedback-modal .modal-header h3 {
    margin: 0 !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1a1a2e;
}

.feedback-modal .modal-header h3 span {
    background: var(--grp-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.feedback-modal .modal-body { padding: 24px; }
.feedback-modal .modal-feedback-box { font-size: 14px; color: #1a1a2e; line-height: 1.6; }

.feedback-modal .modal-description {
    background: #fdeef6;
    border-left: 4px solid var(--grp-accent);
    border-radius: 6px;
    padding: 14px 16px;
    margin: 0 0 16px !important;
    font-size: 14px;
    line-height: 1.6;
}

.feedback-modal .modal-footer { color: #6b7280; font-size: 13px; margin: 0; border: none; }

.feedback-modal .no-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    color: #6b7280;
    line-height: 0;
}

.feedback-modal .no-btn:hover { color: #1a1a2e; }

/* ---------- Forms (settings + login pages) ---------- */
.gr-portal .form-group { margin-bottom: 18px; }

.gr-portal .form-group label,
.gr-portal label {
    display: block;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--grp-text);
    margin-bottom: 7px !important;
}

.gr-portal .form-control,
.gr-portal input[type="text"],
.gr-portal input[type="email"],
.gr-portal input[type="url"],
.gr-portal input[type="password"],
.gr-portal input[type="date"],
.gr-portal select,
.gr-portal textarea {
    width: 100%;
    border: 1px solid #d8dbe2 !important;
    border-radius: var(--grp-radius-sm) !important;
    padding: 11px 14px !important;
    font-size: 14px !important;
    color: var(--grp-text) !important;
    background: #fff !important;
    outline: none;
    transition: border-color .2s ease, box-shadow .2s ease;
    height: auto !important;
}

.gr-portal .form-control:focus,
.gr-portal input:focus,
.gr-portal select:focus,
.gr-portal textarea:focus {
    border-color: var(--grp-primary) !important;
    box-shadow: 0 0 0 3px rgba(239, 79, 75, .12) !important;
}

.gr-portal .form-control[readonly] { background: #f3f4f6 !important; color: var(--grp-muted) !important; }
.gr-portal .form-control.is-invalid { border-color: var(--grp-primary) !important; }

.gr-portal .invalid-feedback {
    display: block;
    color: var(--grp-primary-dark);
    font-size: 12.5px;
    margin-top: 5px;
}

.gr-portal small, .gr-portal .text-muted small { font-size: 12.5px !important; color: var(--grp-muted); }
.gr-portal h4 { font-size: 17px !important; font-weight: 700 !important; color: var(--grp-text); }
.gr-portal h5 { font-size: 16px !important; font-weight: 700 !important; color: var(--grp-text); }

/* Buttons */
.gr-portal .btn-submit,
.gr-portal button[type="submit"].card-btn-edit,
.gr-portal .btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--grp-gradient) !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    border: none !important;
    border-radius: var(--grp-radius-sm) !important;
    padding: 13px 32px !important;
    cursor: pointer;
    text-decoration: none !important;
    transition: opacity .2s ease, transform .2s ease, box-shadow .2s ease;
}

.gr-portal .btn-submit:hover,
.gr-portal .btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px -6px rgba(239, 79, 75, 0.5);
}

.gr-portal .btn,
.gr-portal .btn-outline-secondary,
.gr-portal .btn-dark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: var(--grp-radius-sm) !important;
    padding: 10px 20px !important;
    cursor: pointer;
    text-decoration: none !important;
    border: 1px solid transparent;
    transition: opacity .2s ease;
}

.gr-portal .btn-dark { background: #1a1a2e !important; color: #fff !important; padding: 8px 16px !important; font-size: 13px !important; }
.gr-portal .btn-outline-secondary {
    background: #fff !important;
    border: 1px solid #d8dbe2 !important;
    color: var(--grp-text) !important;
}
.gr-portal .btn-outline-secondary:hover { border-color: var(--grp-primary) !important; color: var(--grp-primary) !important; }

.gr-portal .btn-register,
.gr-portal .btns {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff !important;
    border: 2px solid var(--grp-primary) !important;
    color: var(--grp-primary) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    border-radius: var(--grp-radius-sm) !important;
    padding: 11px 28px !important;
    text-decoration: none !important;
    transition: background .2s ease, color .2s ease;
}

.gr-portal .btn-register:hover { background: var(--grp-primary) !important; color: #fff !important; }

/* ---------- Brand login / login request ---------- */
.gr-portal .form-section,
.gr-portal .dashboard-card[style*="display:block"] {
    background: var(--grp-card);
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius);
    box-shadow: var(--grp-shadow);
    padding: 34px;
}

.gr-portal .form-section h2 {
    font-size: 26px !important;
    font-weight: 800 !important;
    color: var(--grp-text);
    margin-bottom: 22px !important;
}

.gr-portal .form-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 4px 0 22px;
    font-size: 13.5px;
}

.gr-portal .remember-me { display: flex; align-items: center; gap: 7px; color: var(--grp-muted); }
.gr-portal .remember-me input { width: auto !important; }
.gr-portal .remember-me label { margin: 0 !important; font-weight: 500 !important; color: var(--grp-muted); }

.gr-portal .forgot-password { color: var(--grp-primary) !important; font-weight: 600 !important; }
.gr-portal .forgot-password:hover { text-decoration: underline !important; }

.gr-portal .form-buttons { display: flex; gap: 14px; flex-wrap: wrap; }

.gr-portal .illustration-section { text-align: center; }
.gr-portal .illustration-section img { max-width: 100%; height: auto; }

.gr-portal .password-input { position: relative; }
.gr-portal .password-input .form-control,
.gr-portal .password-field { padding-right: 44px !important; }
.gr-portal .toggle-password {
    position: absolute !important;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none !important;
    border: none !important;
    cursor: pointer;
    color: var(--grp-muted) !important;
    padding: 4px !important;
    line-height: 0 !important;
}
.gr-portal .toggle-password:hover { color: var(--grp-text) !important; }

/* ---------- Store performance ---------- */
.gr-portal .dashboard-date-picker { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.gr-portal .dashboard-date-picker .form-control,
.gr-portal .dashboard-date-picker select { width: auto !important; }

.gr-portal .dashboard-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    background: var(--grp-card);
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius);
    box-shadow: var(--grp-shadow);
    padding: 20px;
    margin-bottom: 28px;
}

.gr-portal .dashboard-cards .dashboard-card {
    flex: 1 1 220px;
    border: none;
    border-radius: var(--grp-radius);
    color: #fff;
    padding: 20px 24px !important;
    box-shadow: none;
    min-width: 200px !important;
}

.gr-portal .dashboard-cards .dashboard-card:hover { transform: none; box-shadow: none; }

.gr-portal .dashboard-cards .card-label {
    font-size: 13px !important;
    font-weight: 600 !important;
    opacity: .95;
    margin: 0 0 4px !important;
    color: #fff;
}

.gr-portal .dashboard-cards .card-value {
    font-size: 30px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    color: #fff;
}

.gr-portal .dashboard-cards .card-change {
    display: inline-block;
    font-size: 12px !important;
    font-weight: 700 !important;
    border-radius: 50px;
    padding: 3px 10px !important;
    margin-top: 8px !important;
    background: rgba(255, 255, 255, .22);
    color: #fff;
}

.gr-portal .dashboard-cards .card-change.down { background: rgba(0, 0, 0, .18); }

.gr-portal .dashboard-charts {
    background: var(--grp-card);
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius);
    box-shadow: var(--grp-shadow);
    padding: 26px;
}

.gr-portal .main-chart { margin-bottom: 28px; }

.gr-portal .sub-charts {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.gr-portal .sub-chart-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--grp-text);
    margin-bottom: 10px !important;
}

.gr-portal .table { width: 100%; border-collapse: collapse; }
.gr-portal .table th {
    text-align: left;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--grp-muted);
    padding: 10px;
    border-bottom: 1px solid var(--grp-border);
}
.gr-portal .table td { padding: 12px 10px; border-bottom: 1px solid var(--grp-border); font-size: 14px; }
.gr-portal .table tbody tr:last-child td { border-bottom: none; }

/* Funnel / top-referrer panels */
.gr-portal .row { display: flex; flex-wrap: wrap; gap: 24px; margin: 0; }
.gr-portal .row > [class*="col-"] { flex: 1 1 380px; padding: 0; }
.gr-portal .p-4 {
    height: 100%;
    background: var(--grp-card) !important;
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius) !important;
    box-shadow: var(--grp-shadow) !important;
    padding: 24px !important;
}

/* ============================================================
   Edit Store page
   ============================================================ */
.gr-portal .es-topbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 28px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--grp-border);
}

.gr-portal .es-back {
    display: inline-block;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--grp-muted) !important;
    margin-bottom: 6px;
}
.gr-portal .es-back:hover { color: var(--grp-primary) !important; }

.gr-portal .es-actions { display: flex; gap: 12px; flex-wrap: wrap; }

.gr-portal .es-card {
    background: var(--grp-card);
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius);
    box-shadow: var(--grp-shadow);
    padding: 26px 28px;
    margin-bottom: 22px;
}

.gr-portal .es-card-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.gr-portal .es-card-head h4 {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--grp-text);
    margin: 0 !important;
}

.gr-portal .es-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--grp-gradient);
    color: #fff;
    font-size: 13px !important;
    font-weight: 700;
}

.gr-portal .es-count {
    margin-left: auto;
    font-size: 12px !important;
    font-weight: 600;
    color: var(--grp-muted);
    background: var(--grp-muted-light);
    padding: 3px 12px;
    border-radius: 50px;
}

.gr-portal .es-card-hint {
    font-size: 13px !important;
    color: var(--grp-muted);
    margin: -8px 0 18px !important;
    line-height: 1.5 !important;
}

.gr-portal .es-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 22px;
}
.gr-portal .es-grid-3 { grid-template-columns: repeat(3, 1fr); }
.gr-portal .es-grid .form-group { margin-bottom: 18px; }

.gr-portal .es-stat-group {
    background: #fafafb;
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius-sm);
    padding: 16px 16px 0;
}

.gr-portal .es-readonly-tag {
    display: inline-block;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--grp-muted);
    background: var(--grp-muted-light);
    padding: 2px 7px;
    border-radius: 4px;
    margin-left: 6px;
    vertical-align: middle;
}

/* Repeater items (How It Works / Features / FAQ) */
.gr-portal .es-repeat {
    background: #fafafb;
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius-sm);
    padding: 18px 18px 0;
    margin-bottom: 14px;
}

.gr-portal .es-repeat-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.gr-portal .es-repeat-head strong {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: var(--grp-text);
}

.gr-portal .es-repeat .form-group { margin-bottom: 14px; }
.gr-portal .es-repeat .form-group.mb-0 { margin-bottom: 18px; }

.gr-portal .es-remove {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--grp-primary) !important;
    background: #fff !important;
    border: 1px solid #f3c9c8 !important;
    border-radius: 8px !important;
    padding: 5px 14px !important;
    cursor: pointer;
    transition: background .2s ease, color .2s ease;
}
.gr-portal .es-remove:hover { background: var(--grp-primary) !important; color: #fff !important; border-color: var(--grp-primary) !important; }

.gr-portal .es-add {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--grp-primary) !important;
    background: #fff !important;
    border: 1px dashed var(--grp-primary) !important;
    border-radius: var(--grp-radius-sm) !important;
    padding: 10px 20px !important;
    cursor: pointer;
    transition: background .2s ease;
}
.gr-portal .es-add:hover { background: #fff4f3 !important; }

.gr-portal .es-footer-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 8px;
    padding-top: 22px;
    border-top: 1px solid var(--grp-border);
}

/* Toasts (edit store) */
.es-toast-container {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.es-toast {
    min-width: 240px;
    max-width: 360px;
    padding: 12px 18px;
    border-radius: var(--grp-radius-sm);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    font-family: 'Inter', 'Poppins', system-ui, sans-serif;
    box-shadow: 0 6px 18px rgba(0,0,0,.18);
    opacity: 0;
    transform: translateX(20px);
    transition: opacity .25s ease, transform .25s ease;
}
.es-toast.show { opacity: 1; transform: translateX(0); }
.es-toast.success { background: #0f7a4d; }
.es-toast.error { background: var(--grp-primary); }

/* ---------- Responsive ---------- */
@media (max-width: 860px) {
    .gr-portal .es-grid, .gr-portal .es-grid-3 { grid-template-columns: 1fr; }
    .gr-portal .es-card { padding: 22px 18px; }
    .gr-portal .es-actions { width: 100%; }
    .gr-portal { padding: 26px 0 44px; }
    .gr-portal .dashboard-title { font-size: 24px !important; }
    .gr-portal .dashboard-cards-row { grid-template-columns: 1fr; }
    .gr-portal .sub-charts { grid-template-columns: 1fr; }
    .gr-portal .dashboard-card { padding: 22px; }
    .gr-portal .form-section { padding: 24px 20px; }
    .gr-portal .dashboard-table th, .gr-portal .dashboard-table td { padding: 11px 8px; }
}

/* ============================================================
   Store performance (v4): period KPIs, traffic chart, top codes
   ============================================================ */
.gr-portal .sp-back {
    display: inline-block;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--grp-muted) !important;
    margin-bottom: 8px;
}
.gr-portal .sp-back:hover { color: var(--grp-primary) !important; }

.gr-portal .sp-header { align-items: flex-end; margin-bottom: 24px; }
.gr-portal .sp-range { font-size: 14px !important; color: var(--grp-muted); margin-top: 6px !important; }
.gr-portal .sp-range strong { color: var(--grp-text); }

.gr-portal .sp-controls .form-control { height: 42px; min-width: 0; }
.gr-portal .sp-custom { display: inline-flex; gap: 8px; flex-wrap: wrap; }
.gr-portal .sp-custom[hidden] { display: none; }

.gr-portal .sp-btn {
    display: inline-flex !important;
    align-items: center;
    height: 42px;
    padding: 0 18px !important;
    border-radius: 50px !important;
    border: 1px solid var(--grp-border) !important;
    background: var(--grp-card) !important;
    color: var(--grp-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    white-space: nowrap;
}
.gr-portal .sp-btn:hover { border-color: var(--grp-primary) !important; color: var(--grp-primary) !important; }
.gr-portal .sp-btn--primary { background: var(--grp-gradient) !important; color: #fff !important; border-color: transparent !important; }
.gr-portal .sp-btn--primary:hover { color: #fff !important; opacity: .92; }

.gr-portal .sp-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
    transition: opacity .15s ease;
}
.gr-portal .sp-kpis.is-loading { opacity: .5; }

.gr-portal .sp-kpi {
    background: var(--grp-card);
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius);
    box-shadow: var(--grp-shadow);
    padding: 20px 22px;
    min-width: 0;
}
.gr-portal .sp-kpi__label { font-size: 13px; font-weight: 600; color: var(--grp-muted); }
.gr-portal .sp-kpi__value {
    font-size: 32px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.02em;
    margin: 6px 0 8px;
    color: var(--grp-text);
    font-variant-numeric: tabular-nums;
}
.gr-portal .sp-kpi__change {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    border-radius: 50px;
    padding: 3px 10px;
    background: var(--grp-muted-light);
    color: var(--grp-muted);
}
.gr-portal .sp-kpi__change.is-up { background: #d1fae5; color: #0f7a4d; }
.gr-portal .sp-kpi__change.is-down { background: #fee2e2; color: #b42318; }
.gr-portal .sp-kpi__hint { font-size: 12px; color: var(--grp-muted); margin-top: 10px; line-height: 1.5; }

.gr-portal .sp-panel {
    background: var(--grp-card);
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius);
    box-shadow: var(--grp-shadow);
    padding: 22px 24px;
    margin-bottom: 24px;
    min-width: 0;
}
.gr-portal .sp-panel__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-bottom: 16px;
}
.gr-portal .sp-panel__head h3 { font-size: 17px !important; }
.gr-portal .sp-note { font-size: 13px; color: var(--grp-muted); }
.gr-portal .sp-note strong { color: var(--grp-text); }

.gr-portal .sp-legend { display: flex; gap: 16px; font-size: 13px; color: var(--grp-muted); }
.gr-portal .sp-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: middle; }

/* Container-sized charts: the .gr-portal reset clears main.css's global
   max-height, which Chart.js 2.7 would otherwise read as a 1px limit. */
.gr-portal .sp-chart { position: relative; width: 100%; }
.gr-portal .sp-chart--main { height: 320px; }
.gr-portal .sp-chart--small { height: 220px; }

.gr-portal .sp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.gr-portal .sp-grid .sp-panel { margin-bottom: 0; }
.gr-portal .sp-table code { font-size: 13px; background: var(--grp-muted-light); padding: 2px 6px; border-radius: 6px; word-break: break-all; }

.gr-portal .sp-footnote { font-size: 12px; color: var(--grp-muted); margin-top: 20px !important; }

@media (max-width: 960px) {
    .gr-portal .sp-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gr-portal .sp-grid { grid-template-columns: 1fr; }
    .gr-portal .sp-grid .sp-panel { margin-bottom: 0; }
}
@media (max-width: 520px) {
    .gr-portal .sp-kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
    .gr-portal .sp-kpi { padding: 14px; }
    .gr-portal .sp-kpi__value { font-size: 24px; }
    .gr-portal .sp-kpi__hint { display: none; }
    .gr-portal .sp-panel { padding: 18px 16px; }
    .gr-portal .sp-chart--main { height: 240px; }
    .gr-portal .sp-controls { width: 100%; }
    .gr-portal .sp-controls select { flex: 1 1 100%; width: 100% !important; }
}

/* Edit store: draft state, errors, current images */
.gr-portal .es-draft-banner {
    display: flex;
    flex-direction: column;
    gap: 4px;
    border: 1px solid #c7d2fe;
    background: #eef2ff;
    color: #3730a3;
    border-radius: var(--grp-radius-sm);
    padding: 14px 18px;
    font-size: 14px;
    margin-bottom: 22px;
}
.gr-portal .es-draft-banner--need-revision,
.gr-portal .es-draft-banner--rejected { border-color: #fde68a; background: #fef3c7; color: #92600a; }
.gr-portal .es-draft-feedback {
    margin: 8px 0 0;
    padding: 10px 14px;
    background: rgba(255,255,255,.7);
    border-left: 3px solid currentColor;
    border-radius: 6px;
    white-space: pre-wrap;
    color: var(--grp-text);
}
.gr-portal .es-required { color: var(--grp-primary); font-weight: 700; }
.gr-portal .es-current-image {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    font-size: 12px;
    color: var(--grp-muted) !important;
}
.gr-portal .es-current-image img {
    width: 64px;
    height: 44px !important;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid var(--grp-border);
}
.gr-portal .es-actions button:disabled,
.gr-portal .es-footer-actions button:disabled { opacity: .6; cursor: wait; }

.gr-portal .sp-controls { flex-wrap: nowrap; }
.gr-portal .sp-controls select.form-control { width: 190px !important; flex: 0 0 auto; }
.gr-portal .sp-custom .form-control { width: 150px !important; }
.gr-portal .sp-table,
.gr-portal .sp-table th,
.gr-portal .sp-table td { border-left: none !important; border-right: none !important; border-top: none !important; text-align: left !important; }
.gr-portal .sp-table td { vertical-align: middle; }
@media (max-width: 960px) {
    .gr-portal .sp-controls { flex-wrap: wrap; }
}
@media (max-width: 520px) {
    .gr-portal .sp-controls select.form-control { width: 100% !important; flex: 1 1 100%; }
}

/* ============================================================
   Phase B: brand dashboard (bd-*), claim page (bc-*),
   performance benchmarks (sp-grid--3, sp-bench, sp-countries)
   ============================================================ */
.gr-portal .bd-store {
    background: var(--grp-card);
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius);
    box-shadow: var(--grp-shadow);
    padding: 24px;
    margin-bottom: 28px;
}
.gr-portal .bd-store__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 14px 20px;
    margin-bottom: 20px;
}
.gr-portal .bd-store__name { font-size: 22px !important; }
.gr-portal .bd-store__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    margin-top: 6px;
    font-size: 13px;
    color: var(--grp-muted);
}
.gr-portal .bd-store__meta a { color: var(--grp-primary) !important; font-weight: 600; }
.gr-portal .bd-store__meta a:hover { text-decoration: underline !important; }
.gr-portal .bd-store__actions { display: flex; flex-wrap: wrap; gap: 8px; }

.gr-portal .bd-btn {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 16px !important;
    border-radius: 50px !important;
    border: 1px solid var(--grp-border) !important;
    background: var(--grp-card) !important;
    color: var(--grp-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    white-space: nowrap;
}
.gr-portal .bd-btn:hover { border-color: var(--grp-primary) !important; color: var(--grp-primary) !important; }
.gr-portal .bd-btn--primary { background: var(--grp-gradient) !important; color: #fff !important; border-color: transparent !important; }
.gr-portal .bd-btn--primary:hover { color: #fff !important; opacity: .92; }
.gr-portal .bd-count {
    display: inline-block;
    min-width: 20px;
    padding: 1px 7px;
    border-radius: 999px;
    background: var(--grp-primary);
    color: #fff;
    font-size: 12px;
    line-height: 18px;
    text-align: center;
}

.gr-portal .bd-pill {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    background: #eef2ff;
    color: #3730a3;
}
.gr-portal .bd-pill--need-revision,
.gr-portal .bd-pill--rejected { background: #fef3c7; color: #92600a; }

.gr-portal .bd-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.gr-portal .bd-kpi {
    background: var(--grp-muted-light);
    border-radius: var(--grp-radius-sm);
    padding: 14px 16px;
    min-width: 0;
}
.gr-portal .bd-kpi__label { font-size: 12px; font-weight: 600; color: var(--grp-muted); }
.gr-portal .bd-kpi__value {
    font-size: 26px;
    font-weight: 800;
    line-height: 1.2;
    margin: 4px 0 6px;
    color: var(--grp-text);
    font-variant-numeric: tabular-nums;
}
.gr-portal .bd-trend { font-size: 12px; font-weight: 600; color: var(--grp-muted); }
.gr-portal .bd-trend.is-up { color: #0f7a4d; }
.gr-portal .bd-trend.is-down { color: #b42318; }
.gr-portal .bd-range { font-size: 12px; color: var(--grp-muted); margin: 10px 0 20px !important; }

.gr-portal .bd-complete {
    border: 1px solid var(--grp-border);
    border-radius: var(--grp-radius-sm);
    padding: 16px 18px;
}
.gr-portal .bd-complete__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; }
.gr-portal .bd-complete__title { font-weight: 700; font-size: 15px; }
.gr-portal .bd-complete__sub { font-size: 13px; color: var(--grp-muted); }
.gr-portal .bd-complete__score { font-size: 24px; font-weight: 800; }
.gr-portal .bd-meter { height: 8px; border-radius: 999px; background: var(--grp-muted-light); overflow: hidden; }
.gr-portal .bd-meter span { display: block; height: 100%; border-radius: 999px; background: var(--grp-gradient); }
.gr-portal .bd-todo { list-style: none; padding: 0; margin: 14px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 20px; }
.gr-portal .bd-todo li { font-size: 14px; padding-left: 22px; position: relative; }
.gr-portal .bd-todo li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 5px;
    width: 12px;
    height: 12px;
    border: 2px solid var(--grp-border);
    border-radius: 50%;
}
.gr-portal .bd-todo a { color: var(--grp-text) !important; }
.gr-portal .bd-todo a:hover { color: var(--grp-primary) !important; text-decoration: underline !important; }
.gr-portal .bd-todo__more,
.gr-portal .bd-todo__done { font-size: 13px; color: var(--grp-muted); margin-top: 10px !important; }

/* Claim page */
.gr-portal .bc-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 40px; align-items: start; }
.gr-portal .bc-eyebrow {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--grp-primary);
    background: #fff1f0;
    border-radius: 999px;
    padding: 4px 12px;
    margin-bottom: 14px;
}
.gr-portal .bc-title { font-size: 36px !important; font-weight: 800 !important; letter-spacing: -0.02em; }
.gr-portal .bc-title span {
    background: var(--grp-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
.gr-portal .bc-lead { font-size: 17px !important; color: var(--grp-muted); margin: 14px 0 24px !important; }
.gr-portal .bc-benefits { list-style: none; padding: 0; margin: 0 0 24px; display: grid; gap: 16px; }
.gr-portal .bc-benefits li { padding-left: 34px; position: relative; display: flex; flex-direction: column; gap: 2px; }
.gr-portal .bc-benefits li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 2px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--grp-gradient);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 100 20 10 10 0 000-20zm-1.2 14.2l-4-4 1.4-1.4 2.6 2.6 5.6-5.6 1.4 1.4-7 7z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 100 20 10 10 0 000-20zm-1.2 14.2l-4-4 1.4-1.4 2.6 2.6 5.6-5.6 1.4 1.4-7 7z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.gr-portal .bc-benefits strong { font-size: 16px; }
.gr-portal .bc-benefits span { font-size: 14px; color: var(--grp-muted); line-height: 1.55; }
.gr-portal .bc-note { font-size: 14px; color: var(--grp-muted); }
.gr-portal .bc-note a { color: var(--grp-primary) !important; font-weight: 600; }
.gr-portal .bc-form h2 { font-size: 22px !important; margin-bottom: 6px !important; }
.gr-portal .bc-form__hint { font-size: 14px; color: var(--grp-muted); margin-bottom: 18px !important; }
.gr-portal .bc-form__hint--small { font-size: 13px; margin: 12px 0 0 !important; text-align: center; }
.gr-portal .bc-form .btn-submit { width: 100% !important; }

/* Performance: benchmarks row */
.gr-portal .sp-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 24px; }
.gr-portal .sp-big { font-size: 34px; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; }
.gr-portal .sp-big small { font-size: 16px; font-weight: 600; color: var(--grp-muted); }
.gr-portal .sp-sub { font-size: 14px; color: var(--grp-muted); margin-top: 6px !important; }
.gr-portal .sp-sub--change { color: var(--grp-text); font-weight: 600; }
.gr-portal .sp-sub--muted { font-size: 13px; }
.gr-portal .sp-empty { font-size: 14px; color: var(--grp-muted); }
.gr-portal .sp-bench { margin-top: 16px; display: grid; gap: 10px; }
.gr-portal .sp-bench__row,
.gr-portal .sp-countries li {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr) 56px;
    align-items: center;
    gap: 10px;
    font-size: 13px;
}
.gr-portal .sp-bench__row b,
.gr-portal .sp-countries b { text-align: right; font-variant-numeric: tabular-nums; }
.gr-portal .sp-bar { height: 8px; border-radius: 999px; background: var(--grp-muted-light); overflow: hidden; }
.gr-portal .sp-bar i { display: block; height: 100%; border-radius: 999px; background: var(--grp-gradient); }
.gr-portal .sp-bar--muted i { background: #c7c9d1; }
.gr-portal .sp-countries { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.gr-portal .sp-countries li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 960px) {
    .gr-portal .bd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gr-portal .bc-layout { grid-template-columns: 1fr; gap: 28px; }
    .gr-portal .sp-grid--3 { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .gr-portal .bd-store { padding: 18px 16px; }
    .gr-portal .bd-store__actions { width: 100%; }
    .gr-portal .bd-store__actions .bd-btn { flex: 1 1 auto; justify-content: center; }
    .gr-portal .bd-kpi__value { font-size: 22px; }
    .gr-portal .bd-todo { grid-template-columns: 1fr; }
    .gr-portal .bc-title { font-size: 28px !important; }
}
.gr-portal .sp-countries li { grid-template-columns: minmax(0, 128px) minmax(0, 1fr) 52px; }

/* ============================================================
   Phase C: codes page (bcode-*), rewards page (brw-*)
   ============================================================ */
.gr-portal .bc-kpis-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gr-portal .bd-pill--ok { background: #d1fae5; color: #0f7a4d; }
.gr-portal .bcode-utm__toggle { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; cursor: pointer; }
.gr-portal .bcode-utm__toggle input { width: auto !important; margin-top: 5px; }
.gr-portal .bcode-utm code,
.gr-portal .bcode-table code { font-size: 13px; background: var(--grp-muted-light); padding: 2px 6px; border-radius: 6px; word-break: break-all; }
.gr-portal .bcode-table td { vertical-align: top; }
.gr-portal .bcode-table tr.is-expired td { color: var(--grp-muted); }
.gr-portal .bcode-flag summary {
    cursor: pointer;
    color: var(--grp-primary);
    font-weight: 600;
    font-size: 13px;
    list-style: none;
    white-space: nowrap;
}
.gr-portal .bcode-flag summary::-webkit-details-marker { display: none; }
.gr-portal .bcode-flag[open] summary { margin-bottom: 8px; }
.gr-portal .bcode-flag form { display: grid; gap: 8px; min-width: 240px; }
.gr-portal .bcode-flag label { font-size: 12px; font-weight: 600; color: var(--grp-muted); margin: 0; }
.gr-portal .bcode-link { color: var(--grp-primary) !important; font-size: 13px; font-weight: 600; }
.gr-portal .bcode-link:hover { text-decoration: underline !important; }
.gr-portal .brw-form { display: block; }
.gr-portal .brw-codes { font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important; font-size: 13px !important; }
@media (max-width: 960px) {
    .gr-portal .bc-kpis-3 { grid-template-columns: 1fr; }
}
.gr-portal .brw-form select.form-control,
.gr-portal .brw-form input[type=date].form-control { height: 44px !important; color: var(--grp-text) !important; background-color: var(--grp-card) !important; }