/* ============================================================
   mmkhambhatwala.biz — Mobile-First Theme v5
   Gold & Cream Premium Wholesale Portal
   ============================================================ */

/* ── Variables ── */
:root {
    --primary-gold: #D4AF37;
    --dark-gold:    #B8941F;
    --light-gold:   #F4E4C1;
    --cream:        #FFF8E7;
    --cream-dark:   #F5E6D3;
    --text-dark:    #2C2416;
    --text-medium:  #5C4F3B;
    --shadow:       rgba(212,175,55,0.15);
    --shadow-md:    rgba(0,0,0,0.10);
    --white:        #FFFFFF;
    --success:      #4CAF50;
    --warning:      #FF9800;
    --danger:       #F44336;
    --info:         #1976D2;
    --radius-sm:    6px;
    --radius:       10px;
    --radius-lg:    14px;
    --transition:   0.18s ease;
    --header-h:     56px;
    --nav-h:        44px;
}

/* ── Reset ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { font-size:16px; -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body {
    font-family:'Segoe UI',system-ui,-apple-system,sans-serif;
    background:var(--cream);
    color:var(--text-dark);
    line-height:1.6;
    min-height:100vh;
}
a { color:inherit; }
img { max-width:100%; display:block; }
button { font-family:inherit; }
::-webkit-scrollbar { width:5px; height:5px; }
::-webkit-scrollbar-track { background:var(--cream); }
::-webkit-scrollbar-thumb { background:var(--light-gold); border-radius:3px; }

/* ============================================================
   HEADER
   ============================================================ */
.header {
    background:linear-gradient(135deg,var(--primary-gold) 0%,var(--dark-gold) 100%);
    color:var(--white);
    box-shadow:0 2px 10px rgba(0,0,0,0.18);
    position:sticky;
    top:0;
    z-index:1000;
    height:var(--header-h);
}
.header-content {
    max-width:1400px;
    margin:0 auto;
    padding:0 .85rem;
    height:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.6rem;
}
.logo h1 {
    font-size:1rem;
    font-weight:700;
    letter-spacing:.2px;
    line-height:1.2;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:160px;
}
.logo p { font-size:.65rem; opacity:.85; display:none; margin-top:1px; }
.header-right { display:flex; align-items:center; gap:.5rem; flex-shrink:0; }
.user-info { display:none; }
.logout-btn {
    background:rgba(255,255,255,0.18);
    color:var(--white);
    border:1.5px solid rgba(255,255,255,0.4);
    padding:.35rem .7rem;
    border-radius:var(--radius-sm);
    font-weight:600;
    font-size:.76rem;
    cursor:pointer;
    transition:var(--transition);
    text-decoration:none;
    white-space:nowrap;
}
.logout-btn:hover { background:rgba(255,255,255,.28); }

@media(min-width:600px) {
    :root { --header-h:60px; --nav-h:48px; }
    .header-content { padding:0 1.5rem; }
    .logo h1 { font-size:1.35rem; max-width:240px; }
    .logo p  { display:block; }
    .user-info { display:block; text-align:right; }
    .user-info strong { display:block; font-size:.88rem; }
    .user-info span   { font-size:.75rem; opacity:.9; }
    .logout-btn { padding:.45rem 1.1rem; font-size:.83rem; }
    .header-right { gap:.85rem; }
}
@media(min-width:1024px) {
    .logo h1 { font-size:1.6rem; max-width:none; }
    .header-right { gap:1.1rem; }
}

/* ============================================================
   NAVIGATION
   ============================================================ */
.nav {
    background:var(--white);
    box-shadow:0 2px 6px var(--shadow);
    margin-bottom:0;
    position:sticky;
    top:var(--header-h);
    z-index:900;
}
.nav-content {
    max-width:1400px;
    margin:0 auto;
    padding:0;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
}
.nav-content::-webkit-scrollbar { display:none; }
.nav-list { list-style:none; display:flex; min-width:max-content; gap:0; }
.nav-list li a {
    display:flex;
    align-items:center;
    gap:.3rem;
    padding:0 .85rem;
    height:var(--nav-h);
    color:var(--text-medium);
    text-decoration:none;
    font-weight:500;
    font-size:.8rem;
    transition:var(--transition);
    border-bottom:3px solid transparent;
    white-space:nowrap;
}
.nav-list li a:hover { color:var(--dark-gold); background:var(--cream); border-bottom-color:var(--light-gold); }
.nav-list li a.active { color:var(--dark-gold); font-weight:700; border-bottom-color:var(--primary-gold); background:var(--cream); }
@media(min-width:600px) {
    .nav-content { padding:0 1rem; }
    .nav-list li a { font-size:.88rem; padding:0 1.2rem; }
}
@media(min-width:1024px) { .nav-content { padding:0 1.5rem; } }

/* ============================================================
   CONTAINER — tight on mobile
   ============================================================ */
.container { max-width:1400px; margin:0 auto; padding:.85rem .75rem 2rem; }
@media(min-width:600px) { .container { padding:1.25rem 1.25rem 2.5rem; } }
@media(min-width:1024px) { .container { padding:1.5rem 1.5rem 3rem; } }

/* ============================================================
   PAGE HEADER — compact
   ============================================================ */
.page-header { margin-bottom:.85rem; }
.page-header h2 { font-size:1.2rem; color:var(--text-dark); margin-bottom:.15rem; font-weight:700; }
.page-header p  { color:var(--text-medium); font-size:.82rem; }
@media(min-width:600px) {
    .page-header { margin-bottom:1.25rem; }
    .page-header h2 { font-size:1.55rem; }
    .page-header p  { font-size:.92rem; }
}
@media(min-width:1024px) {
    .page-header { margin-bottom:1.5rem; }
    .page-header h2 { font-size:1.85rem; }
}

/* ============================================================
   CARDS GRID
   ============================================================ */
.cards-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:.6rem;
    margin-bottom:.85rem;
}
@media(min-width:600px) {
    .cards-grid { grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:1rem; margin-bottom:1.25rem; }
}
@media(min-width:1024px) { .cards-grid { gap:1.25rem; margin-bottom:1.5rem; } }

.card {
    background:var(--white);
    border-radius:var(--radius);
    padding:.75rem;
    box-shadow:0 2px 10px var(--shadow);
    transition:var(--transition);
    border:2px solid transparent;
}
.card:hover { transform:translateY(-2px); box-shadow:0 5px 18px var(--shadow); border-color:var(--light-gold); }
.card-header { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:.4rem; }
.card-header h3 { font-size:.68rem; color:var(--text-medium); font-weight:600; text-transform:uppercase; letter-spacing:.5px; line-height:1.3; }
.card-icon { font-size:1.1rem; }
.card-value { font-size:1.25rem; font-weight:700; color:var(--dark-gold); margin-bottom:.15rem; word-break:break-word; }
.card-label { font-size:.7rem; color:var(--text-medium); }
.card.success .card-value { color:var(--success); }
.card.warning .card-value { color:var(--warning); }
.card.danger  .card-value { color:var(--danger); }
@media(min-width:600px) {
    .card { padding:1.1rem; }
    .card-value { font-size:1.6rem; }
    .card-header h3 { font-size:.77rem; }
    .card-icon { font-size:1.3rem; }
}
@media(min-width:1024px) {
    .card { padding:1.35rem; }
    .card-value { font-size:1.9rem; }
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.3rem;
    padding:.55rem 1rem;
    border:none;
    border-radius:var(--radius-sm);
    font-weight:600;
    cursor:pointer;
    transition:var(--transition);
    text-decoration:none;
    font-size:.85rem;
    white-space:nowrap;
    line-height:1;
    min-height:38px;
}
.btn-primary   { background:linear-gradient(135deg,var(--primary-gold),var(--dark-gold)); color:var(--white); }
.btn-primary:hover { transform:translateY(-1px); box-shadow:0 4px 12px var(--shadow); }
.btn-secondary { background:var(--cream-dark); color:var(--text-dark); }
.btn-secondary:hover { background:var(--light-gold); }
.btn-success   { background:var(--success); color:#fff; }
.btn-success:hover { background:#388E3C; }
.btn-danger    { background:var(--danger); color:#fff; }
.btn-danger:hover { background:#d32f2f; }
.btn-small { padding:.3rem .7rem; font-size:.75rem; min-height:30px; }
.btn-block { display:flex; width:100%; }
@media(min-width:600px) { .btn { padding:.62rem 1.3rem; font-size:.9rem; } }

/* ============================================================
   TABLES
   ============================================================ */
.table-container {
    background:var(--white);
    border-radius:var(--radius);
    padding:.75rem .65rem;
    box-shadow:0 2px 10px var(--shadow);
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    margin-bottom:.85rem;
}
@media(min-width:600px) { .table-container { padding:1.25rem; margin-bottom:1.25rem; } }

table { width:100%; border-collapse:collapse; min-width:460px; }
table thead { background:var(--light-gold); }
table th {
    padding:.55rem .65rem;
    text-align:left;
    font-weight:600;
    color:var(--text-dark);
    font-size:.73rem;
    text-transform:uppercase;
    letter-spacing:.3px;
    border-bottom:2px solid var(--primary-gold);
    white-space:nowrap;
}
table td {
    padding:.65rem .65rem;
    border-bottom:1px solid var(--cream-dark);
    font-size:.82rem;
    vertical-align:middle;
}
table tbody tr:hover { background:var(--cream); }
table tbody tr:last-child td { border-bottom:none; }
@media(min-width:600px) {
    table th { padding:.8rem .9rem; font-size:.79rem; }
    table td { padding:.85rem .9rem; font-size:.88rem; }
}

/* ============================================================
   BADGES
   ============================================================ */
.badge {
    display:inline-block;
    padding:.2rem .55rem;
    border-radius:20px;
    font-size:.67rem;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:.3px;
    white-space:nowrap;
}
.badge-placed      { background:#E3F2FD; color:#1976D2; }
.badge-packed      { background:#FFF3E0; color:#F57C00; }
.badge-delivered   { background:#E8F5E9; color:#388E3C; }
.badge-pending     { background:#FFF9C4; color:#F57F17; }
.badge-approved    { background:#E8F5E9; color:#2E7D32; }
.badge-rejected    { background:#FFEBEE; color:#C62828; }
.badge-dispatched  { background:#E8EAF6; color:#3949AB; }
.badge-cancelled   { background:#FFEBEE; color:#C62828; }
.badge-processing  { background:#E3F2FD; color:#1565C0; }
.badge-pay-paid    { background:#E8F5E9; color:#2E7D32; }
.badge-pay-unpaid  { background:#FFEBEE; color:#C62828; }
.badge-pay-partial { background:#FFF3E0; color:#E65100; }
.badge-gpay        { background:#E8F5E9; color:#2E7D32; }
.badge-razorpay    { background:#EDE7F6; color:#6A1B9A; }
.badge-payu        { background:#FFF8E1; color:#F57F17; }
.badge-partial     { background:#FFF3E0; color:#E65100; }
.badge-active      { background:#E8F5E9; color:#2E7D32; }
.badge-inactive    { background:#FFEBEE; color:#C62828; }

/* ============================================================
   FORMS — compact & mobile-friendly
   ============================================================ */
.form-group { margin-bottom:.85rem; }
.form-group label { display:block; margin-bottom:.3rem; font-weight:600; font-size:.83rem; color:var(--text-dark); }
.form-control {
    width:100%;
    padding:.6rem .75rem;
    border:2px solid var(--cream-dark);
    border-radius:var(--radius-sm);
    font-size:.95rem;
    color:var(--text-dark);
    background:var(--white);
    transition:var(--transition);
    -webkit-appearance:none;
    appearance:none;
}
.form-control:focus { outline:none; border-color:var(--primary-gold); box-shadow:0 0 0 3px rgba(212,175,55,.12); }
select.form-control {
    cursor:pointer;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M0 0l6 8 6-8z' fill='%235C4F3B'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right .75rem center;
    padding-right:2.25rem;
}
textarea.form-control { resize:vertical; min-height:72px; }
.form-grid-2 { display:grid; grid-template-columns:1fr; gap:0; }
@media(min-width:600px) { .form-grid-2 { grid-template-columns:1fr 1fr; gap:0 1rem; } }
.form-grid-3 { display:grid; grid-template-columns:1fr; gap:0; }
@media(min-width:768px) { .form-grid-3 { grid-template-columns:1fr 1fr 1fr; gap:0 1rem; } }
.form-full { grid-column:1/-1; }

/* Remember me checkbox */
.remember-row { display:flex; align-items:center; justify-content:space-between; margin-bottom:.85rem; flex-wrap:wrap; gap:.5rem; }
.remember-label { display:flex; align-items:center; gap:.5rem; font-size:.83rem; color:var(--text-medium); cursor:pointer; font-weight:normal; }
.remember-label input[type=checkbox] { width:16px; height:16px; accent-color:var(--primary-gold); cursor:pointer; }

/* ============================================================
   ALERTS
   ============================================================ */
.alert {
    padding:.65rem .85rem;
    border-radius:var(--radius-sm);
    margin-bottom:.85rem;
    border-left:4px solid;
    font-size:.84rem;
}
.alert-info    { background:#E3F2FD; border-color:#1976D2; color:#0D47A1; }
.alert-warning { background:#FFF3E0; border-color:#F57C00; color:#E65100; }
.alert-success { background:#E8F5E9; border-color:#388E3C; color:#1B5E20; }
.alert-error   { background:#FFEBEE; border-color:#C62828; color:#B71C1C; }

/* ============================================================
   QUICK ACTIONS
   ============================================================ */
.quick-actions {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:.6rem;
    margin-bottom:.85rem;
}
@media(min-width:480px) { .quick-actions { grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:.85rem; } }
@media(min-width:768px) { .quick-actions { margin-bottom:1.25rem; } }
.quick-action-card {
    background:var(--white);
    padding:.75rem .5rem;
    border-radius:var(--radius);
    text-align:center;
    box-shadow:0 2px 10px var(--shadow);
    cursor:pointer;
    transition:var(--transition);
    text-decoration:none;
    color:var(--text-dark);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:.28rem;
}
.quick-action-card:hover { transform:translateY(-2px); background:var(--light-gold); }
.quick-action-card .icon { font-size:1.5rem; }
.quick-action-card h4 { font-size:.72rem; font-weight:600; line-height:1.3; }
@media(min-width:600px) {
    .quick-action-card { padding:1.1rem .85rem; }
    .quick-action-card .icon { font-size:1.9rem; }
    .quick-action-card h4 { font-size:.85rem; }
}
@media(min-width:1024px) {
    .quick-action-card { padding:1.35rem; }
    .quick-action-card .icon { font-size:2.2rem; }
    .quick-action-card h4 { font-size:.9rem; }
}

/* ============================================================
   PRODUCT GRID
   ============================================================ */
.product-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; }
@media(min-width:600px) { .product-grid { grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1.1rem; } }
@media(min-width:1024px) { .product-grid { grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.35rem; } }
.product-card { background:var(--white); border-radius:var(--radius); overflow:hidden; box-shadow:0 2px 10px var(--shadow); transition:var(--transition); }
.product-card:hover { transform:translateY(-2px); box-shadow:0 6px 18px var(--shadow); }
.product-image { width:100%; aspect-ratio:4/3; background:var(--cream-dark); display:flex; align-items:center; justify-content:center; font-size:3rem; overflow:hidden; }
@media(min-width:600px) { .product-image { font-size:4rem; aspect-ratio:4/3; } }
@media(min-width:1024px) { .product-image { font-size:4.5rem; } }
.product-info { padding:.75rem; }
.product-name { font-size:.85rem; font-weight:600; color:var(--text-dark); margin-bottom:.15rem; }
.product-category { font-size:.73rem; color:var(--text-medium); margin-bottom:.5rem; }
.product-mrp { text-decoration:line-through; color:var(--text-medium); font-size:.75rem; }
.product-price { font-size:1.15rem; font-weight:700; color:var(--dark-gold); }
@media(min-width:600px) {
    .product-info { padding:1rem; }
    .product-name { font-size:.95rem; }
    .product-price { font-size:1.3rem; }
}

/* ============================================================
   CHECKOUT / CART GRID
   ============================================================ */
.checkout-grid { display:grid; grid-template-columns:1fr; gap:1rem; }
@media(min-width:900px) { .checkout-grid { grid-template-columns:1fr 340px; gap:1.5rem; } }
.checkout-section {
    background:var(--white);
    border-radius:var(--radius);
    padding:.85rem;
    box-shadow:0 2px 10px var(--shadow);
}
.checkout-section h3 { margin-bottom:.85rem; color:var(--text-dark); padding-bottom:.5rem; border-bottom:2px solid var(--cream-dark); font-size:.92rem; }
.cart-summary { background:var(--white); border-radius:var(--radius); padding:.85rem; box-shadow:0 2px 10px var(--shadow); }
@media(min-width:900px) {
    .cart-summary { position:sticky; top:calc(var(--header-h) + var(--nav-h) + 10px); }
    .checkout-section { padding:1.5rem; }
}
.cart-summary h3 { margin-bottom:.85rem; color:var(--text-dark); padding-bottom:.5rem; border-bottom:2px solid var(--cream-dark); }
.summary-row { display:flex; justify-content:space-between; margin-bottom:.65rem; font-size:.88rem; }
.summary-row.total { font-size:1.05rem; font-weight:700; color:var(--dark-gold); padding-top:.65rem; border-top:2px solid var(--primary-gold); margin-top:.4rem; }
.quantity-control { display:flex; align-items:center; gap:.4rem; }
.quantity-control button { width:28px; height:28px; border:2px solid var(--primary-gold); background:var(--white); color:var(--dark-gold); border-radius:var(--radius-sm); cursor:pointer; font-weight:700; font-size:.95rem; transition:var(--transition); display:flex; align-items:center; justify-content:center; }
.quantity-control button:hover { background:var(--primary-gold); color:var(--white); }
.quantity-control span { min-width:32px; text-align:center; font-weight:600; font-size:.9rem; }

/* ============================================================
   DASHBOARD LAYOUT
   ============================================================ */
.dash-two-col { display:grid; grid-template-columns:1fr; gap:1rem; }
@media(min-width:900px) { .dash-two-col { grid-template-columns:1fr 290px; gap:1.5rem; } }
@media(min-width:1200px) { .dash-two-col { grid-template-columns:1fr 310px; } }

/* Override ANY inline two-column grid on mobile */
@media(max-width:899px) {
    [style*="grid-template-columns:1fr 3"],
    [style*="grid-template-columns: 1fr 3"],
    [style*="grid-template-columns:340px"],
    [style*="grid-template-columns: 340px"],
    [style*="grid-template-columns:300px"],
    [style*="grid-template-columns: 300px"],
    [style*="grid-template-columns:350px"],
    [style*="grid-template-columns: 350px"] {
        grid-template-columns:1fr !important;
    }
}

/* ============================================================
   LOGIN PAGE — polished, tight
   ============================================================ */
.login-container {
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:1.25rem .85rem;
    background:linear-gradient(160deg,var(--cream) 0%,var(--light-gold) 100%);
}
.login-box {
    background:var(--white);
    border-radius:var(--radius-lg);
    padding:1.5rem 1.1rem;
    box-shadow:0 8px 36px rgba(0,0,0,.11);
    width:100%;
    max-width:420px;
    border-top:4px solid var(--primary-gold);
}
@media(min-width:480px) { .login-box { padding:2rem 1.6rem; } }
@media(min-width:600px) { .login-box { padding:2.5rem 2.25rem; } }
.login-header { text-align:center; margin-bottom:1.4rem; }
.login-header h1 { font-size:1.45rem; color:var(--dark-gold); margin-bottom:.25rem; }
.login-header p  { color:var(--text-medium); font-size:.85rem; }

/* ============================================================
   APPLY DEALERSHIP
   ============================================================ */
.apply-container { max-width:680px; margin:1.25rem auto; padding:0 .85rem 2rem; }
@media(min-width:600px) { .apply-container { padding:0 1.25rem 2.5rem; } }
.apply-box {
    background:var(--white);
    border-radius:var(--radius-lg);
    padding:1.25rem .9rem;
    box-shadow:0 5px 28px var(--shadow);
    border-top:4px solid var(--primary-gold);
}
@media(min-width:600px) { .apply-box { padding:2rem 1.75rem; } }
@media(min-width:768px) { .apply-box { padding:2.5rem 2.5rem; } }
.apply-header { text-align:center; margin-bottom:1.5rem; }
.apply-header h1 { font-size:1.4rem; color:var(--dark-gold); margin-bottom:.3rem; }

/* ============================================================
   ANNOUNCEMENT BOX
   ============================================================ */
.announcement-box {
    padding:.7rem .85rem;
    border-left:3px solid var(--primary-gold);
    margin-bottom:.65rem;
    background:var(--cream);
    border-radius:0 var(--radius-sm) var(--radius-sm) 0;
}
.announcement-box h4  { font-size:.86rem; margin-bottom:.2rem; color:var(--text-dark); }
.announcement-box p   { font-size:.79rem; color:var(--text-medium); margin-bottom:.15rem; line-height:1.5; }
.announcement-box small { font-size:.72rem; color:var(--text-medium); }

/* ============================================================
   TABS
   ============================================================ */
.tab-bar {
    display:flex;
    gap:0;
    background:var(--cream-dark);
    border-radius:var(--radius-sm);
    padding:.25rem;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    margin-bottom:1rem;
}
.tab-bar::-webkit-scrollbar { display:none; }
.tab-btn {
    padding:.38rem .8rem;
    border:none;
    background:transparent;
    border-radius:calc(var(--radius-sm) - 2px);
    font-size:.78rem;
    font-weight:600;
    color:var(--text-medium);
    cursor:pointer;
    white-space:nowrap;
    transition:var(--transition);
    min-height:32px;
}
.tab-btn.active { background:var(--white); color:var(--dark-gold); box-shadow:0 1px 4px rgba(0,0,0,.08); }
.tab-btn:hover:not(.active) { color:var(--text-dark); }

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
    background:var(--white);
    padding:1rem .85rem;
    text-align:center;
    color:var(--text-medium);
    margin-top:1.5rem;
    box-shadow:0 -2px 8px var(--shadow);
    font-size:.79rem;
}
.footer p { margin-bottom:.25rem; }
.footer-pages { display:flex; flex-wrap:wrap; justify-content:center; gap:.3rem .9rem; margin-top:.5rem; padding-top:.5rem; border-top:1px solid var(--cream-dark); }
.footer-pages a { color:var(--text-medium); text-decoration:none; font-size:.76rem; transition:.15s; }
.footer-pages a:hover { color:var(--dark-gold); text-decoration:underline; }
/* Public policy pages */
.page-content-wrap { max-width:780px; margin:0 auto; padding:1.5rem .85rem 3rem; }
.page-content-wrap h1 { font-size:1.6rem; color:var(--dark-gold); margin-bottom:.3rem; }
.page-content-wrap .page-meta { font-size:.78rem; color:var(--text-medium); margin-bottom:1.5rem; padding-bottom:.75rem; border-bottom:1px solid var(--cream-dark); }
.page-content-wrap .prose { line-height:1.8; color:var(--text-dark); font-size:.93rem; }
.page-content-wrap .prose h2 { font-size:1.1rem; margin:1.5rem 0 .5rem; color:var(--dark-gold); }
.page-content-wrap .prose p  { margin-bottom:1rem; }
.page-content-wrap .prose ul { margin:.5rem 0 1rem 1.25rem; }
.page-content-wrap .prose li { margin-bottom:.35rem; }
/* Login portal links strip */
.login-portal-links { display:flex; justify-content:center; gap:.6rem; flex-wrap:wrap; margin-top:1rem; padding-top:.9rem; border-top:1px solid var(--cream-dark); }
.login-portal-link { display:inline-flex; align-items:center; gap:.3rem; padding:.35rem .75rem; border-radius:20px; font-size:.76rem; font-weight:600; text-decoration:none; border:1px solid; transition:.18s; }
.login-portal-link:hover { opacity:.85; transform:translateY(-1px); }

/* ============================================================
   NOTIFICATION DROPDOWN
   ============================================================ */
@media(max-width:479px) {
    .notif-dropdown { width:calc(100vw - 1.5rem) !important; right:-.75rem !important; }
}

/* ============================================================
   SALESMAN PROFILE CARD
   ============================================================ */
.salesman-profile-card {
    background:var(--white);
    border-radius:var(--radius);
    padding:1rem;
    box-shadow:0 2px 10px var(--shadow);
    border-left:4px solid var(--primary-gold);
    margin-bottom:.85rem;
}
@media(min-width:600px) { .salesman-profile-card { padding:1.35rem; } }

/* ============================================================
   UTILITY
   ============================================================ */
.hidden-xs { display:none !important; }
@media(min-width:600px) { .hidden-xs { display:initial !important; } }
.text-muted   { color:var(--text-medium); font-size:.82rem; }
.text-gold    { color:var(--dark-gold); }
.text-success { color:var(--success); }
.text-danger  { color:var(--danger); }
.text-warning { color:var(--warning); }
.mt-0 { margin-top:0 !important; }
.mb-0 { margin-bottom:0 !important; }
.mb-1 { margin-bottom:.5rem !important; }
.mb-2 { margin-bottom:1rem !important; }
.gap-row { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; }


/* ============================================================
   App-like mobile UX tweaks (v6)
   ============================================================ */
html, body { height:100%; }
body {
  -webkit-tap-highlight-color: transparent;
  padding-bottom: env(safe-area-inset-bottom);
}
button, input, select, textarea { font-size: 16px; } /* prevent iOS zoom */
a, button { touch-action: manipulation; }

@media (max-width: 820px) {
  .container { padding: 0.9rem; }
  .card { border-radius: 16px; }
  .btn, button, .button { min-height: 44px; }
  .nav { top: var(--header-h); }
  .nav-list li a { padding: 0 .75rem; font-size: .82rem; }
  /* Tables: allow horizontal scroll instead of breaking layout */
  table { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:nowrap; }
  th, td { padding: .6rem .65rem; }
  /* Make modal/overlay content usable on mobile */
  .modal, .dialog { max-height: 92vh; overflow:auto; border-radius: 16px; }
}

/* Sticky bottom actions (optional utility) */
.mobile-sticky-actions {
  position: sticky;
  bottom: 0;
  background: rgba(255,248,231,0.96);
  backdrop-filter: blur(6px);
  border-top: 1px solid var(--cream-dark);
  padding: .6rem;
  margin: 0 -1rem;
}