/* AYIN Account Pages Admin Identity Rollout R27T
 * Applies the approved dashboard identity to all authenticated user pages.
 * Scoped to the frontend account shell only. Filament/admin is excluded.
 */
:root {
    --r27t-navy: #061f43;
    --r27t-navy-deep: #04172f;
    --r27t-navy-soft: #0b315f;
    --r27t-gold: #efc75e;
    --r27t-gold-soft: #f8e7b2;
    --r27t-blue-soft: #edf4fc;
    --r27t-green: #158647;
    --r27t-ink: #0a2447;
    --r27t-muted: #718097;
    --r27t-border: #e5d9c2;
    --r27t-card: #fffefa;
    --r27t-shadow: 0 14px 36px rgba(5,31,67,.075);
    --r27t-shadow-hover: 0 20px 44px rgba(5,31,67,.12);
}

/* Shared page rhythm after the frozen dashboard identity. */
body.ayin-page.ayin-account-shell-page .main-content {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

body.ayin-page.ayin-account-shell-page .main-content > * {
    min-width: 0;
}

/* Compact primary heroes: same navy/gold language as the dashboard. */
body.ayin-page.ayin-account-shell-page :is(
    .hero-dashboard,
    .utility-hero,
    .profile-hero,
    .order-success-card
) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 166px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin: 0;
    padding: 24px 27px;
    border: 1px solid rgba(239,199,94,.13);
    border-radius: 20px;
    color: #fff;
    background:
        url('../images/ayin/motifs/primary-corner-r27d.svg') left top / 370px auto no-repeat,
        linear-gradient(112deg, #10283f 0%, #082f5f 57%, #061f43 100%);
    box-shadow: 0 22px 55px rgba(5,31,67,.15);
}

body.ayin-page.ayin-account-shell-page :is(
    .hero-dashboard,
    .utility-hero,
    .profile-hero,
    .order-success-card
)::after {
    content: '';
    position: absolute;
    z-index: -1;
    inset-inline-end: -120px;
    inset-block-start: -155px;
    width: 250px;
    height: 250px;
    border: 1px solid rgba(239,199,94,.13);
    border-radius: 50%;
    pointer-events: none;
}

body.ayin-page.ayin-account-shell-page :is(.hero-dashboard,.utility-hero,.profile-hero) > div:first-child {
    min-width: 0;
    flex: 1 1 auto;
}

body.ayin-page.ayin-account-shell-page :is(.hero-dashboard,.utility-hero,.profile-hero,.order-success-card) h1 {
    margin: 5px 0 7px;
    color: #fff;
    font-size: clamp(31px, 3vw, 43px);
    line-height: 1.18;
    font-weight: 900;
}

body.ayin-page.ayin-account-shell-page :is(.hero-dashboard,.utility-hero,.profile-hero,.order-success-card) p {
    max-width: 650px;
    margin: 0;
    color: rgba(255,255,255,.69);
    font-size: 14px;
    line-height: 1.8;
}

body.ayin-page.ayin-account-shell-page :is(.hero-eyebrow,.section-kicker,.product-meta) {
    color: #d8b861;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .01em;
}

body.ayin-page.ayin-account-shell-page :is(.referral-box,.profile-completion-card,.support-status) {
    flex: 0 0 auto;
    width: min(310px, 38%);
    padding: 14px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 14px;
    color: #fff;
    background: rgba(255,255,255,.085);
    backdrop-filter: blur(5px);
}

body.ayin-page.ayin-account-shell-page .referral-code {
    margin-block-start: 9px;
    padding: 10px 12px;
    border-radius: 10px;
    color: var(--r27t-ink);
    background: #fff;
    font-size: 13px;
    font-weight: 800;
}

/* Shared card language, deliberately targeted so the approved dashboard is not rewritten. */
body.ayin-page.ayin-account-shell-page :is(
    .store-filter-card,
    .product-card,
    .product-details-image,
    .product-details-info,
    .cart-items-card,
    .order-summary-card,
    .checkout-section-card,
    .checkout-summary,
    .wallet-transactions-card,
    .withdrawal-live-card,
    .withdrawals-history-card,
    .balance-overview-card,
    .direct-profit-overview,
    .profits-table-card,
    .tree-workspace-card,
    .agency-current-card,
    .tree-rules-card,
    .agencies-table-card,
    .profile-tabs-card,
    .notifications-panel,
    .support-ticket-card,
    .support-faq-card,
    .orders-list-card,
    .order-items-panel,
    .order-summary-panel,
    .catalog-empty
) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid var(--r27t-border);
    border-radius: 17px;
    background:
        url('../images/ayin/motifs/secondary-corner-r27d.svg') right top / 220px auto no-repeat,
        linear-gradient(180deg, #fff, var(--r27t-card));
    box-shadow: var(--r27t-shadow);
}

body.ayin-page.ayin-account-shell-page :is(
    .product-card,
    .support-channel-card,
    .notification-item,
    .tree-summary-card,
    .profit-summary-card,
    .wallet-live-card
) {
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

body.ayin-page.ayin-account-shell-page :is(
    .product-card,
    .support-channel-card,
    .notification-item,
    .tree-summary-card,
    .profit-summary-card,
    .wallet-live-card
):hover {
    transform: translateY(-3px);
    border-color: rgba(205,168,73,.48);
    box-shadow: var(--r27t-shadow-hover);
}

body.ayin-page.ayin-account-shell-page :is(
    .ayin-section-title,
    .utility-section-head h2,
    .profile-section-heading h2,
    .profits-section-head h2,
    .tree-workspace-head h2
) {
    margin: 0;
    color: var(--r27t-ink);
    font-size: clamp(22px, 2vw, 29px);
    line-height: 1.25;
    font-weight: 900;
}

body.ayin-page.ayin-account-shell-page :is(
    .store-filter-head,
    .utility-section-head,
    .profits-section-head,
    .tree-workspace-head,
    .cart-items-card-head,
    .profile-section-heading
) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-block-end: 16px;
}

/* Store */
body.ayin-page.ayin-account-shell-page .store-filter-card { padding: 18px; }
body.ayin-page.ayin-account-shell-page .store-category-links { display:flex; flex-wrap:wrap; gap:8px; }
body.ayin-page.ayin-account-shell-page .store-chip {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid #e3e8ef;
    border-radius: 999px;
    color: #65758b;
    background: rgba(255,255,255,.88);
    font-size: 11px;
    font-weight: 800;
}
body.ayin-page.ayin-account-shell-page .store-chip:hover,
body.ayin-page.ayin-account-shell-page .store-chip.active {
    border-color: rgba(205,168,73,.58);
    color: var(--r27t-ink);
    background: linear-gradient(135deg,#fff7da,#ead195);
}
body.ayin-page.ayin-account-shell-page .store-search {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 10px;
    margin-block-start: 14px;
}
body.ayin-page.ayin-account-shell-page .store-search input,
body.ayin-page.ayin-account-shell-page :is(.profile-field,.support-form label,.checkout-form-grid label) :is(input,select,textarea),
body.ayin-page.ayin-account-shell-page .quantity-control {
    border: 1px solid #dfe5ed;
    border-radius: 12px;
    color: var(--r27t-ink);
    background: rgba(255,255,255,.94);
}
body.ayin-page.ayin-account-shell-page .store-search input { min-height: 48px; padding: 0 15px; }
body.ayin-page.ayin-account-shell-page .store-search button {
    min-width: 100px;
    border: 0;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(135deg,#1763c3,#0b3f88);
    font-weight: 900;
}
body.ayin-page.ayin-account-shell-page .products-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 14px;
}
body.ayin-page.ayin-account-shell-page .product-card { min-width:0; display:flex; flex-direction:column; }
body.ayin-page.ayin-account-shell-page .product-image {
    min-height: 210px;
    display:grid;
    place-items:center;
    border-bottom: 1px solid rgba(229,217,194,.8);
    font-size: 70px;
    background: linear-gradient(145deg,#f6f9fd,#fffaf0);
}
body.ayin-page.ayin-account-shell-page .product-content { display:flex; flex:1; flex-direction:column; gap:8px; padding:17px; }
body.ayin-page.ayin-account-shell-page .product-content h3 { margin:0; color:var(--r27t-ink); font-size:19px; font-weight:900; }
body.ayin-page.ayin-account-shell-page .product-content p { color:var(--r27t-muted); font-size:12px; line-height:1.75; }
body.ayin-page.ayin-account-shell-page .product-footer { margin-block-start:auto; padding-block-start:12px; border-top:1px solid #edf0f4; }
body.ayin-page.ayin-account-shell-page .product-price-main { color:var(--r27t-ink); font-size:21px; font-weight:900; }
body.ayin-page.ayin-account-shell-page .product-points-inline { color:var(--r27t-green); font-weight:900; }

/* Product details */
body.ayin-page.ayin-account-shell-page .product-details-layout {
    display:grid;
    grid-template-columns:minmax(330px,.9fr) minmax(0,1.15fr);
    gap:16px;
}
body.ayin-page.ayin-account-shell-page :is(.product-details-image,.product-details-info) { padding:24px; }
body.ayin-page.ayin-account-shell-page .product-details-image { min-height:520px; display:grid; place-items:center; align-content:center; gap:20px; }
body.ayin-page.ayin-account-shell-page .big-product-icon { font-size:130px; }
body.ayin-page.ayin-account-shell-page .product-details-info h1 { margin:12px 0; color:var(--r27t-ink); font-size:clamp(32px,4vw,50px); font-weight:900; }
body.ayin-page.ayin-account-shell-page .price-row { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:20px 0; }
body.ayin-page.ayin-account-shell-page .price-row strong { color:#1654a6; font-size:32px; font-weight:900; }
body.ayin-page.ayin-account-shell-page .price-row span { padding:7px 12px; border-radius:999px; color:var(--r27t-green); background:#e7f8ed; font-weight:900; }
body.ayin-page.ayin-account-shell-page .product-benefits { display:grid; gap:8px; margin:18px 0; padding:16px; border-radius:14px; background:#f5f8fc; }

/* Cart + checkout + orders */
body.ayin-page.ayin-account-shell-page :is(.cart-layout,.checkout-layout,.order-details-layout) {
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(285px,.72fr);
    gap:16px;
    align-items:start;
}
body.ayin-page.ayin-account-shell-page :is(.cart-items-card,.order-summary-card,.checkout-section-card,.checkout-summary,.order-items-panel,.order-summary-panel) { padding:20px; }
body.ayin-page.ayin-account-shell-page .cart-item-v3,
body.ayin-page.ayin-account-shell-page .order-detail-item {
    display:grid;
    grid-template-columns:90px minmax(0,1fr) auto;
    gap:14px;
    align-items:center;
    padding:15px 0;
    border-bottom:1px solid #e9edf2;
}
body.ayin-page.ayin-account-shell-page .cart-item-v3:last-child,
body.ayin-page.ayin-account-shell-page .order-detail-item:last-child { border-bottom:0; }
body.ayin-page.ayin-account-shell-page .cart-v3-image,
body.ayin-page.ayin-account-shell-page .order-detail-icon {
    width:76px;
    height:76px;
    display:grid;
    place-items:center;
    border-radius:14px;
    background:#eef4fb;
    font-size:34px;
}
body.ayin-page.ayin-account-shell-page .summary-row,
body.ayin-page.ayin-account-shell-page .order-summary-panel > div:not(.order-address-block) {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:10px 0;
    color:var(--r27t-muted);
    border-bottom:1px solid #edf0f4;
}
body.ayin-page.ayin-account-shell-page :is(.summary-total,.checkout-total,.order-summary-total) {
    margin-block-start:12px;
    padding:14px !important;
    border:0 !important;
    border-radius:13px;
    color:#fff !important;
    background:linear-gradient(135deg,var(--r27t-navy),var(--r27t-navy-soft));
}
body.ayin-page.ayin-account-shell-page .checkout-progress { display:flex; align-items:center; gap:12px; }
body.ayin-page.ayin-account-shell-page .checkout-progress > * { min-width:48px; min-height:42px; display:grid; place-items:center; border-radius:11px; color:#fff; background:rgba(255,255,255,.1); font-weight:900; }
body.ayin-page.ayin-account-shell-page .checkout-progress .active { color:var(--r27t-navy-deep); background:var(--r27t-gold); }
body.ayin-page.ayin-account-shell-page .checkout-main-column { display:grid; gap:16px; }
body.ayin-page.ayin-account-shell-page .checkout-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
body.ayin-page.ayin-account-shell-page .checkout-field-wide { grid-column:1/-1; }
body.ayin-page.ayin-account-shell-page .checkout-payment-options { display:grid; gap:10px; }
body.ayin-page.ayin-account-shell-page .checkout-payment-option {
    display:flex;
    align-items:center;
    gap:13px;
    padding:14px;
    border:1px solid #e1e6ed;
    border-radius:13px;
    background:#fff;
}
body.ayin-page.ayin-account-shell-page .checkout-payment-option.active { border-color:#8db4e8; background:#eef5ff; box-shadow:0 0 0 3px rgba(21,89,183,.08); }
body.ayin-page.ayin-account-shell-page .checkout-payment-icon,
body.ayin-page.ayin-account-shell-page .order-detail-icon {
    color:#fff;
    background:linear-gradient(145deg,var(--r27t-navy-soft),var(--r27t-navy-deep));
}
body.ayin-page.ayin-account-shell-page .orders-list-card { padding:12px 18px; overflow-x:auto; }
body.ayin-page.ayin-account-shell-page :is(.orders-table-head,.orders-table-row) {
    min-width:800px;
    display:grid;
    grid-template-columns:1.15fr 1.1fr .8fr 1fr .8fr .8fr .5fr;
    gap:12px;
    align-items:center;
    padding:14px 8px;
}
body.ayin-page.ayin-account-shell-page .orders-table-head { color:#806a3b; border-bottom:1px solid var(--r27t-border); background:#fff9eb; font-size:11px; font-weight:900; }
body.ayin-page.ayin-account-shell-page .orders-table-row { border-bottom:1px solid #edf0f4; color:#5e6d82; font-size:12px; }

/* Wallet */
body.ayin-page.ayin-account-shell-page .wallet-live-summary,
body.ayin-page.ayin-account-shell-page .profits-summary-grid,
body.ayin-page.ayin-account-shell-page .tree-summary-grid,
body.ayin-page.ayin-account-shell-page .notification-summary-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}
body.ayin-page.ayin-account-shell-page :is(.wallet-live-card,.profit-summary-card,.tree-summary-card,.notification-summary-card) {
    position:relative;
    overflow:hidden;
    min-height:132px;
    padding:18px;
    border:1px solid var(--r27t-border);
    border-radius:16px;
    background:
        url('../images/ayin/motifs/stat-corner-r27d.svg') right center / auto 112% no-repeat,
        linear-gradient(180deg,#fff,#fffdf9);
    box-shadow:var(--r27t-shadow);
}
body.ayin-page.ayin-account-shell-page :is(.wallet-live-card,.profit-summary-card,.tree-summary-card) :is(.wallet-live-icon,.profit-summary-icon,.tree-summary-icon),
body.ayin-page.ayin-account-shell-page .notification-summary-card::before {
    color:#fff;
    background:linear-gradient(145deg,var(--r27t-navy-soft),var(--r27t-navy-deep));
}
body.ayin-page.ayin-account-shell-page .wallet-live-layout,
body.ayin-page.ayin-account-shell-page .profits-main-grid,
body.ayin-page.ayin-account-shell-page .tree-bottom-grid {
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
    gap:16px;
    align-items:start;
}
body.ayin-page.ayin-account-shell-page :is(.wallet-transactions-card,.withdrawal-live-card,.withdrawals-history-card) { padding:20px; }
body.ayin-page.ayin-account-shell-page .wallet-live-transaction,
body.ayin-page.ayin-account-shell-page .withdrawal-history-row {
    display:grid;
    grid-template-columns:42px minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    padding:12px 0;
    border-bottom:1px solid #edf0f4;
}
body.ayin-page.ayin-account-shell-page .wallet-live-icon {
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border-radius:11px;
    color:#fff;
    background:linear-gradient(145deg,var(--r27t-navy-soft),var(--r27t-navy-deep));
}

/* Profits */
body.ayin-page.ayin-account-shell-page .profits-header-actions,
body.ayin-page.ayin-account-shell-page .tree-hero-actions { display:flex; flex-wrap:wrap; gap:9px; }
body.ayin-page.ayin-account-shell-page .branch-points-grid,
body.ayin-page.ayin-account-shell-page .direct-profit-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
body.ayin-page.ayin-account-shell-page .branch-points { padding:15px; border:1px solid #e2e7ed; border-radius:14px; background:#f9fbfd; }
body.ayin-page.ayin-account-shell-page .balance-progress-track,
body.ayin-page.ayin-account-shell-page .agency-progress-track { height:8px; overflow:hidden; border-radius:999px; background:#e8edf3; }
body.ayin-page.ayin-account-shell-page .balance-progress-track > span,
body.ayin-page.ayin-account-shell-page .agency-progress-track > span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#1763c3,#efc75e); }
body.ayin-page.ayin-account-shell-page .profits-table-card,
body.ayin-page.ayin-account-shell-page .agencies-table-card { padding:20px; }
body.ayin-page.ayin-account-shell-page :is(.profits-table-wrap,.agencies-table-wrap) { overflow:auto; border:1px solid #e5e9ef; border-radius:13px; }
body.ayin-page.ayin-account-shell-page :is(.profits-table,.agencies-table) { width:100%; min-width:760px; border-collapse:collapse; }
body.ayin-page.ayin-account-shell-page :is(.profits-table,.agencies-table) th { padding:13px; color:#785f2e; background:#fff8e7; font-size:11px; }
body.ayin-page.ayin-account-shell-page :is(.profits-table,.agencies-table) td { padding:13px; border-top:1px solid #edf0f4; color:#5d6c81; font-size:12px; }

/* Tree */
body.ayin-page.ayin-account-shell-page .tree-placement-alert { display:grid; grid-template-columns:46px minmax(0,1fr) auto; gap:13px; align-items:center; padding:15px; }
body.ayin-page.ayin-account-shell-page .tree-alert-icon,
body.ayin-page.ayin-account-shell-page .tree-summary-icon,
body.ayin-page.ayin-account-shell-page .support-channel-icon,
body.ayin-page.ayin-account-shell-page .notification-icon {
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:12px;
    color:#fff;
    background:linear-gradient(145deg,var(--r27t-navy-soft),var(--r27t-navy-deep));
}
body.ayin-page.ayin-account-shell-page .tree-workspace-card { padding:20px; }
body.ayin-page.ayin-account-shell-page .tree-toolbar { display:flex; flex-wrap:wrap; gap:8px; }
body.ayin-page.ayin-account-shell-page .tree-tool-btn,
body.ayin-page.ayin-account-shell-page .tree-zoom-controls button {
    min-height:38px;
    border:1px solid #dde4ec;
    border-radius:10px;
    color:#53657b;
    background:#fff;
    font-weight:800;
}
body.ayin-page.ayin-account-shell-page .tree-explorer-viewport { min-height:520px; border:1px solid #dce4ee; border-radius:15px; background-color:#f8fbff; }
body.ayin-page.ayin-account-shell-page :is(.agency-current-card,.tree-rules-card) { padding:20px; }

/* Profile */
body.ayin-page.ayin-account-shell-page .profile-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,.38fr); gap:16px; align-items:start; }
body.ayin-page.ayin-account-shell-page .profile-main-column { min-width:0; }
body.ayin-page.ayin-account-shell-page .profile-tabs-card { padding:0; }
body.ayin-page.ayin-account-shell-page .profile-tabs { display:flex; gap:4px; overflow-x:auto; padding:10px; border-bottom:1px solid #e8ecf1; background:#fffdfa; }
body.ayin-page.ayin-account-shell-page .profile-tab {
    min-height:42px;
    padding:9px 14px;
    border:0;
    border-radius:11px;
    color:#66758a;
    background:transparent;
    white-space:nowrap;
    font-weight:900;
}
body.ayin-page.ayin-account-shell-page .profile-tab:hover,
body.ayin-page.ayin-account-shell-page .profile-tab.active { color:var(--r27t-ink); background:linear-gradient(135deg,#fff7da,#ead195); }
body.ayin-page.ayin-account-shell-page .profile-tab-panel { padding:22px; }
body.ayin-page.ayin-account-shell-page .profile-avatar-editor { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px; border:1px solid #e2e7ed; border-radius:15px; background:#f9fbfd; }
body.ayin-page.ayin-account-shell-page .profile-avatar-large { width:94px; height:94px; display:grid; place-items:center; flex:0 0 94px; border-radius:27px; color:#fff; background:linear-gradient(145deg,#1763c3,var(--r27t-navy-deep)); font-size:37px; font-weight:900; }
body.ayin-page.ayin-account-shell-page .profile-form-grid,
body.ayin-page.ayin-account-shell-page .support-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
body.ayin-page.ayin-account-shell-page .profile-field,
body.ayin-page.ayin-account-shell-page .support-form label { display:grid; gap:7px; color:var(--r27t-ink); font-size:12px; font-weight:800; }
body.ayin-page.ayin-account-shell-page :is(.profile-field,.support-form label) :is(input,select,textarea) { width:100%; min-height:48px; padding:11px 13px; outline:0; }
body.ayin-page.ayin-account-shell-page :is(.profile-field,.support-form label):focus-within { border-color:transparent; box-shadow:none; }
body.ayin-page.ayin-account-shell-page :is(.profile-field,.support-form label) :is(input,select,textarea):focus { border-color:#8bb0df; box-shadow:0 0 0 3px rgba(21,89,183,.09); }

/* Notifications */
body.ayin-page.ayin-account-shell-page .notifications-panel { padding:20px; }
body.ayin-page.ayin-account-shell-page .notification-filters { display:flex; flex-wrap:wrap; gap:7px; }
body.ayin-page.ayin-account-shell-page .notification-filters button { min-height:36px; padding:7px 13px; border:1px solid #dfe5ec; border-radius:10px; color:#65758a; background:#fff; font-weight:800; }
body.ayin-page.ayin-account-shell-page .notification-filters button.active { color:var(--r27t-ink); border-color:rgba(205,168,73,.56); background:linear-gradient(135deg,#fff7da,#ead195); }
body.ayin-page.ayin-account-shell-page .notification-list { display:grid; gap:10px; }
body.ayin-page.ayin-account-shell-page .notification-item { display:grid; grid-template-columns:46px minmax(0,1fr) auto; gap:13px; align-items:center; padding:15px; border:1px solid #e2e7ed; border-radius:14px; background:#fff; }
body.ayin-page.ayin-account-shell-page .notification-item.unread { border-color:#b8d0ef; background:#f2f7ff; }

/* Support */
body.ayin-page.ayin-account-shell-page .support-channel-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; }
body.ayin-page.ayin-account-shell-page .support-channel-card { display:grid; grid-template-columns:46px minmax(0,1fr); gap:12px; padding:17px; border:1px solid var(--r27t-border); border-radius:16px; background:#fff; box-shadow:var(--r27t-shadow); }
body.ayin-page.ayin-account-shell-page .support-channel-card button { grid-column:1/-1; min-height:40px; border:1px solid #dbe3ec; border-radius:10px; color:#174f98; background:#f4f8fd; font-weight:900; }
body.ayin-page.ayin-account-shell-page .support-layout { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.65fr); gap:16px; align-items:start; }
body.ayin-page.ayin-account-shell-page :is(.support-ticket-card,.support-faq-card) { padding:20px; }
body.ayin-page.ayin-account-shell-page .support-upload { min-height:110px; display:grid !important; place-items:center; border:1px dashed #bfcbd8 !important; border-radius:13px; background:#f8fbff; }
body.ayin-page.ayin-account-shell-page .support-faq-card details { border-bottom:1px solid #e8edf2; padding:12px 0; }
body.ayin-page.ayin-account-shell-page .support-faq-card summary { color:var(--r27t-ink); font-weight:900; cursor:pointer; }

/* Empty states, buttons, status pills */
body.ayin-page.ayin-account-shell-page .catalog-empty { min-height:260px; display:grid; place-items:center; align-content:center; gap:9px; padding:28px; text-align:center; }
body.ayin-page.ayin-account-shell-page .catalog-empty > span { width:54px; height:54px; display:grid; place-items:center; border-radius:15px; color:#fff; background:linear-gradient(145deg,var(--r27t-navy-soft),var(--r27t-navy-deep)); font-size:25px; }
body.ayin-page.ayin-account-shell-page .catalog-empty h2 { margin:0; color:var(--r27t-ink); font-size:24px; }
body.ayin-page.ayin-account-shell-page .catalog-empty p { margin:0; color:var(--r27t-muted); font-size:12px; }
body.ayin-page.ayin-account-shell-page .ayin-btn { min-height:42px; display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:9px 16px; border-radius:11px; font-weight:900; }
body.ayin-page.ayin-account-shell-page .ayin-btn-primary { color:#fff; background:linear-gradient(135deg,#1763c3,#0b3f88); box-shadow:0 10px 22px rgba(21,89,183,.18); }
body.ayin-page.ayin-account-shell-page .ayin-btn-gold { color:var(--r27t-navy-deep); background:linear-gradient(135deg,#ffe59a,#ddb858); }
body.ayin-page.ayin-account-shell-page .order-status,
body.ayin-page.ayin-account-shell-page .status-pill { display:inline-flex; align-items:center; justify-content:center; min-height:27px; padding:4px 9px; border-radius:999px; font-size:10px; font-weight:900; }

/* Responsive rollout: desktop remains full-sidebar; smaller screens follow dashboard behavior. */
@media (max-width: 1180px) {
    body.ayin-page.ayin-account-shell-page .products-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    body.ayin-page.ayin-account-shell-page .support-channel-grid { grid-template-columns:1fr; }
    body.ayin-page.ayin-account-shell-page .profile-layout { grid-template-columns:1fr; }
}

@media (max-width: 980px) {
    body.ayin-page.ayin-account-shell-page .main-content { gap:14px; }
    body.ayin-page.ayin-account-shell-page :is(.hero-dashboard,.utility-hero,.profile-hero,.order-success-card) {
        min-height:auto;
        flex-direction:column;
        align-items:stretch;
        gap:18px;
        padding:22px;
    }
    body.ayin-page.ayin-account-shell-page :is(.referral-box,.profile-completion-card,.support-status) { width:100%; }
    body.ayin-page.ayin-account-shell-page :is(.product-details-layout,.cart-layout,.checkout-layout,.order-details-layout,.wallet-live-layout,.profits-main-grid,.tree-bottom-grid,.support-layout) { grid-template-columns:1fr; }
    body.ayin-page.ayin-account-shell-page .product-details-image { min-height:360px; }
}

@media (max-width: 700px) {
    body.ayin-page.ayin-account-shell-page .products-grid,
    body.ayin-page.ayin-account-shell-page :is(.wallet-live-summary,.profits-summary-grid,.tree-summary-grid,.notification-summary-grid),
    body.ayin-page.ayin-account-shell-page :is(.checkout-form-grid,.profile-form-grid,.support-form-grid),
    body.ayin-page.ayin-account-shell-page :is(.branch-points-grid,.direct-profit-metrics) { grid-template-columns:1fr; }
    body.ayin-page.ayin-account-shell-page .store-filter-head,
    body.ayin-page.ayin-account-shell-page :is(.utility-section-head,.profits-section-head,.tree-workspace-head,.profile-section-heading) { align-items:flex-start; flex-direction:column; }
    body.ayin-page.ayin-account-shell-page .store-search { grid-template-columns:1fr; }
    body.ayin-page.ayin-account-shell-page .store-search button { min-height:44px; }
    body.ayin-page.ayin-account-shell-page .cart-item-v3,
    body.ayin-page.ayin-account-shell-page .order-detail-item { grid-template-columns:70px minmax(0,1fr); }
    body.ayin-page.ayin-account-shell-page .cart-v3-actions-column,
    body.ayin-page.ayin-account-shell-page .order-detail-item > :last-child { grid-column:1/-1; }
    body.ayin-page.ayin-account-shell-page .profile-avatar-editor { align-items:flex-start; flex-direction:column; }
    body.ayin-page.ayin-account-shell-page .notification-item { grid-template-columns:42px minmax(0,1fr); }
    body.ayin-page.ayin-account-shell-page .notification-read-btn { grid-column:1/-1; }
}

@media (max-width: 520px) {
    body.ayin-page.ayin-account-shell-page :is(.hero-dashboard,.utility-hero,.profile-hero,.order-success-card) { padding:19px 16px; border-radius:17px; }
    body.ayin-page.ayin-account-shell-page :is(.hero-dashboard,.utility-hero,.profile-hero,.order-success-card) h1 { font-size:29px; }
    body.ayin-page.ayin-account-shell-page .product-image { min-height:180px; }
    body.ayin-page.ayin-account-shell-page .product-details-image { min-height:280px; }
    body.ayin-page.ayin-account-shell-page .big-product-icon { font-size:92px; }
    body.ayin-page.ayin-account-shell-page :is(.store-filter-card,.cart-items-card,.order-summary-card,.checkout-section-card,.checkout-summary,.wallet-transactions-card,.withdrawal-live-card,.withdrawals-history-card,.balance-overview-card,.direct-profit-overview,.profits-table-card,.tree-workspace-card,.agency-current-card,.tree-rules-card,.agencies-table-card,.notifications-panel,.support-ticket-card,.support-faq-card,.order-items-panel,.order-summary-panel) { padding:16px; }
}

/* =========================================================
   AYIN R27T — Notifications summary visibility hotfix
   Scoped only to /notifications summary cards.
   ========================================================= */
body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card {
    isolation: isolate;
    border-color: rgba(229, 217, 194, .88) !important;
}

body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card :is(span, strong, small) {
    position: relative;
    z-index: 3;
    color: inherit !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card.blue {
    color: #ffffff !important;
    background:
        url('../images/ayin/motifs/stat-corner-r27d.svg') right center / auto 115% no-repeat,
        linear-gradient(135deg, #0b315f 0%, #061f43 100%) !important;
}

body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card.green {
    color: #ffffff !important;
    background:
        url('../images/ayin/motifs/stat-corner-r27d.svg') right center / auto 115% no-repeat,
        linear-gradient(135deg, #26aa60 0%, #147f43 100%) !important;
}

body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card.gold {
    color: #0a2447 !important;
    background:
        url('../images/ayin/motifs/stat-corner-r27d.svg') right center / auto 115% no-repeat,
        linear-gradient(135deg, #fff8df 0%, #efd58d 100%) !important;
}

body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card.gray {
    color: #0a2447 !important;
    background:
        url('../images/ayin/motifs/stat-corner-r27d.svg') right center / auto 115% no-repeat,
        linear-gradient(135deg, #f7f9fc 0%, #e5ecf5 100%) !important;
}

body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card strong {
    display: block;
    margin-block: 5px 4px;
    font-size: clamp(28px, 3vw, 38px);
    line-height: 1;
    font-weight: 900;
}

body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card span {
    font-size: 14px;
    font-weight: 800;
}

body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card small {
    font-size: 11px;
    font-weight: 600;
}

/* =========================================================
   AYIN R27V — Notifications support summary visibility fix
   Completes the fifth support summary card omitted in R27T.
   Scoped only to /notifications.
   ========================================================= */
body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card.purple,
body.ayin-page.ayin-account-shell-page.notifications-page .ayin-notification-summary-grid > .notification-summary-card:nth-child(5) {
    color: #ffffff !important;
    border-color: rgba(239, 199, 94, .24) !important;
    background:
        url('../images/ayin/motifs/stat-corner-r27d.svg') right center / auto 115% no-repeat,
        linear-gradient(135deg, #57388b 0%, #2b194f 100%) !important;
    box-shadow: 0 14px 34px rgba(43, 25, 79, .14) !important;
}

body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card.purple :is(span, strong, small),
body.ayin-page.ayin-account-shell-page.notifications-page .ayin-notification-summary-grid > .notification-summary-card:nth-child(5) :is(span, strong, small) {
    position: relative;
    z-index: 3;
    color: #ffffff !important;
    opacity: 1 !important;
    text-shadow: none !important;
}



/* =========================================================
   AYIN R27V — Universal summary typography + responsive hardening
   Applies the approved summary-card heading rule across authenticated
   account pages and completes responsive behavior for desktop, tablet,
   mobile, and narrow mobile widths. Admin/Filament remains excluded.
   ========================================================= */

/* Summary-card headings: +20% visual size and regular weight.
   The selectors are intentionally limited to the four approved summary
   card families so labels inside forms, tables, and ordinary cards are not
   changed accidentally. */
body.ayin-page.ayin-account-shell-page :is(
    .wallet-live-card > span,
    .profit-summary-card > div > span,
    .tree-summary-card > div > span,
    .notification-summary-card > span
) {
    position: relative;
    z-index: 3;
    font-size: 17px !important;
    line-height: 1.45 !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
}

/* Preserve the intended foreground color of colored summary cards. */
body.ayin-page.ayin-account-shell-page.notifications-page .notification-summary-card > span {
    color: inherit !important;
}

/* Shared safety rules for every account page. */
body.ayin-page.ayin-account-shell-page,
body.ayin-page.ayin-account-shell-page .main-content,
body.ayin-page.ayin-account-shell-page .main-content > *,
body.ayin-page.ayin-account-shell-page :is(
    .products-grid,
    .product-details-layout,
    .cart-layout,
    .checkout-layout,
    .order-details-layout,
    .wallet-live-summary,
    .wallet-live-layout,
    .profits-summary-grid,
    .profits-main-grid,
    .tree-summary-grid,
    .tree-bottom-grid,
    .profile-layout,
    .notification-summary-grid,
    .support-channel-grid,
    .support-layout
) {
    min-width: 0;
    max-width: 100%;
}

body.ayin-page.ayin-account-shell-page img,
body.ayin-page.ayin-account-shell-page svg,
body.ayin-page.ayin-account-shell-page video,
body.ayin-page.ayin-account-shell-page canvas {
    max-width: 100%;
}

body.ayin-page.ayin-account-shell-page :is(
    .orders-list-card,
    .profits-table-card,
    .agencies-table-card,
    .tree-workspace-card
) {
    max-width: 100%;
}

/* Small desktop and landscape tablet. */
@media (max-width: 1180px) {
    body.ayin-page.ayin-account-shell-page :is(
        .product-details-layout,
        .cart-layout,
        .checkout-layout,
        .order-details-layout,
        .wallet-live-layout,
        .profits-main-grid,
        .tree-bottom-grid,
        .support-layout
    ) {
        grid-template-columns: minmax(0, 1fr);
    }

    body.ayin-page.ayin-account-shell-page .support-channel-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.ayin-page.ayin-account-shell-page .profile-layout {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Tablet portrait. */
@media (max-width: 900px) {
    body.ayin-page.ayin-account-shell-page .main-content {
        gap: 14px;
    }

    body.ayin-page.ayin-account-shell-page :is(
        .hero-dashboard,
        .utility-hero,
        .profile-hero,
        .order-success-card
    ) {
        min-height: auto;
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        padding: 22px;
    }

    body.ayin-page.ayin-account-shell-page :is(
        .referral-box,
        .profile-completion-card,
        .support-status
    ) {
        width: 100%;
        max-width: none;
    }

    body.ayin-page.ayin-account-shell-page .products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.ayin-page.ayin-account-shell-page :is(
        .wallet-live-summary,
        .profits-summary-grid,
        .tree-summary-grid,
        .notification-summary-grid
    ) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.ayin-page.ayin-account-shell-page .product-details-image {
        min-height: 340px;
    }

    body.ayin-page.ayin-account-shell-page :is(
        .orders-list-card,
        .profits-table-wrap,
        .agencies-table-wrap,
        .tree-explorer-viewport
    ) {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
    }
}

/* Large phones and small tablets. */
@media (max-width: 700px) {
    body.ayin-page.ayin-account-shell-page .support-channel-grid,
    body.ayin-page.ayin-account-shell-page :is(
        .checkout-form-grid,
        .profile-form-grid,
        .support-form-grid,
        .branch-points-grid,
        .direct-profit-metrics
    ) {
        grid-template-columns: minmax(0, 1fr);
    }

    body.ayin-page.ayin-account-shell-page :is(
        .store-filter-head,
        .utility-section-head,
        .profits-section-head,
        .tree-workspace-head,
        .cart-items-card-head,
        .profile-section-heading
    ) {
        align-items: flex-start;
        flex-direction: column;
    }

    body.ayin-page.ayin-account-shell-page .notification-item {
        grid-template-columns: 42px minmax(0, 1fr);
    }

    body.ayin-page.ayin-account-shell-page .notification-read-btn {
        grid-column: 1 / -1;
        width: 100%;
    }

    body.ayin-page.ayin-account-shell-page .profile-avatar-editor {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Mobile. */
@media (max-width: 560px) {
    body.ayin-page.ayin-account-shell-page .products-grid,
    body.ayin-page.ayin-account-shell-page :is(
        .wallet-live-summary,
        .profits-summary-grid,
        .tree-summary-grid,
        .notification-summary-grid
    ) {
        grid-template-columns: minmax(0, 1fr);
    }

    body.ayin-page.ayin-account-shell-page :is(
        .hero-dashboard,
        .utility-hero,
        .profile-hero,
        .order-success-card
    ) {
        padding: 19px 16px;
        border-radius: 17px;
    }

    body.ayin-page.ayin-account-shell-page :is(
        .hero-dashboard,
        .utility-hero,
        .profile-hero,
        .order-success-card
    ) h1 {
        font-size: clamp(27px, 8vw, 33px);
    }

    body.ayin-page.ayin-account-shell-page :is(
        .wallet-live-card,
        .profit-summary-card,
        .tree-summary-card,
        .notification-summary-card
    ) {
        min-height: 116px;
        padding: 16px;
    }

    body.ayin-page.ayin-account-shell-page :is(
        .wallet-live-card > span,
        .profit-summary-card > div > span,
        .tree-summary-card > div > span,
        .notification-summary-card > span
    ) {
        font-size: 15px !important;
    }

    body.ayin-page.ayin-account-shell-page .product-details-image {
        min-height: 260px;
    }

    body.ayin-page.ayin-account-shell-page .big-product-icon {
        font-size: 86px;
    }

    body.ayin-page.ayin-account-shell-page .cart-item-v3,
    body.ayin-page.ayin-account-shell-page .order-detail-item {
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 10px;
    }

    body.ayin-page.ayin-account-shell-page .cart-v3-actions-column,
    body.ayin-page.ayin-account-shell-page .order-detail-item > :last-child {
        grid-column: 1 / -1;
    }

    body.ayin-page.ayin-account-shell-page :is(
        .store-filter-card,
        .cart-items-card,
        .order-summary-card,
        .checkout-section-card,
        .checkout-summary,
        .wallet-transactions-card,
        .withdrawal-live-card,
        .withdrawals-history-card,
        .balance-overview-card,
        .direct-profit-overview,
        .profits-table-card,
        .tree-workspace-card,
        .agency-current-card,
        .tree-rules-card,
        .agencies-table-card,
        .notifications-panel,
        .support-ticket-card,
        .support-faq-card,
        .order-items-panel,
        .order-summary-panel
    ) {
        padding: 15px;
    }
}

/* Narrow mobile. */
@media (max-width: 390px) {
    body.ayin-page.ayin-account-shell-page .main-content {
        gap: 12px;
    }

    body.ayin-page.ayin-account-shell-page :is(
        .hero-dashboard,
        .utility-hero,
        .profile-hero,
        .order-success-card
    ) {
        padding: 17px 14px;
    }

    body.ayin-page.ayin-account-shell-page :is(
        .hero-dashboard,
        .utility-hero,
        .profile-hero,
        .order-success-card
    ) h1 {
        font-size: 26px;
    }

    body.ayin-page.ayin-account-shell-page :is(.ayin-btn, button, input[type="submit"]) {
        max-width: 100%;
    }

    body.ayin-page.ayin-account-shell-page .profile-tabs {
        scroll-snap-type: inline proximity;
    }

    body.ayin-page.ayin-account-shell-page .profile-tab {
        scroll-snap-align: start;
    }
}

/* =========================================================
   AYIN R27W — Final unified summary-card title typography
   Exact shared rule for wallet, profits, tree, and notification
   summary titles across all authenticated frontend pages.
   ========================================================= */
body.ayin-page.ayin-account-shell-page :is(
    .wallet-live-card > span:first-child,
    .profit-summary-card > div:not(.profit-summary-icon) > span:first-child,
    .tree-summary-card > div > small:first-child,
    .notification-summary-card > span:first-child
) {
    position: relative !important;
    z-index: 4 !important;
    margin: 0 !important;
    font-family: inherit !important;
    font-size: 18px !important;
    line-height: 1.45 !important;
    font-weight: 400 !important;
    font-style: normal !important;
    letter-spacing: 0 !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

/* Keep title colors inherited from each light or colored card. */
body.ayin-page.ayin-account-shell-page.notifications-page
.notification-summary-card > span:first-child {
    color: inherit !important;
}

/* Prevent older mobile rules from shrinking these titles again. */
@media (max-width: 560px) {
    body.ayin-page.ayin-account-shell-page :is(
        .wallet-live-card > span:first-child,
        .profit-summary-card > div:not(.profit-summary-icon) > span:first-child,
        .tree-summary-card > div > small:first-child,
        .notification-summary-card > span:first-child
    ) {
        font-size: 18px !important;
        font-weight: 400 !important;
    }
}