/* ================================
   Bozor Monitoring — Design System
   ================================ */

/* ── LIGHT THEME ── */
:root {
    --bg:        #f0f4ff;
    --bg2:       #e6ecfb;
    --card:      #ffffff;
    --card-2:    #f7f9ff;
    --border:    #cdd6f0;

    --text:      #1a1e38;
    --text-2:    #4a5480;
    --muted:     #8a94b8;

    --p50:  #eff3ff; --p100: #dbe4ff; --p200: #bac8ff;
    --p300: #91aaff; --p400: #5c8cff; --p500: #3370ff;
    --p600: #1b68ff; --p700: #1558e0; --p800: #1048c2; --p900: #0a38a0;

    --nav-from: #1248cc;
    --nav-to:   #0a30a0;
    --nav-text: #ffffff;

    --primary:      var(--p600);
    --primary-d:    var(--p700);
    --primary-dim:  var(--p50);
    --primary-ring: rgba(27,104,255,.18);

    --up:      #dc3545; --up-bg:   #fff1f3; --up-ring:  #ffb3bb;
    --dn:      #1aab7a; --dn-bg:   #edfdf8; --dn-ring:  #6de8c2;
    --acc:     #eea303; --acc-d:   #d48f00;
    --acc-dim: rgba(238,163,3,.12); --acc-ring: rgba(238,163,3,.35);

    --n50:#f8f9fc; --n100:#f0f2f8; --n200:#e2e6f3; --n300:#c8d0e8;
    --n400:#94a0c0; --n500:#6472a0; --n600:#4a5480; --n700:#2e3660;

    --s-xs: 0 1px 2px rgba(27,104,255,.06);
    --s-sm: 0 1px 4px rgba(27,104,255,.07),0 1px 2px rgba(0,0,0,.04);
    --s-md: 0 4px 16px rgba(27,104,255,.10),0 1px 4px rgba(0,0,0,.04);
    --s-lg: 0 8px 32px rgba(27,104,255,.12),0 2px 8px rgba(0,0,0,.05);

    --r-sm:6px; --r-md:12px; --r-lg:16px; --r-xl:20px;
    --ease: cubic-bezier(.4,0,.2,1);
}

/* ── DARK THEME ── */
[data-theme="dark"] {
    --bg:#13151f; --bg2:#191c2a; --card:#1e2133; --card-2:#252840;
    --border:rgba(255,255,255,.08);
    --text:#dde3f5; --text-2:#8892b8; --muted:#4a5078;

    --p50:rgba(27,104,255,.09); --p100:rgba(27,104,255,.15); --p200:rgba(27,104,255,.26);
    --p300:#6699ff; --p400:#7aabff; --p500:#5c8fff; --p600:#5c8fff;
    --p700:#80b0ff; --p800:#a8c8ff; --p900:#ccdeff;

    --nav-from:#0a0c18; --nav-to:#0f1226; --nav-text:#c0ccf0;
    --primary:var(--p600); --primary-d:var(--p400);
    --primary-dim:var(--p50); --primary-ring:rgba(92,143,255,.2);

    --up:#f87171; --up-bg:rgba(248,113,113,.1); --up-ring:rgba(248,113,113,.22);
    --dn:#3ad29f; --dn-bg:rgba(58,210,159,.1);  --dn-ring:rgba(58,210,159,.22);
    --acc:#eea303; --acc-d:#fbbf24;
    --acc-dim:rgba(238,163,3,.12); --acc-ring:rgba(238,163,3,.28);

    --n50:#191c2a; --n100:#1e2133; --n200:rgba(255,255,255,.06);
    --n300:rgba(255,255,255,.1); --n400:#4a5078; --n500:#6472a0;
    --n600:#8892b8; --n700:#b0bbd8;

    --s-xs:0 1px 3px rgba(0,0,0,.4);
    --s-sm:0 2px 8px rgba(0,0,0,.45),0 1px 3px rgba(0,0,0,.3);
    --s-md:0 6px 24px rgba(0,0,0,.55),0 2px 8px rgba(0,0,0,.3);
    --s-lg:0 12px 40px rgba(0,0,0,.65),0 4px 12px rgba(0,0,0,.4);
}

/* ── BASE ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
    background:var(--bg); color:var(--text);
    font-family:'Overpass',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
    -webkit-tap-highlight-color:transparent;
    min-height:100dvh; line-height:1.5;
    transition:background .25s,color .25s;
}
a { color:inherit; }
img { max-width:100%; display:block; }

/* ── NAVBAR ── */
.navbar-custom {
    background:linear-gradient(135deg,var(--nav-from),var(--nav-to));
    padding:.55rem .9rem;
    position:sticky; top:0; z-index:1000;
    box-shadow:0 2px 16px rgba(0,0,0,.28);
    min-height:52px; display:flex; align-items:center;
    transition:background .25s;
}
.navbar-brand {
    font-weight:800; font-size:1rem; letter-spacing:-.4px;
    color:var(--nav-text)!important; text-decoration:none;
    display:flex; align-items:center; gap:8px;
}
.brand-logo {
    width:32px; height:32px;
    background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.22);
    border-radius:9px; display:flex; align-items:center; justify-content:center;
    font-size:.95rem; flex-shrink:0;
}
.btn-theme {
    width:36px; height:36px; border-radius:10px;
    background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18);
    color:var(--nav-text); display:flex; align-items:center; justify-content:center;
    cursor:pointer; font-size:.92rem; transition:background .15s; flex-shrink:0;
}
.btn-theme:hover { background:rgba(255,255,255,.22); }
.btn-nav-add {
    display:inline-flex; align-items:center; gap:5px;
    background:var(--acc); color:#fff!important;
    font-size:.78rem; font-weight:700; border-radius:10px;
    padding:6px 12px; border:none; text-decoration:none;
    transition:background .15s; box-shadow:0 2px 8px var(--acc-ring);
    white-space:nowrap;
}
.btn-nav-add:hover { background:var(--acc-d); }
.btn-nav-user {
    width:36px; height:36px; border-radius:10px;
    background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2);
    color:var(--nav-text); display:flex; align-items:center; justify-content:center;
    cursor:pointer; font-size:.92rem; transition:background .15s;
}
.btn-nav-user:hover { background:rgba(255,255,255,.22); }

/* Dropdown */
.dropdown-menu {
    background:var(--card); border:1.5px solid var(--border);
    border-radius:var(--r-md); box-shadow:var(--s-lg);
    padding:.35rem; min-width:175px;
}
.dropdown-item {
    color:var(--text); border-radius:var(--r-sm);
    font-size:.83rem; padding:.5rem .75rem;
    transition:background .12s; display:flex; align-items:center;
}
.dropdown-item:hover { background:var(--n100); color:var(--text); }
.dropdown-item.text-danger { color:var(--up)!important; }
.dropdown-divider { border-color:var(--border); margin:.25rem 0; }
.dropdown-item-text { color:var(--muted); font-size:.75rem; padding:.35rem .75rem; }

/* ── HERO STRIP ── */
.hero-strip {
    background:linear-gradient(135deg,var(--nav-from),var(--nav-to));
    padding:.7rem .9rem;
    display:flex; align-items:center; justify-content:space-between;
    flex-wrap:wrap; gap:.5rem; transition:background .25s;
}
.hero-label {
    font-size:.67rem; color:rgba(255,255,255,.6);
    font-weight:700; text-transform:uppercase; letter-spacing:.7px;
}
.hero-stats { display:flex; gap:8px; align-items:center; }
.hstat {
    background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.2);
    border-radius:10px; padding:.28rem .65rem; color:#fff; text-align:center;
}
.hstat .hval { font-size:.95rem; font-weight:900; line-height:1.1; }
.hstat .hlbl { font-size:.55rem; opacity:.65; font-weight:600; text-transform:uppercase; letter-spacing:.5px; }

/* ── TOOLBAR ── */
.toolbar {
    background:var(--card); border-bottom:1px solid var(--border);
    display:flex; align-items:center; justify-content:space-between;
    padding:.35rem .75rem; gap:.4rem;
    position:sticky; top:52px; z-index:100;
    box-shadow:var(--s-xs); transition:background .25s,border-color .25s;
}

.filter-scroll {
    display:flex; gap:5px; overflow-x:auto; flex-wrap:nowrap;
    scrollbar-width:none; -ms-overflow-style:none;
    flex:1; min-width:0; padding:2px 0;
    width:100%; order:-1;
}
.filter-scroll::-webkit-scrollbar { display:none; }
.toolbar-actions { display:flex; align-items:center; gap:6px; flex-shrink:0; margin-left:auto; }
.toolbar-count {
    display:inline-flex; align-items:center; gap:4px;
    font-size:.78rem; font-weight:700; color:var(--primary);
    background:var(--primary-dim); border:1px solid var(--p200);
    border-radius:20px; padding:3px 10px; white-space:nowrap;
}

.ftab {
    display:inline-flex; align-items:center; gap:4px; white-space:nowrap; flex-shrink:0;
    padding:6px 13px; border-radius:20px; font-size:.78rem; font-weight:600;
    text-decoration:none; color:var(--text-2); background:var(--bg);
    border:1.5px solid transparent; transition:all .15s var(--ease);
}
.ftab:hover  { border-color:var(--primary); color:var(--primary); background:var(--primary-dim); }
.ftab.active { background:var(--primary); color:#fff; box-shadow:0 2px 8px var(--primary-ring); border-color:transparent; }

.view-toggle {
    display:flex; gap:2px; background:var(--bg);
    border:1.5px solid var(--border); border-radius:9px; padding:3px; flex-shrink:0;
}
.vbtn {
    border:none; background:transparent; color:var(--muted);
    border-radius:6px; width:34px; height:32px;
    display:flex; align-items:center; justify-content:center;
    cursor:pointer; transition:all .15s var(--ease); font-size:.95rem;
}
.vbtn.active { background:var(--card); color:var(--primary); box-shadow:var(--s-xs); }

/* ── CATEGORY HEADER ── */
.cat-section { margin-bottom:1.1rem; }
.cat-header { display:flex; align-items:center; gap:8px; margin-bottom:.55rem; padding:0 2px; }
.cat-icon  { font-size:.9rem; color:var(--primary); display:flex; align-items:center; }
.cat-name  { font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.8px; color:var(--text-2); }
.cat-line  { flex:1; height:1px; background:var(--border); }
.cat-count-badge {
    font-size:.63rem; background:var(--n100); color:var(--n600);
    border-radius:20px; padding:1px 8px; font-weight:700; border:1px solid var(--border);
}

/* ── PRODUCT GRID ── */
.grid-container { display:grid; grid-template-columns:1fr; gap:8px; align-items:start; }
@media (min-width:420px) {
    .grid-container { grid-template-columns:1fr 1fr; }
}
@media (min-width:577px) {
    .grid-container { grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:10px; }
}

/* ── PRODUCT CARD ── */
.product-card {
    background:var(--card); border-radius:var(--r-lg);
    border:1.5px solid var(--border); box-shadow:var(--s-sm);
    transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .15s,background .25s;
    overflow:hidden; display:flex; flex-direction:column;
}
.product-card:hover { transform:translateY(-2px); box-shadow:var(--s-md); border-color:var(--n300); }

/* Card image */
.card-img-wrap {
    position:relative; width:100%; height:110px;
    flex-shrink:0; overflow:hidden; background:var(--n100);
}
@media (min-width:481px) { .card-img-wrap { height:130px; } }

/* ── Mobile horizontal card (<420px) ── */
@media (max-width:419px) {
    .product-card { flex-direction:row; flex-wrap:wrap; }
    .card-img-wrap { width:115px; height:auto; min-height:115px; }
    .card-inner { flex:1; min-width:0; padding:.55rem .6rem .4rem; }
    .card-foot { width:100%; border-radius:0 0 var(--r-lg) var(--r-lg); }
    .price-block { padding:.3rem .4rem .25rem; }
    .pv { font-size:.92rem; }
    .latest-row { flex-wrap:wrap; gap:2px; }
}

.card-img-top-custom {
    width:100%; height:100%; object-fit:cover;
    transition:transform .35s var(--ease);
}
.product-card:hover .card-img-top-custom { transform:scale(1.05); }
.card-img-placeholder {
    width:100%; height:100%;
    display:flex; align-items:center; justify-content:center;
    font-size:2.2rem; color:var(--n400);
    background:linear-gradient(135deg,var(--n100),var(--n200));
}
@media (min-width:481px) { .card-img-placeholder { font-size:2.8rem; } }

.card-img-chip {
    position:absolute; top:6px; right:6px;
    background:rgba(0,0,0,.5)!important; color:#fff!important;
    border:none!important; backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px); font-size:.6rem!important;
}

.card-inner { padding:.6rem .75rem .45rem; flex:1; display:flex; flex-direction:column; gap:.35rem; }
@media (min-width:481px) { .card-inner { padding:.75rem .9rem .5rem; } }

.pname-row  { display:flex; align-items:flex-start; gap:5px; }
.pname-info { flex:1; min-width:0; }
.pname {
    font-size:.85rem; font-weight:800; color:var(--text);
    line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
@media (min-width:481px) { .pname { font-size:.95rem; } }
.pvariety {
    font-size:.65rem; color:var(--muted); margin-top:1px; line-height:1.3;
    display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden;
}
.market-chip {
    flex-shrink:0; font-size:.58rem; font-weight:700;
    color:var(--primary); background:var(--primary-dim);
    border:1px solid var(--p200); border-radius:5px; padding:2px 5px; white-space:nowrap;
}
.card-img-chip.market-chip { font-size:.6rem!important; }

/* Price block */
.price-block {
    background:var(--n50); border-radius:var(--r-sm);
    padding:.4rem .5rem .3rem; border:1px solid var(--n200);
    transition:background .25s,border-color .25s;
}
.price-minmax-row { display:flex; align-items:center; justify-content:center; gap:2px; }
.pcol { flex:1; text-align:center; }
.pl { font-size:.52rem; font-weight:800; text-transform:uppercase; letter-spacing:.6px; margin-bottom:1px; }
.pv { font-size:1rem; font-weight:900; letter-spacing:-.5px; line-height:1; }
@media (min-width:481px) { .pv { font-size:1.1rem; } }
.pv.min,.pl.min { color:var(--dn); }
.pv.max,.pl.max { color:var(--up); }
.psep { color:var(--border); font-size:1.1rem; font-weight:200; padding:0 2px; align-self:center; }
.price-unit { font-size:.58rem; color:var(--muted); font-weight:500; text-align:center; margin-top:2px; }

/* Latest row */
.latest-row { display:flex; align-items:center; justify-content:space-between; font-size:.68rem; gap:3px; }
.latest-val {
    font-weight:800; color:var(--primary); font-size:.73rem;
    background:var(--primary-dim); border:1px solid var(--p200);
    border-radius:5px; padding:1px 5px;
}

/* Change badges */
.changes-row { display:flex; flex-wrap:wrap; gap:3px; }
.ch {
    display:inline-flex; align-items:center; gap:2px;
    font-size:.63rem; font-weight:700; padding:2px 6px; border-radius:20px;
}
.ch.up   { color:var(--up);    background:var(--up-bg);  border:1px solid var(--up-ring); }
.ch.down { color:var(--dn);    background:var(--dn-bg);  border:1px solid var(--dn-ring); }
.ch.flat { color:var(--muted); background:var(--n100);   border:1px solid var(--n200); }
.ch.na   { color:var(--muted); font-style:italic; }

.entry-meta { font-size:.65rem; color:var(--muted); display:flex; align-items:center; gap:3px; }

/* Card footer */
.card-foot {
    display:flex; gap:5px;
    padding:.45rem .65rem .6rem;
    border-top:1px solid var(--border); background:var(--n50);
    transition:background .25s,border-color .25s;
}
.btn-detail {
    flex:1; font-size:.75rem; font-weight:700; padding:8px 6px;
    border-radius:var(--r-sm); border:1.5px solid var(--primary);
    color:var(--primary); background:transparent; text-decoration:none;
    display:flex; align-items:center; justify-content:center; gap:3px;
    transition:all .15s var(--ease);
}
.btn-detail:hover { background:var(--primary); color:#fff; box-shadow:0 2px 8px var(--primary-ring); }
.btn-add-card {
    width:38px; height:38px; border-radius:var(--r-sm); border:none;
    background:var(--acc); color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-size:1.1rem; text-decoration:none;
    transition:background .15s; flex-shrink:0; box-shadow:0 2px 6px var(--acc-ring);
}
.btn-add-card:hover { background:var(--acc-d); }

/* ── LIST MODE ── */
.list-wrap {
    background:var(--card); border-radius:var(--r-lg);
    border:1.5px solid var(--border); box-shadow:var(--s-sm);
    overflow:hidden; transition:background .25s,border-color .25s;
}
.list-head { display:none; }
.list-row {
    display:grid; grid-template-columns:1fr auto auto;
    grid-template-rows:auto auto; gap:2px 8px;
    padding:.65rem .85rem; border-bottom:1px solid var(--border);
    align-items:center; transition:background .12s; color:inherit; text-decoration:none;
}
.list-row:last-child { border-bottom:none; }
.list-row:hover { background:var(--primary-dim); }
.lr-col-name          { grid-column:1/3; grid-row:1; }
.lr-col-price.lr-min  { grid-column:1; grid-row:2; }
.lr-col-price.lr-max  { grid-column:2; grid-row:2; }
.lr-col-avg,.lr-col-hafta,.lr-col-oylik { display:none; }
.lr-col-acts          { grid-column:3; grid-row:1/3; align-self:center; }
.lr-name { font-weight:700; font-size:.88rem; color:var(--text); }
.lr-var  { font-size:.68rem; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:180px; }
.lr-min  { font-weight:800; font-size:.88rem; color:var(--dn); }
.lr-max  { font-weight:800; font-size:.88rem; color:var(--up); }
.lr-avg  { font-weight:600; font-size:.83rem; color:var(--text-2); }
.lr-acts { display:flex; gap:5px; justify-content:flex-end; align-items:center; }
.lbtn {
    width:40px; height:40px; border-radius:9px;
    border:1.5px solid var(--border); background:transparent; color:var(--text-2);
    display:flex; align-items:center; justify-content:center;
    font-size:.9rem; text-decoration:none; transition:all .15s var(--ease); cursor:pointer;
}
.lbtn:hover            { background:var(--primary); color:#fff; border-color:var(--primary); }
.lbtn.lbtn-add         { background:var(--acc); color:#fff; border-color:var(--acc); }
.lbtn.lbtn-add:hover   { background:var(--acc-d); border-color:var(--acc-d); }
.lch { display:inline-flex; align-items:center; gap:2px; font-size:.72rem; font-weight:700; border-radius:6px; padding:1px 5px; }
.lch.up   { color:var(--up); background:var(--up-bg); }
.lch.down { color:var(--dn); background:var(--dn-bg); }
.lch.flat { color:var(--muted); }

@media (min-width:769px) {
    .list-head {
        display:grid; grid-template-columns:2.2fr 1fr 1fr 1fr 1.1fr 90px;
        padding:.45rem 1rem; background:var(--n50); border-bottom:1.5px solid var(--border);
        font-size:.64rem; font-weight:700; text-transform:uppercase;
        letter-spacing:.7px; color:var(--muted); transition:background .25s;
    }
    .list-row {
        grid-template-columns:2.2fr 1fr 1fr 1fr 1.1fr 90px;
        grid-template-rows:auto; padding:.55rem 1rem;
    }
    /* reset mobile placement */
    .lr-col-name  { grid-column:1; grid-row:1; display:flex; flex-direction:column; justify-content:center; }
    .lr-col-price.lr-min { grid-column:2; grid-row:1; display:flex; align-items:center; }
    .lr-col-price.lr-max { grid-column:3; grid-row:1; display:flex; align-items:center; }
    .lr-col-avg   { grid-column:4; grid-row:1; display:flex; align-items:center; }
    .lr-col-hafta { grid-column:5; grid-row:1; display:flex; align-items:center; }
    .lr-col-acts  { grid-column:6; grid-row:1; align-self:center; display:flex; gap:5px; justify-content:flex-end; align-items:center; }
    .lbtn { width:30px; height:30px; border-radius:7px; font-size:.82rem; }
}

/* ── CHARTS ── */
.chart-card {
    background:var(--card); border-radius:var(--r-lg);
    border:1.5px solid var(--border); box-shadow:var(--s-sm);
    overflow:hidden; transition:background .25s,border-color .25s;
}
.chart-head {
    padding:.6rem .85rem; border-bottom:1px solid var(--border);
    display:flex; align-items:center; justify-content:space-between;
    flex-wrap:wrap; gap:8px; background:var(--card);
    transition:background .25s,border-color .25s;
}
.chart-head h6 { margin:0; font-size:.83rem; font-weight:700; color:var(--text); display:flex; align-items:center; gap:6px; }
.chart-body { padding:.65rem .5rem .85rem; }
.chart-body canvas { min-height:260px; }
@media (min-width:577px) { .chart-body { padding:1rem; } .chart-body canvas { min-height:420px; } }

.bgroup {
    display:flex; gap:2px; background:var(--bg);
    border:1.5px solid var(--border); border-radius:9px; padding:3px;
    transition:background .25s,border-color .25s;
}
.bgroup button {
    border:none; background:transparent; color:var(--text-2);
    font-size:.71rem; font-weight:600; border-radius:6px; padding:4px 8px;
    cursor:pointer; transition:all .15s var(--ease); white-space:nowrap;
}
.bgroup button.active,
.bgroup button:hover { background:var(--primary); color:#fff; box-shadow:0 1px 4px var(--primary-ring); }

/* ── STAT CARDS (product detail) ── */
.stat-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin-bottom:1rem; }
@media (min-width:769px) { .stat-grid { grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); } }

.stat-card {
    border-radius:var(--r-md); padding:.65rem .85rem;
    border:1.5px solid; transition:background .25s,border-color .25s;
}
.stat-card-min  { background:var(--dn-bg); border-color:var(--dn-ring); }
.stat-card-max  { background:var(--up-bg); border-color:var(--up-ring); }
.stat-card-avg  { background:var(--n50);   border-color:var(--border);  }
.stat-card-chg  { background:var(--card);  border-color:var(--border);  }
.stat-label {
    font-size:.58rem; font-weight:800; text-transform:uppercase;
    letter-spacing:.7px; margin-bottom:4px; display:flex; align-items:center; gap:4px;
}
.stat-val { font-size:1.3rem; font-weight:900; line-height:1; }
@media (min-width:481px) { .stat-val { font-size:1.45rem; } }
.stat-unit { font-size:.6rem; margin-top:3px; }

/* ── DAILY TABLE → CARDS on mobile ── */
.day-table-wrap { display:none; }
@media (min-width:577px) { .day-table-wrap { display:block; overflow-x:auto; } }

.day-cards-wrap { display:flex; flex-direction:column; gap:0; }
@media (min-width:577px) { .day-cards-wrap { display:none; } }

.day-card-row {
    display:grid; grid-template-columns:1fr 1fr 1fr;
    gap:4px; padding:.6rem .85rem;
    border-bottom:1px solid var(--n100);
    transition:background .1s;
}
.day-card-row:last-child { border-bottom:none; }
.day-card-row:active { background:var(--primary-dim); }
.day-card-date {
    grid-column:1/-1; font-size:.7rem; font-weight:700;
    color:var(--text); margin-bottom:3px;
    display:flex; align-items:center; justify-content:space-between;
}
.day-card-cnt {
    background:var(--n100); border-radius:20px;
    padding:1px 8px; font-size:.63rem; color:var(--muted); font-weight:700;
}
.day-card-stat { text-align:center; }
.day-card-lbl { font-size:.55rem; font-weight:800; text-transform:uppercase; letter-spacing:.5px; }
.day-card-v   { font-size:.92rem; font-weight:900; line-height:1.2; }

/* ── FORMS ── */
.form-control,.form-select {
    border-radius:var(--r-sm); border:1.5px solid var(--n300);
    background:var(--card); color:var(--text); font-size:.92rem; padding:.65rem .9rem;
    transition:border-color .15s,box-shadow .15s,background .25s,color .25s;
}
.form-control:focus,.form-select:focus {
    border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-ring);
    outline:none; background:var(--card); color:var(--text);
}
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select { border-color:var(--n300); background:var(--bg2); color:var(--text); }
[data-theme="dark"] .form-control::placeholder { color:var(--n500); }

.btn-save {
    background:linear-gradient(135deg,var(--p600),var(--p700));
    border:none; color:#fff; font-weight:700;
    border-radius:var(--r-sm); padding:12px 20px;
    transition:all .15s var(--ease); box-shadow:0 2px 8px var(--primary-ring);
    cursor:pointer; font-size:.95rem; width:100%;
}
.btn-save:hover { filter:brightness(1.08); box-shadow:0 4px 14px var(--primary-ring); }

.btn-secondary-custom {
    background:transparent; border:1.5px solid var(--border);
    color:var(--text-2); border-radius:var(--r-sm); padding:12px 14px;
    font-weight:600; transition:all .15s var(--ease); cursor:pointer;
}
.btn-secondary-custom:hover { background:var(--n100); border-color:var(--n300); }

.btn-export {
    display:inline-flex; align-items:center; justify-content:center;
    width:34px; height:34px; border-radius:var(--r-sm);
    border:1.5px solid var(--border); background:var(--card);
    color:#1d6f42; font-size:1rem; text-decoration:none;
    transition:all .15s var(--ease); flex-shrink:0;
}
.btn-export:hover { background:#1d6f42; color:#fff; border-color:#1d6f42; }
[data-theme="dark"] .btn-export { color:#4ade80; }
[data-theme="dark"] .btn-export:hover { background:#15803d; color:#fff; border-color:#15803d; }

/* Period & live badges */
.period-badge {
    display:inline-flex; align-items:center; gap:4px;
    font-size:.68rem; font-weight:700;
    background:var(--primary-dim); border:1px solid var(--p200);
    border-radius:6px; padding:1px 7px; color:var(--primary);
}
.period-badge.live { background:var(--dn-bg); border-color:var(--dn-ring); color:var(--dn); }
.live-dot {
    width:6px; height:6px; border-radius:50%; background:var(--dn);
    display:inline-block; animation:livePulse 2s infinite;
}
@keyframes livePulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(.8)} }

/* ── TOASTS ── */
.bm-toast {
    display:flex; align-items:center; gap:10px; padding:.7rem 1rem;
    border-radius:var(--r-md); font-size:.85rem; font-weight:600;
    box-shadow:var(--s-lg); animation:toastIn .22s var(--ease); border:1.5px solid;
}
.bm-toast span { flex:1; }
.bm-toast-success { background:var(--card); border-color:var(--dn-ring); color:var(--text); }
.bm-toast-success i:first-child { color:var(--dn); font-size:1.1rem; }
.bm-toast-error,.bm-toast-warning { background:var(--card); border-color:var(--up-ring); color:var(--text); }
.bm-toast-error i:first-child,.bm-toast-warning i:first-child { color:var(--up); font-size:1.1rem; }
.bm-toast-close {
    background:none; border:none; color:var(--muted); cursor:pointer;
    padding:2px 4px; border-radius:6px; display:flex; align-items:center;
    font-size:1rem; transition:background .12s; flex-shrink:0;
}
.bm-toast-close:hover { background:var(--n100); color:var(--text); }
@keyframes toastIn {
    from{opacity:0;transform:translateY(-10px) scale(.97)}
    to{opacity:1;transform:translateY(0) scale(1)}
}

/* ── FOOTER ── */
footer {
    display:none; /* hidden on mobile — bottom nav takes that space */
}
@media (min-width:577px) {
    footer {
        display:block;
        position:fixed; bottom:0; left:0; right:0; z-index:400;
        background:var(--card); border-top:1px solid var(--border);
        padding:.4rem 1rem; font-size:.7rem; color:var(--muted);
        text-align:center; transition:background .25s,border-color .25s;
    }
    main { padding-bottom:2rem; }
}
.empty-state { text-align:center; padding:3.5rem 1rem; color:var(--muted); }
.empty-state i { font-size:2.5rem; margin-bottom:.75rem; display:block; opacity:.2; }
.empty-state p { font-size:.88rem; }

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width:4px; height:4px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--n300); border-radius:10px; }

/* ── ANIMATIONS ── */
@keyframes fadeUp {
    from{opacity:0;transform:translateY(8px)}
    to{opacity:1;transform:none}
}
.product-card { animation:fadeUp .18s ease both; }
.list-row     { animation:fadeUp .1s ease both; }
.product-card:nth-child(1){animation-delay:.02s}
.product-card:nth-child(2){animation-delay:.05s}
.product-card:nth-child(3){animation-delay:.08s}
.product-card:nth-child(4){animation-delay:.11s}
.product-card:nth-child(5){animation-delay:.14s}
.product-card:nth-child(6){animation-delay:.17s}

/* ══════════════════════════════
   BOTTOM NAV — mobile only
   ══════════════════════════════ */
main { padding-bottom:4.5rem; }

.bottom-nav {
    position:fixed; bottom:0; left:0; right:0;
    display:flex; background:var(--card);
    border-top:1px solid var(--border);
    box-shadow:0 -4px 20px rgba(0,0,0,.12);
    z-index:500; height:60px;
    padding-bottom:env(safe-area-inset-bottom);
    transition:background .25s,border-color .25s;
}
.bnav-item {
    flex:1; display:flex; flex-direction:column;
    align-items:center; justify-content:center; gap:3px;
    color:var(--muted); text-decoration:none;
    font-size:.57rem; font-weight:700; text-transform:uppercase; letter-spacing:.5px;
    transition:color .15s; -webkit-tap-highlight-color:transparent; position:relative;
}
.bnav-item i { font-size:1.35rem; line-height:1; }
.bnav-item.active { color:var(--primary); }
.bnav-item.active::before {
    content:''; position:absolute; top:0; left:50%; transform:translateX(-50%);
    width:32px; height:3px; background:var(--primary);
    border-radius:0 0 4px 4px;
}
/* Center FAB-style add button */
.bnav-item.bnav-add { color:var(--muted); }
.bnav-item.bnav-add i {
    width:48px; height:48px; background:var(--acc); border-radius:14px;
    display:flex; align-items:center; justify-content:center; font-size:1.5rem;
    box-shadow:0 4px 16px var(--acc-ring);
    transition:background .15s,transform .15s; margin-top:-12px; color:#fff;
}
.bnav-item.bnav-add span { color:var(--muted); }
.bnav-item.bnav-add.active i,
.bnav-item.bnav-add:hover i { background:var(--acc-d); transform:scale(1.06); }
.bnav-item.bnav-add::before { display:none; }

/* ══════════════════════════════
   LAYOUT HELPERS
   ══════════════════════════════ */
.entry-grid { display:grid; grid-template-columns:1fr; gap:1rem; align-items:start; }
.entry-today-panel { max-height:280px; }
.detail-tools { display:flex; align-items:center; gap:8px; margin-bottom:.75rem; flex-wrap:wrap; }
#id_price { font-size:1.65rem!important; }

/* ── ≥ 577px — tablet up ── */
@media (min-width:577px) {
    .bottom-nav { display:none; }
    main { padding-bottom:0; }
    .toolbar { flex-wrap:nowrap; padding:.4rem .75rem; top:56px; }
    .filter-scroll { width:auto; order:0; }
    .toolbar-actions { margin-left:0; }
    .ftab { padding:4px 12px; font-size:.78rem; }
    .vbtn { width:30px; height:26px; font-size:.9rem; }
    .navbar-brand { font-size:1.1rem; }
    .hero-strip { padding:.85rem 1rem; }
    .hstat { padding:.3rem .75rem; }
    .hstat .hval { font-size:1.05rem; }
    .chart-head { flex-wrap:nowrap; }
    .btn-save { width:auto; }
    .entry-today-panel { max-height:none!important; }
}
@media (min-width:701px) {
    .entry-grid { grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); }
}
@media (hover:none) { .product-card:hover { transform:none; } }