/* ============================================================
   Majedar SalesApp v1.2 — Biz Analyst-inspired mobile UI
   ============================================================ */

:root {
  --bg: #f4f6f9;
  --card: #fff;
  --ink: #101827;
  --ink-2: #374151;
  --muted: #6b7280;
  --line: #e5e7eb;
  --line-2: #f1f5f9;

  --brand: #0288d1;         /* Biz blue */
  --brand-dark: #01579b;
  --brand-tint: #e1f5fe;
  --accent: #10b981;        /* green */
  --warn: #ef4444;
  --warn-tint: #fee2e2;
  --orange: #ff6b35;        /* FAB / reminders */

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
       background: var(--bg); color: var(--ink); font-size: 15px; line-height: 1.4; }
body.has-nav { padding-bottom: 64px; }
a { color: var(--brand); text-decoration: none; }
h1, h2, h3, h4 { margin: 10px 0 6px; color: var(--ink); }
h2 { font-size: 20px; }
h3 { font-size: 16px; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.due { color: var(--warn); font-weight: 600; }

/* ==== Top bar (v2 - Biz style) ==== */
.topbar-v2 { display: flex; align-items: center; gap: 8px;
             padding: 10px 12px; background: var(--brand); color: #fff;
             position: sticky; top: 0; z-index: 20;
             padding-top: calc(10px + env(safe-area-inset-top)); }
.topbar-title { flex: 1; font-weight: 600; font-size: 16px; text-align: center;
                white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.icon-btn { background: transparent; border: none; padding: 8px; cursor: pointer;
            color: #fff; display: flex; align-items: center; justify-content: center;
            border-radius: 50%; }
.icon-btn:active { background: rgba(255,255,255,0.15); }

/* Sub-header (last sync bar etc) */
.subheader { padding: 6px 14px; background: var(--card); border-bottom: 1px solid var(--line);
             font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 6px;
             position: sticky; top: 52px; z-index: 15; }
.subheader .sync-fresh { color: var(--accent); }
.subheader .sync-stale { color: var(--warn); }

/* ==== Content wrapper ==== */
.content { max-width: 720px; margin: 0 auto; padding: 12px 12px 20px; }

/* ==== Drawer (side menu) ==== */
.drawer { position: fixed; top: 0; left: 0; height: 100vh; width: 82%; max-width: 340px;
          background: var(--card); z-index: 40; transform: translateX(-100%);
          transition: transform 0.25s ease; overflow-y: auto;
          box-shadow: var(--shadow-md); }
.drawer.open { transform: translateX(0); }
.drawer-user { display: flex; gap: 12px; align-items: center; padding: 20px 16px;
               background: var(--brand-tint); border-bottom: 1px solid var(--line); }
.drawer-avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--brand);
                 color: #fff; display: flex; align-items: center; justify-content: center;
                 font-weight: 700; font-size: 20px; }
.drawer-name { font-weight: 600; }
.drawer-email { font-size: 12px; }
.drawer-section-title { padding: 12px 16px 4px; color: var(--muted); font-size: 12px;
                        text-transform: uppercase; letter-spacing: 0.5px; }
.drawer-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px;
               color: var(--ink); font-size: 15px; border-bottom: 1px solid var(--line-2); }
.drawer-item:active { background: var(--brand-tint); }
.drawer-ico { width: 24px; text-align: center; font-size: 16px; color: var(--muted); }
.drawer-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 35;
                  opacity: 0; pointer-events: none; transition: opacity 0.2s; }
.drawer-overlay.open { opacity: 1; pointer-events: auto; }

/* ==== Bottom nav (4 tabs) ==== */
.bottom-nav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 20;
              display: flex; background: var(--card); border-top: 1px solid var(--line);
              padding-bottom: env(safe-area-inset-bottom); }
.bnav-item { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px;
             padding: 8px 4px; color: var(--muted); font-size: 11px; font-weight: 500; }
.bnav-item svg { width: 22px; height: 22px; }
.bnav-item.active { color: var(--brand); }
.bnav-item:active { background: var(--brand-tint); }

/* ==== Flash messages ==== */
.flash { padding: 10px 12px; border-radius: 8px; margin: 8px 0;
         background: var(--warn-tint); color: #7f1d1d; font-size: 14px; }
.flash.info { background: #dbeafe; color: #1e3a8a; }
.flash.warning { background: #fef3c7; color: #78350f; }
.flash.success, .flash.info { background: #dcfce7; color: #14532d; }

/* ==== Dashboard cards (Biz-style) ==== */
.dash-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 8px 0 14px; }
.dash-action { display: flex; align-items: center; gap: 8px; padding: 14px;
               background: var(--card); border: 1px solid var(--line); border-radius: 10px;
               color: var(--brand); font-weight: 600; justify-content: center; }
.dash-action svg { width: 20px; height: 20px; }

.date-range-bar { display: flex; align-items: center; justify-content: space-between;
                  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
                  padding: 10px 14px; margin: 12px 0; font-size: 14px; }
.date-range-bar .drb-nav { padding: 4px 10px; color: var(--muted); font-size: 18px; cursor: pointer;
                           background: none; border: none; }
.date-range-bar .drb-mid { display: flex; align-items: center; gap: 6px; color: var(--ink); }

.did-you-know { display: flex; align-items: center; gap: 10px; padding: 12px;
                background: var(--brand-tint); border-radius: 10px; margin: 8px 0;
                color: var(--brand-dark); font-size: 13px; }

.stat-list { display: flex; flex-direction: column; background: var(--card);
             border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.stat-row { display: flex; align-items: center; gap: 14px; padding: 14px 16px;
            border-bottom: 1px solid var(--line-2); color: var(--ink); }
.stat-row:last-child { border-bottom: none; }
.stat-row:active { background: var(--brand-tint); }
.stat-ico { width: 40px; height: 40px; border-radius: 10px; background: var(--brand-tint);
            display: flex; align-items: center; justify-content: center; color: var(--brand);
            flex-shrink: 0; }
.stat-ico svg { width: 20px; height: 20px; }
.stat-body { flex: 1; min-width: 0; }
.stat-amt { font-size: 17px; font-weight: 700; }
.stat-lbl { font-size: 13px; color: var(--muted); margin-top: 1px; }
.stat-row.warn .stat-amt { color: var(--warn); }
.stat-row.negative .stat-amt { color: var(--warn); }

/* ==== FAB (floating action button) ==== */
.fab { position: fixed; bottom: 76px; right: 16px; z-index: 15;
       background: var(--orange); color: #fff;
       padding: 12px 18px; border-radius: 28px; font-weight: 600;
       display: inline-flex; align-items: center; gap: 6px;
       box-shadow: var(--shadow-md); border: none; font-size: 14px; }
.fab svg { width: 18px; height: 18px; }

/* ==== Outstanding (Biz-style) ==== */
.out-header { text-align: center; padding: 16px; background: var(--brand); color: #fff; }
.out-header .lbl { font-size: 13px; opacity: 0.9; }
.out-header .amt { font-size: 26px; font-weight: 700; margin-top: 6px; }
.out-tabs { display: flex; background: var(--card); border-bottom: 1px solid var(--line); }
.out-tab { flex: 1; padding: 12px; text-align: center; color: var(--muted); font-weight: 500;
           border-bottom: 3px solid transparent; }
.out-tab.active { color: var(--brand); border-bottom-color: var(--brand); }

.party-card { background: var(--card); padding: 14px 16px; border-bottom: 1px solid var(--line-2);
              display: flex; justify-content: space-between; gap: 8px; }
.party-card:active { background: var(--brand-tint); }
.party-name { font-weight: 600; margin-bottom: 4px; color: var(--ink); }
.party-meta { color: var(--muted); font-size: 12px; line-height: 1.5; }
.party-amt { font-weight: 700; color: var(--ink); text-align: right; }
.party-amt.due { color: var(--warn); }
.party-days-warn { color: var(--warn); }

/* ==== Reports list (Biz-style) ==== */
.report-list { background: var(--card); border-radius: 12px; overflow: hidden;
               border: 1px solid var(--line); }
.report-row { display: flex; align-items: center; gap: 14px; padding: 14px 16px;
              border-bottom: 1px solid var(--line-2); color: var(--ink); }
.report-row:last-child { border-bottom: none; }
.report-row:active { background: var(--brand-tint); }
.report-ico { width: 36px; height: 36px; border-radius: 8px; background: var(--brand-tint);
              display: flex; align-items: center; justify-content: center; color: var(--brand); }
.report-ico svg { width: 18px; height: 18px; }
.report-body { flex: 1; }
.report-name { font-weight: 500; font-size: 15px; }
.report-desc { color: var(--muted); font-size: 12px; margin-top: 2px; }
.report-arrow { color: var(--muted); }

/* ==== Sales Team page ==== */
.team-card { background: var(--card); padding: 14px 16px; border-bottom: 1px solid var(--line-2);
             display: flex; align-items: center; gap: 12px; }
.team-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--brand);
               color: #fff; display: flex; align-items: center; justify-content: center;
               font-weight: 700; font-size: 15px; }
.team-body { flex: 1; }
.team-name { font-weight: 600; }
.team-meta { font-size: 12px; color: var(--muted); }
.team-amt { font-weight: 700; text-align: right; }

/* ==== Section titles / spacing ==== */
.sec-title { font-size: 13px; text-transform: uppercase; color: var(--muted);
             margin: 20px 0 8px 4px; letter-spacing: 0.5px; }

/* ==== Legacy card grid (dashboard old style — still used on some pages) ==== */
.cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 8px 0; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 12px;
        padding: 14px; text-align: left; color: var(--ink); }
.card .num { font-size: 18px; font-weight: 700; }
.card .lbl { color: var(--muted); font-size: 12px; margin-top: 4px; }
.card.warn .num { color: var(--warn); }

/* ==== Lists (used on customers/daybook/etc) ==== */
.list { list-style: none; padding: 0; margin: 8px 0; }
.list li { background: var(--card); border: 1px solid var(--line); border-radius: 10px;
           margin-bottom: 6px; padding: 12px 14px; }
.list li a { color: inherit; display: block; }
.row { display: flex; justify-content: space-between; gap: 8px; }

/* ==== Search / filters ==== */
.searchbar { margin: 8px 0; }
.searchbar input, .searchbar select { width: 100%; padding: 11px 14px;
    border: 1px solid var(--line); border-radius: 10px; background: var(--card); color: var(--ink);
    font-size: 15px; }
.filters { display:flex; gap: 6px; margin: 8px 0; flex-wrap: wrap; }
.filters a { padding: 6px 12px; background: var(--card); border: 1px solid var(--line);
             border-radius: 999px; color: var(--muted); font-size: 13px; }
.filters a.active { background: var(--brand); color: white; border-color: var(--brand); }

/* ==== Tables ==== */
.tbl { width: 100%; border-collapse: collapse; background: var(--card); font-size: 14px;
       border-radius: 10px; overflow: hidden; }
.tbl th, .tbl td { padding: 10px 12px; border-bottom: 1px solid var(--line-2); text-align: left; }
.tbl th { font-weight: 600; color: var(--muted); background: var(--line-2); }

/* ==== Buttons ==== */
.btn { display: inline-block; padding: 10px 16px; background: var(--brand); color: white;
       border-radius: 8px; margin-right: 6px; font-weight: 500; border: none; cursor: pointer;
       font-size: 14px; }
.btn:active { background: var(--brand-dark); }
.btn-alt { background: var(--card); color: var(--ink); border: 1px solid var(--line); }
.btn-x { background: transparent; border: none; color: var(--warn); font-size: 16px;
         cursor: pointer; padding: 4px; }
.actions { margin: 10px 0; display: flex; gap: 8px; flex-wrap: wrap; }

/* ==== Form fields (voucher_new etc) ==== */
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
form label { display: block; margin: 10px 0; font-size: 13px; color: var(--muted); }
form label input[type=text], form label input[type=number], form label input[type=date],
form label input[type=email], form label input[type=password],
form label select, form label textarea, form input[type=text], form input[type=number] {
  display: block; width: 100%; padding: 11px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--card); color: var(--ink); font-size: 15px;
  margin-top: 4px;
}
.typeahead { background: var(--card); border: 1px solid var(--line); border-radius: 8px;
             max-height: 260px; overflow-y: auto; margin-top: 2px; }
.typeahead:empty { display: none; }
.typeahead-item { padding: 10px 12px; border-bottom: 1px solid var(--line-2); cursor: pointer; }
.typeahead-item:active { background: var(--brand-tint); }
.items-tbl { margin: 8px 0; }
.items-tbl td { vertical-align: top; padding: 6px 4px; }
.items-tbl input[type=number] { padding: 6px 8px; font-size: 14px; }
.itemcell { min-width: 200px; }
.itemcell .itemSearch { width: 100%; padding: 6px 8px; font-size: 14px; }
.totals { background: var(--card); border: 1px solid var(--line); border-radius: 10px;
          padding: 12px; margin: 12px 0; text-align: right; }
.totals div { padding: 3px 0; }
.totals .big { font-size: 18px; font-weight: 700; border-top: 1px solid var(--line);
               margin-top: 6px; padding-top: 8px; }

/* Party balance + pay mode */
.party-balance { margin-top: 6px; padding: 8px 10px; border-radius: 6px; font-size: 13px; }
.party-balance:empty { display: none; }
.party-balance.due { background: var(--warn-tint); color: #991b1b; }
.party-balance.ok  { background: #dcfce7; color: #166534; }
.party-balance.muted { background: var(--card); color: var(--muted); }
.pay-toggle { display: flex; gap: 8px; margin-top: 4px; }
.pay-opt { display: flex; align-items: center; gap: 6px; font-size: 13px;
           color: var(--ink); margin: 0; padding: 10px 12px;
           border: 1px solid var(--line); border-radius: 8px; cursor: pointer;
           background: var(--card); flex: 1; }
.pay-opt input { width: auto; margin: 0; }

.daterange { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; margin: 10px 0; }
.daterange label { margin: 0; }
.daterange input[type=date], .daterange input[type=text], .daterange select {
  padding: 8px; font-size: 14px; margin-top: 2px;
}

/* Voucher detail */
.v-header { background: var(--card); border: 1px solid var(--line); border-radius: 10px;
            padding: 12px; margin: 10px 0; }
.v-header div { padding: 3px 0; }
.sync-synced { color: var(--accent); }
.sync-queued, .sync-in_progress, .sync-retrying { color: #ca8a04; }
.sync-failed, .sync-needs_attention { color: var(--warn); }
.sync-tally_deleted { color:#b91c1c; font-weight:800; }

/* Login */
.login-box { max-width: 360px; margin: 40px auto; background: var(--card); padding: 20px;
             border-radius: 12px; border: 1px solid var(--line); }
.login-box h1 { margin-top: 0; }
.login-box label { display: block; margin: 10px 0; font-size: 13px; color: var(--muted); }
.login-box input { width: 100%; padding: 11px; border: 1px solid var(--line);
                   border-radius: 8px; font-size: 15px; }
.login-box button { width: 100%; padding: 12px; background: var(--brand); color: white;
                    border: none; border-radius: 8px; font-size: 15px; margin-top: 12px;
                    font-weight: 500; }

/* FAB menu (opens above FAB button) */
.fab-menu { position: fixed; bottom: 136px; right: 16px; z-index: 16;
            background: var(--card); border: 1px solid var(--line); border-radius: 12px;
            padding: 6px; box-shadow: var(--shadow-md); min-width: 180px; }
.fab-menu-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px;
                 color: var(--ink); border-radius: 8px; font-weight: 500; }
.fab-menu-item:active { background: var(--brand-tint); }
.fab-menu-ico { width: 26px; height: 26px; border-radius: 50%; color: #fff;
                display: flex; align-items: center; justify-content: center;
                font-weight: 700; font-size: 13px; }

/* ==== v1.3.35 transaction detail ==== */
.txn-narration { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 3px; }
.txn-open { color: var(--brand); font-size: 12px; margin-top: 7px; font-weight: 600; }
.txn-detail-card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 14px; margin: 8px 0; }
.txn-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 14px; }
.txn-grid > div { min-width: 0; }
.txn-grid span, .txn-note span { display:block; color:var(--muted); font-size:11px; margin-bottom:3px; text-transform:uppercase; letter-spacing:.3px; }
.txn-grid b { display:block; overflow-wrap:anywhere; }
.txn-note { border-top:1px solid var(--line-2); margin-top:14px; padding-top:12px; white-space:pre-wrap; }
@media (max-width: 430px) { .txn-grid { grid-template-columns: 1fr; } }
@media print {
  .no-print, .bottom-nav, .topbar, .fab { display:none !important; }
  body { background:#fff; }
  .content, main { padding:0 !important; margin:0 !important; }
  .txn-detail-card { border:0; box-shadow:none; }
}

/* v1.3.38 printable invoice/receipt documents */
.doc-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.document-sheet{background:#fff;color:#151515;border:1px solid #ddd;border-radius:12px;padding:24px;max-width:900px;margin:auto;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.document-head{display:flex;justify-content:space-between;gap:24px;padding-bottom:16px;border-bottom:2px solid #222}
.document-brand{display:flex;gap:14px;align-items:flex-start}.document-brand h1{margin:0 0 4px;font-size:25px}.document-logo{max-width:120px;max-height:78px;object-fit:contain}
.document-title{text-align:right;font-size:16px}.document-title strong{display:block;font-size:20px;margin:3px 0}.document-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.document-grid div{border:1px solid #e5e5e5;padding:10px;border-radius:8px}.document-grid span{display:block;font-size:11px;color:#777;text-transform:uppercase}.document-party{border:1px solid #ddd;border-radius:8px;padding:14px;margin:14px 0}.document-party h3{margin:3px 0 6px}.document-table-wrap{overflow:auto}.document-table{width:100%;border-collapse:collapse}.document-table th,.document-table td{border-bottom:1px solid #ddd;padding:9px 7px;text-align:left}.document-table th{font-size:12px;background:#f6f6f6}.document-table .num{text-align:right;white-space:nowrap}.document-totals{margin:14px 0 0 auto;max-width:360px}.document-totals div{display:flex;justify-content:space-between;padding:5px 0}.document-totals .grand{font-size:18px;border-top:2px solid #222;margin-top:4px;padding-top:9px}.document-note{margin-top:14px;padding:10px;border:1px solid #e5e5e5;border-radius:8px}.document-foot{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #ddd;margin-top:28px;padding-top:10px;font-size:11px;color:#777}.receipt-amount{display:flex;justify-content:space-between;align-items:center;border:2px solid #222;border-radius:10px;padding:16px;margin:18px 0}.receipt-amount strong{font-size:25px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.form-grid label{margin:0}
@media(max-width:700px){.document-sheet{padding:14px;border-radius:8px}.document-head{display:block}.document-title{text-align:left;margin-top:14px}.document-grid,.form-grid{grid-template-columns:1fr}.document-logo{max-width:90px}.document-table{min-width:620px}}
@media print{body{background:#fff!important}.no-print,.topbar,.sidebar,.bottom-nav{display:none!important}.main,.content{padding:0!important;margin:0!important}.document-sheet{border:0;box-shadow:none;border-radius:0;max-width:none;padding:0}.document-table-wrap{overflow:visible}.document-table{min-width:0}.document-head{break-inside:avoid}.document-totals{break-inside:avoid}}

/* ============================================================
   v1.3.39 — Majedar Tea branded UI
   Reference: red/yellow/white mobile layout supplied by user.
   ============================================================ */
:root {
  --brand: #c91f1f;
  --brand-dark: #a91616;
  --brand-tint: #fff5f2;
  --majedar-yellow: #f1c500;
  --majedar-cream: #fbf8ef;
  --bg: #f8f6f0;
  --card: #ffffff;
  --ink: #1f1f1f;
  --ink-2: #59564f;
  --line: #e7e4dc;
  --accent: #2d8a51;
  --orange: #c91f1f;
}
.majedar-header { position:sticky; top:0; z-index:25; background:#fff; box-shadow:0 1px 0 rgba(0,0,0,.08); }
.majedar-red-strip { height:7px; background:var(--brand); border-bottom:3px solid var(--majedar-yellow); }
.majedar-nav { min-height:72px; padding:8px 16px; display:flex; align-items:center; gap:12px; background:#fff; }
.majedar-logo-link { display:flex; align-items:center; min-width:112px; }
.majedar-app-logo { width:118px; height:52px; object-fit:contain; object-position:left center; display:block; }
.majedar-page-title { flex:1; text-align:center; font-size:16px; font-weight:700; color:#3b3934; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.majedar-nav-actions { display:flex; align-items:center; gap:2px; }
.brand-icon-btn { background:transparent; border:0; color:#111827; padding:9px; border-radius:10px; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.brand-icon-btn:active { background:#f7f2e7; }
.brand-menu-btn { color:#111827; }
.subheader { top:82px; }
.drawer-user { background:#fffaf0; border-bottom:3px solid var(--majedar-yellow); padding:18px 16px; }
.drawer-brand-logo { width:92px; height:48px; display:flex; align-items:center; overflow:hidden; flex:0 0 auto; }
.drawer-brand-logo img { width:92px; height:44px; object-fit:contain; }
.drawer-section-title { color:#6a665e; font-weight:700; text-transform:none; }
.drawer-item { color:#4d4a43; border-bottom:1px solid #f3f0e9; }
.drawer-item:active, .drawer-item:hover { background:#fff9e8; color:var(--brand); }
.bottom-nav { border-top:2px solid #efe7cb; }
.bnav-item.active { color:var(--brand); }
.bnav-item.active::before { background:var(--majedar-yellow); }
.btn { background:var(--brand); border-color:var(--brand); }
.btn:hover { background:var(--brand-dark); }
.btn-alt { background:#fff; color:var(--brand); border:1px solid #d9d4c7; }
.card, .txn-detail-card { border-color:#e9e3d5; box-shadow:0 1px 2px rgba(95,75,20,.04); }
h1,h2,h3,h4 { color:#2a2925; }
h2 { border-bottom:3px solid var(--majedar-yellow); padding-bottom:9px; margin-bottom:14px; }
input:focus, select:focus, textarea:focus { border-color:var(--majedar-yellow) !important; box-shadow:0 0 0 3px rgba(241,197,0,.14); outline:none; }
.document-sheet { border-top:5px solid var(--brand); }
.document-head { border-bottom:3px solid var(--majedar-yellow); }
.document-logo { max-height:78px; max-width:190px; object-fit:contain; }
.document-contact-card { margin-top:12px; padding:10px 12px; border:1px solid #ece5d3; border-radius:8px; background:#fffdf7; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 18px; }
.document-contact-card span { display:block; font-size:10px; text-transform:uppercase; letter-spacing:.35px; color:var(--muted); }
.document-contact-card b { display:block; font-size:12px; overflow-wrap:anywhere; }
@media(max-width:560px){
  .majedar-nav { min-height:66px; padding:7px 12px; }
  .majedar-app-logo { width:110px; height:48px; }
  .majedar-page-title { display:none; }
  .majedar-logo-link { flex:1; }
  .subheader { top:76px; }
  .document-contact-card { grid-template-columns:1fr; }
}
@media print {
  .majedar-header,.bottom-nav,.drawer,.drawer-overlay { display:none !important; }
  .document-sheet { border-top:5px solid #c91f1f !important; }
}
/* v1.3.42: drawer opens from left, so menu/refresh controls live on the left too. */
.majedar-nav-actions-left{display:flex;align-items:center;gap:4px;order:1}
.majedar-page-title{order:2;flex:1;text-align:center}
.majedar-nav-spacer{order:3;width:88px;min-width:88px}
@media (max-width:600px){.majedar-nav-spacer{width:72px;min-width:72px}.majedar-app-logo{max-width:92px}}
/* v1.3.42 transaction detail doubles as printable/shareable bill/receipt. */
.document-company-head{display:flex;align-items:center;gap:16px;padding:16px 18px;margin-bottom:12px;background:#fff;border:1px solid var(--border,#e4e4e4);border-radius:14px}
.document-company-head h2{margin:0 0 4px}.document-logo{width:120px;max-height:72px;object-fit:contain}
@media print{.majedar-header,.drawer,.drawer-overlay,.bottom-nav,.no-print{display:none!important}.content{margin:0!important;padding:0!important}.document-company-head,.txn-detail-card{box-shadow:none!important;border-color:#bbb!important}body{background:#fff!important}}
.majedar-nav-actions-left{order:0}.majedar-logo-link{order:1}.majedar-page-title{order:2}.majedar-nav-spacer{order:3}
/* v1.3.53 dashboard date picker */
.stock-picker-wrap{position:relative;display:flex;align-items:center;gap:6px}
.stock-picker-wrap>input[type=text]{flex:1;padding-right:42px}
.date-pick-btn{position:absolute;right:5px;border:0;background:transparent;font-size:18px;cursor:pointer;padding:5px 7px}

/* v1.3.56: fixed light UI + live India clock */
:root{color-scheme:light}
html,body{color-scheme:light}
.majedar-live-time{order:3;min-width:210px;text-align:right;font-size:13px;font-weight:600;color:#665f53;white-space:nowrap}
.majedar-current-user{order:3;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:800;color:#2f3440}
@media(max-width:760px){.majedar-live-time{min-width:150px;font-size:11px}.majedar-page-title{display:none}.majedar-logo-link{flex:1}}
@media(max-width:480px){.majedar-app-logo{width:82px;height:42px}.majedar-nav{gap:6px;padding-left:7px;padding-right:8px}.majedar-current-user{max-width:72px;font-size:11px}.majedar-live-time{min-width:96px;max-width:108px;white-space:normal;line-height:1.15;text-align:right}.brand-icon-btn{padding:6px}}
.bottom-nav{justify-content:space-around}
.bottom-nav .bnav-item{flex:1}

/* v1.3.63 document printing: A4 + thermal layouts based on user's Tally print formats */
.doc-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin:0 auto 14px;max-width:980px}.doc-toolbar .active{outline:2px solid var(--majedar-yellow)}
.print-document{background:#fff;color:#111;margin:0 auto}.invoice-a4{max-width:900px;border:1px solid #111;font:13px/1.25 Arial,sans-serif}.a4-frame,.a4-items,.a4-tax-table{width:100%;border-collapse:collapse}.a4-frame td,.a4-items th,.a4-items td,.a4-tax-table th,.a4-tax-table td{border:1px solid #111}.a4-company{padding:4px 8px}.a4-company-row{display:flex;align-items:flex-start;gap:10px;text-align:center;justify-content:center}.a4-company-row img{width:120px;max-height:72px;object-fit:contain}.a4-company-row h1{font-size:25px;margin:0 0 2px}.a4-title{padding:3px 6px;text-align:center;position:relative}.a4-title span{position:absolute;left:6px;font-weight:400}.a4-title b{font-size:18px}.a4-party,.a4-invoice-meta{width:50%;padding:6px;vertical-align:top;min-height:140px}.a4-party{height:140px;position:relative}.a4-party-bottom{margin-top:54px}.a4-invoice-meta div{padding:4px}.a4-invoice-meta hr{border:0;border-top:1px solid #111;margin:7px 0}.a4-items{table-layout:fixed}.a4-items th,.a4-items td{padding:4px 5px;vertical-align:top}.a4-items th{text-align:center}.a4-items th:nth-child(1){width:5%}.a4-items th:nth-child(2){width:27%}.a4-items th:nth-child(3){width:11%}.a4-items th:nth-child(4){width:12%}.a4-items th:nth-child(5){width:10%}.a4-items th:nth-child(6){width:9%}.a4-items th:nth-child(7){width:7%}.a4-items th:nth-child(8){width:8%}.a4-items th:nth-child(9){width:11%}.a4-items tbody tr:not(.a4-subtotal) td{height:28px}.a4-items tbody:after{content:"";display:table-row;height:380px}.a4-subtotal td{text-align:center}.a4-subtotal td:last-child{text-align:right}.a4-lower{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #111;border-bottom:1px solid #111}.a4-balances{display:grid;grid-template-columns:150px 1fr;align-content:start;padding:10px;border-right:1px solid #111;gap:7px}.a4-tax{padding:4px}.a4-tax div{display:flex;justify-content:space-between;padding:3px}.a4-tax .grand{border-top:1px solid #111;font-weight:700;font-size:15px}.a4-tax-table th,.a4-tax-table td{padding:4px;text-align:center}.a4-words{padding:5px;border-bottom:1px solid #111}.a4-footer-grid{display:grid;grid-template-columns:1.1fr 1fr;min-height:190px;padding:7px}.a4-footer-grid>div:first-child>div{padding:2px}.terms{margin-top:30px}.a4-qr-sign{display:flex;justify-content:space-around;align-items:flex-start;text-align:center}.payment-qr{width:120px;height:120px;object-fit:contain}.signature-img{display:block;max-width:130px;max-height:85px;object-fit:contain;margin:12px auto 3px}
.invoice-thermal{width:76mm;max-width:76mm;font:10px/1.25 Arial,sans-serif;padding:1mm}.thermal-head{text-align:center}.thermal-head img{width:33mm;max-height:18mm;object-fit:contain}.thermal-head h2{font-size:14px;margin:2px 0}.thermal-head h3{font-size:13px;margin:7px 0 4px;border-top:1px dashed #222;border-bottom:1px dashed #222;padding:3px}.thermal-meta{font-size:9px;margin-bottom:4px}.thermal-meta div{padding:1px 0}.thermal-items{width:100%;border-collapse:collapse;font-size:8px}.thermal-items th,.thermal-items td{padding:2px 1px;border-bottom:1px dotted #aaa;text-align:right}.thermal-items th:nth-child(2),.thermal-items td:nth-child(2){text-align:left}.thermal-totals{margin-left:auto;width:60%;padding-top:4px}.thermal-totals div{display:flex;justify-content:space-between;padding:1px}.thermal-totals .grand{border-top:1px solid #222;border-bottom:1px solid #222;font-size:11px;padding:3px 1px}.thermal-balance{margin-top:7px;border-top:1px dashed #222;padding-top:4px}.thermal-qr{display:flex;align-items:center;gap:5px;margin-top:7px}.thermal-qr img{width:23mm;height:23mm;object-fit:contain}
.receipt-a4{max-width:920px;min-height:1180px;font:14px/1.35 Arial,sans-serif;padding:0 10px}.receipt-a4-head{display:flex;align-items:flex-start;text-align:center;justify-content:center;gap:22px}.receipt-a4-head img{width:135px;max-height:80px;object-fit:contain}.receipt-a4-head h1{font-size:20px;margin:0}.receipt-title{text-align:center;margin:55px 0 30px;font-size:18px}.receipt-meta{display:flex;justify-content:space-between;margin-bottom:18px}.receipt-a4-table{width:100%;border-collapse:collapse;min-height:720px}.receipt-a4-table th{border-top:1px solid #111;border-bottom:1px solid #111;padding:4px}.receipt-a4-table th:first-child{width:82%}.receipt-a4-table th:last-child{border-left:1px solid #111}.receipt-a4-table td{vertical-align:top;padding:10px}.receipt-a4-table td:last-child{border-left:1px solid #111}.receipt-account{margin:8px 0 0 48px;font-weight:700}.receipt-ref{margin-left:48px}.receipt-amount-col{text-align:right;font-size:16px}.receipt-payment-details{margin-top:18px}.receipt-payment-details>div{padding:3px}.receipt-narration{margin-top:16px}.receipt-sign{text-align:right;margin-top:80px}.receipt-sign img{display:block;margin-left:auto;max-width:140px;max-height:85px;object-fit:contain}
@media(max-width:700px){.invoice-a4,.receipt-a4{min-width:780px}.print-document{overflow:visible}.doc-toolbar{padding:0 8px}.a4-items tbody:after{height:180px}}
@media print{body{background:#fff!important}.print-document{box-shadow:none!important}.invoice-a4,.receipt-a4{max-width:none!important;min-width:0!important;border-color:#111!important}.invoice-thermal{width:76mm!important;max-width:76mm!important}.a4-items tbody:after{height:360px}.doc-toolbar{display:none!important}}

/* v1.3.68: compact customer-facing sales documents. No artificial blank invoice rows. */
.a4-sale-items{table-layout:fixed}
.a4-sale-items th:nth-child(1){width:5%}.a4-sale-items th:nth-child(2){width:36%}.a4-sale-items th:nth-child(3){width:13%}.a4-sale-items th:nth-child(4){width:14%}.a4-sale-items th:nth-child(5){width:16%}.a4-sale-items th:nth-child(6){width:16%}
.a4-sale-items tbody:after{content:none!important;display:none!important;height:0!important}
.a4-sale-items tbody tr:not(.a4-subtotal) td{height:auto;min-height:0;padding-top:6px;padding-bottom:6px}
.a4-party,.a4-invoice-meta{min-height:0!important;height:auto!important}.a4-party-bottom{margin-top:8px!important}
.a4-footer-grid{min-height:110px!important}.terms{margin-top:10px!important}
.thermal-sale-items{font-size:8.5px;table-layout:fixed}.thermal-sale-items th:nth-child(1){width:7%}.thermal-sale-items th:nth-child(2){width:38%}.thermal-sale-items th:nth-child(3){width:17%}.thermal-sale-items th:nth-child(4){width:19%}.thermal-sale-items th:nth-child(5){width:19%}
.thermal-sale-items td,.thermal-sale-items th{vertical-align:top;overflow-wrap:anywhere}.thermal-sale-items td:nth-child(3){white-space:nowrap}.thermal-sale-items small{display:block;font-size:7px;color:#444;margin-top:1px}
.thermal-sale-items tfoot td{border-top:1px solid #222;border-bottom:1px solid #222;padding-top:3px;padding-bottom:3px}
.thermal-tax-summary{margin-top:5px;border-top:1px dashed #222;padding-top:3px}.thermal-tax-summary>div{display:flex;justify-content:space-between;gap:8px;padding:1px 0}.thermal-tax-summary .grand{border-top:1px solid #222;border-bottom:1px solid #222;margin-top:2px;padding:3px 0;font-size:11px}
@media(max-width:700px){.a4-sale-items tbody:after{content:none!important;height:0!important}}
@media print{.a4-sale-items tbody:after{content:none!important;height:0!important}.a4-footer-grid{min-height:90px!important}}

/* v1.3.74 report UX */
.report-native-date{position:absolute!important;opacity:0!important;width:1px!important;height:1px!important;pointer-events:none!important}
.report-date-wrap{min-width:160px}
.report-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin:8px 0 14px}
@media print{.report-actions,.daterange,.filter-row,.bottom-nav,.majedar-header,.drawer,.drawer-overlay{display:none!important}.content{max-width:none!important;padding:0!important}body{background:#fff!important}.tbl{font-size:11px}.card{box-shadow:none!important}}

/* v1.3.75: thermal legibility / crisp monochrome output */
.thermal-buyer{font-size:12.5px!important;line-height:1.18;margin:3px 0 4px;color:#000}.thermal-buyer b{font-size:13.5px;font-weight:800}.thermal-buyer span{font-size:9px;font-weight:700}
@media print{
  .print-document,.print-document *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;text-shadow:none!important;color:#000!important}
  .invoice-thermal{font:11px/1.22 Arial,Helvetica,sans-serif!important;padding:0.7mm!important}
  .thermal-head{font-weight:600}.thermal-head h2{font-size:15px!important;font-weight:800}.thermal-head h3{font-size:14px!important;border-color:#000!important}
  .thermal-meta{font-size:9.5px!important;color:#000!important}.thermal-sale-items{font-size:9px!important}.thermal-sale-items small{font-size:7.5px!important;color:#000!important}
  .thermal-items th,.thermal-items td{border-bottom-color:#333!important}.thermal-tax-summary,.thermal-balance{border-color:#000!important}
  .thermal-qr img{image-rendering:auto!important}
}

/* v1.3.76: safe 80mm physical printer width + darker thermal rasterization */
.invoice-thermal{width:72mm!important;max-width:72mm!important;box-sizing:border-box!important;overflow:hidden!important}
.thermal-salesperson{font-size:8.5px;font-weight:700;margin-top:1px}
@media print{
  html,body{margin:0!important;padding:0!important;background:#fff!important}
  .invoice-thermal{width:72mm!important;max-width:72mm!important;margin:0 auto!important;padding:.4mm!important;overflow:hidden!important}
  .invoice-thermal,.invoice-thermal *{color:#000!important;background:#fff!important;box-shadow:none!important;filter:none!important;opacity:1!important}
  .thermal-head img{width:29mm!important;max-height:15mm!important}
  .thermal-head h2{font-size:14.5px!important;line-height:1.1!important}
  .thermal-buyer b{font-size:14px!important;font-weight:900!important}
  .thermal-sale-items{font-size:8.6px!important;table-layout:fixed!important}
  .thermal-sale-items th,.thermal-sale-items td{padding:2px .5px!important;border-color:#000!important}
  .thermal-sale-items th:nth-child(1){width:6%!important}.thermal-sale-items th:nth-child(2){width:39%!important}.thermal-sale-items th:nth-child(3){width:17%!important}.thermal-sale-items th:nth-child(4){width:19%!important}.thermal-sale-items th:nth-child(5){width:19%!important}
  .thermal-sale-items td:nth-child(4),.thermal-sale-items td:nth-child(5){font-variant-numeric:tabular-nums!important;white-space:nowrap!important}
  .thermal-tax-summary div,.thermal-balance{font-weight:600!important}
  .thermal-qr img{width:22mm!important;height:22mm!important}
}


/* v1.3.77: 203-dpi thermal clarity pass. Keep geometry in physical mm to avoid browser shrink-to-fit. */
.thermal-app-ref{font-size:8px;font-weight:700;margin-top:1px}
@media print{
  @page{margin:0!important}
  .invoice-thermal{
    width:70mm!important;max-width:70mm!important;margin:0 auto!important;padding:1.2mm 0!important;
    font-family:Arial,Helvetica,sans-serif!important;font-size:10.5px!important;line-height:1.22!important;
    -webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;text-rendering:geometricPrecision!important;
  }
  .thermal-head img{width:28mm!important;max-height:14mm!important}
  .thermal-head h2{font-size:15px!important;font-weight:900!important;letter-spacing:.1px!important}
  .thermal-head h3{font-size:15px!important;font-weight:900!important;border-top:1.4px solid #000!important;border-bottom:1.4px solid #000!important}
  .thermal-meta{font-size:10px!important;font-weight:500!important}
  .thermal-buyer{font-size:12px!important}.thermal-buyer b{font-size:15px!important;font-weight:900!important;line-height:1.12!important}
  .thermal-salesperson{font-size:9px!important}.thermal-app-ref{font-size:8.5px!important}
  .thermal-sale-items{font-size:9px!important}
  .thermal-sale-items th{font-weight:900!important;border-bottom:1.3px solid #000!important}
  .thermal-sale-items td{font-weight:500!important;border-bottom:1px solid #000!important}
  .thermal-sale-items small{font-size:8px!important;font-weight:600!important;color:#000!important}
  .thermal-sale-items tfoot td{border-top:1.4px solid #000!important;border-bottom:1.4px solid #000!important;font-weight:900!important}
  .thermal-tax-summary{border-top:1.4px solid #000!important;font-size:11px!important}
  .thermal-tax-summary>div{padding:1.5px 0!important}.thermal-tax-summary .grand{font-size:13px!important;border-top:1.4px solid #000!important;border-bottom:1.4px solid #000!important}
  .thermal-balance{font-size:10px!important;border-top:1.2px solid #000!important}
  .thermal-qr img{width:24mm!important;height:24mm!important}
}

/* v1.3.79: compact legal/contact header for narrow thermal paper. */
.thermal-company-compact{font-size:8.3px;line-height:1.16;margin:1px 0 2px;text-align:center}
.thermal-company-compact>div{margin:0;padding:0}
.thermal-company-compact span{display:inline}
.thermal-company-compact span+span:before{content:" · ";font-weight:400}
.thermal-company-address{white-space:normal;overflow-wrap:anywhere}
@media print{
  .thermal-company-compact{font-size:8.1px!important;line-height:1.12!important;font-weight:600!important}
  .thermal-company-address{max-width:69mm!important;margin:0 auto!important}
  .thermal-head h2{margin:1px 0!important}
  .thermal-head h3{margin:4px 0 3px!important}
}


/* v1.3.82: plain numeric entry fields — hide browser spinner arrows globally. */
input[type=number] {
  -moz-appearance: textfield;
  appearance: textfield;
}
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.sync-icon-button{border:0;background:transparent;font-size:20px;line-height:1;cursor:pointer;padding:2px 6px;color:inherit}.sync-icon-button.syncing{animation:syncSpin 1s linear infinite}.sync-icon-button:disabled{opacity:.7}@keyframes syncSpin{to{transform:rotate(360deg)}}
/* v1.4.26 notification center */
.notification-bell-wrap{order:3;position:relative;margin-left:auto}.notification-bell-btn{position:relative;border:0;background:transparent;padding:8px;color:#2e3440;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center}.notification-bell-btn:active{background:#f7f2e7}.notification-badge{position:absolute;top:1px;right:0;background:#d71920;color:#fff;border-radius:999px;min-width:18px;height:18px;padding:0 4px;display:grid;place-items:center;font-size:10px;font-weight:800;border:2px solid #fff}.notification-panel{display:none;position:absolute;right:0;top:46px;width:min(360px,calc(100vw - 22px));max-height:min(560px,calc(100dvh - 90px));background:#fff;border:1px solid #eadfca;border-radius:14px;box-shadow:0 16px 40px rgba(0,0,0,.18);z-index:1200;overflow:hidden}.notification-panel.open{display:flex;flex-direction:column}.notification-panel-head,.notification-panel-actions{display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px;border-bottom:1px solid #eee4d5;background:#fff}.notification-panel-list{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.notification-panel-actions{border-bottom:0;border-top:1px solid #eee4d5}.notification-panel a,.notification-panel-actions button{color:#c91f1f;background:none;border:0;font-weight:700;text-decoration:none;cursor:pointer}.notification-mini{margin:0}.notification-mini button{width:100%;border:0;border-bottom:1px solid #f0eadf;background:#fff;padding:11px 14px;text-align:left;cursor:pointer}.notification-mini.unread button{background:#fff8e8}.notification-mini b,.notification-mini span,.notification-mini small{display:block}.notification-mini span{font-size:13px;margin-top:3px;color:#4d5562}.notification-mini small{font-size:11px;margin-top:5px;color:#7b8491}.notification-empty{padding:22px;text-align:center;color:#7b8491}.notif-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.notif-list{display:grid;gap:9px}.notif-row{display:grid;grid-template-columns:10px 1fr auto;gap:10px;align-items:start;padding:14px;border:1px solid #eadfca;border-radius:14px;background:#fff}.notif-row.unread{background:#fff9e9}.notif-dot{width:9px;height:9px;border-radius:50%;background:#d71920;margin-top:6px}.notif-row:not(.unread) .notif-dot{background:#d6d6d6}.communication-grid{display:grid;grid-template-columns:minmax(260px,360px) 1fr;gap:18px}.message-stream{display:grid;gap:8px}.message-row{border:1px solid #eadfca;border-radius:12px;padding:11px 13px;background:#fff}.message-meta{font-size:12px;color:#747c88;margin-bottom:5px}@media(max-width:760px){.notification-bell-wrap{margin-left:0}.notification-panel{position:fixed;top:70px;right:8px;left:8px;width:auto;max-height:min(70dvh,560px)}.communication-grid{grid-template-columns:1fr}.majedar-live-time{order:4}.notification-bell-wrap{order:3}}

/* v1.4.30 mobile-first navigation, settings and workflow polish */
.drawer-group{margin:2px 8px;border-radius:12px;overflow:hidden}.drawer-group>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:10px 12px;font-weight:800;color:#4d5562}.drawer-group>summary::-webkit-details-marker{display:none}.drawer-group[open]>summary{background:#fff7e8;color:#b6161b}.drawer-chevron{font-size:22px;line-height:1;transition:transform .18s ease}.drawer-group[open] .drawer-chevron{transform:rotate(90deg)}.drawer-group-body{padding:0 0 5px}.drawer-group-body .drawer-item{padding-left:18px}
.responsive-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px}.responsive-head h2{margin-bottom:4px}.page-actions,.inline-actions{display:flex;gap:8px;flex-wrap:wrap}.compact-filter{display:grid;grid-template-columns:minmax(150px,1fr) minmax(150px,1fr) auto;gap:10px;align-items:end;margin:10px 0 16px;padding:12px 14px}.compact-filter label{margin:0}.compact-filter .btn{min-height:46px}.num{text-align:right;white-space:nowrap}.report-table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid #e7dfcf;border-radius:12px;overflow:hidden}.report-table th{background:#f8f3e8;color:#242b35;font-weight:800;padding:11px 12px;border-bottom:1px solid #e7dfcf;text-align:left}.report-table td{padding:12px;border-bottom:1px solid #eee8dd;vertical-align:top}.report-table tr:last-child td{border-bottom:0}.expense-table .status-pill{display:inline-flex;align-items:center;border-radius:999px;padding:4px 8px;font-size:11px;font-weight:900;letter-spacing:.03em;background:#eef1f4;color:#4d5562}.expense-table .status-approved{background:#eaf7ee;color:#176b35}.expense-table .status-pending{background:#fff4d8;color:#8b5b00}.expense-table .status-rejected{background:#fdeaea;color:#a51d24}.expense-action{display:grid;gap:8px;min-width:220px}.expense-action input{margin:0}.empty-row td{text-align:center;color:#7b8491;padding:24px!important}
.settings-hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:12px 0 18px}.settings-hub-card{display:flex;flex-direction:column;gap:5px;text-decoration:none;border:1px solid #e6ddcf;background:#fff;border-radius:14px;padding:15px 16px;box-shadow:0 3px 12px rgba(40,32,18,.05);color:#202630;min-height:88px}.settings-hub-card b{font-size:16px}.settings-hub-card span{color:#6c7480;font-size:13px;line-height:1.35}.settings-hub-card:active{transform:translateY(1px)}.settings-form>.settings-section-title{scroll-margin-top:92px;border-top:1px solid #eee3d3;padding-top:22px;margin-top:24px}.settings-form>.settings-section-title:first-of-type{border-top:0;margin-top:0}.settings-back-top{display:inline-block;margin-top:18px;color:#b6161b;text-decoration:none;font-size:12px;font-weight:800}
.entry-next-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:14px 0;padding:12px;border:1px solid #eadfca;border-radius:14px;background:#fffaf0}.entry-next-actions .entry-next-label{font-size:12px;font-weight:800;color:#667085;margin-right:auto}.entry-next-actions .btn{min-height:44px}.doc-toolbar.entry-doc-toolbar{position:sticky;top:70px;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);padding:8px;border:1px solid #eadfca;border-radius:12px;box-shadow:0 5px 18px rgba(0,0,0,.07)}
@media(max-width:760px){
  .content.with-nav{padding-left:12px!important;padding-right:12px!important;padding-bottom:84px!important}.responsive-head{flex-direction:column;align-items:stretch}.page-actions{display:grid;grid-template-columns:1fr 1fr}.page-actions .btn{text-align:center;min-height:46px;display:flex;align-items:center;justify-content:center}.compact-filter{grid-template-columns:1fr 1fr;padding:10px}.compact-filter .btn{grid-column:1/-1;width:100%}
  .mobile-table{border:0;background:transparent}.mobile-table thead{display:none}.mobile-table tbody{display:grid;gap:10px}.mobile-table tr{display:grid;background:#fff;border:1px solid #e7dfcf;border-radius:14px;padding:6px 12px;box-shadow:0 3px 10px rgba(40,32,18,.04)}.mobile-table td{display:grid;grid-template-columns:minmax(90px,35%) 1fr;gap:8px;border-bottom:1px solid #f0eadf;padding:9px 0;text-align:left!important;white-space:normal!important}.mobile-table td:last-child{border-bottom:0}.mobile-table td:before{content:attr(data-label);font-size:11px;text-transform:uppercase;letter-spacing:.04em;font-weight:800;color:#7b8491}.mobile-table .empty-row{display:block}.mobile-table .empty-row td{display:block;text-align:center!important}.mobile-table .empty-row td:before{display:none}.expense-action{min-width:0}.inline-actions{display:grid;grid-template-columns:1fr 1fr}.inline-actions .btn{width:100%}
  .settings-hub{grid-template-columns:1fr 1fr;gap:9px}.settings-hub-card{padding:12px;min-height:96px}.settings-hub-card b{font-size:14px}.settings-hub-card span{font-size:11px}.settings-form.card{padding:12px}.settings-section-title{font-size:19px}.settings-back-top{margin-top:14px}
  .entry-next-actions{position:sticky;bottom:68px;z-index:45;display:grid;grid-template-columns:1fr 1fr;padding:9px;box-shadow:0 -5px 18px rgba(0,0,0,.08)}.entry-next-actions .entry-next-label{grid-column:1/-1;margin:0}.entry-next-actions .btn{text-align:center;display:flex;justify-content:center;align-items:center}.doc-toolbar.entry-doc-toolbar{top:62px;display:grid;grid-template-columns:repeat(2,1fr)}.doc-toolbar.entry-doc-toolbar .btn{width:100%;text-align:center}
}
@media(max-width:420px){.settings-hub{grid-template-columns:1fr}.page-actions{grid-template-columns:1fr}.compact-filter{grid-template-columns:1fr}.compact-filter .btn{grid-column:auto}.mobile-table td{grid-template-columns:82px 1fr}.entry-next-actions{grid-template-columns:1fr 1fr}}
@media print{.entry-next-actions,.settings-back-top{display:none!important}}

/* v1.4.31: true card-to-group Settings navigation (mobile-first) */
.settings-group-panel.is-hidden{display:none!important}.settings-group-panel.is-active{display:block}.settings-group-form{margin-top:10px}.settings-group-panel>.settings-section-title:first-child{border-top:0;margin-top:0;padding-top:0}.settings-group-panel .settings-back-top{display:none}.settings-page-actions{position:sticky;bottom:0;z-index:8;display:flex;gap:9px;flex-wrap:wrap;margin:18px -4px -4px;padding:10px 4px 4px;background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 24%)}
@media(max-width:760px){.settings-group-form{padding:12px}.settings-page-actions{display:grid;grid-template-columns:1fr 1fr}.settings-page-actions .btn{width:100%;justify-content:center}.settings-hub-card{min-height:84px}}
@media(max-width:420px){.settings-page-actions{grid-template-columns:1fr}.settings-hub{grid-template-columns:1fr}}

/* v1.4.33 fast document-output UX */
.print-choice-dialog{border:0;border-radius:16px;padding:18px;max-width:380px;width:calc(100% - 32px);box-shadow:0 18px 55px rgba(0,0,0,.25)}.print-choice-dialog::backdrop{background:rgba(0,0,0,.38)}.print-choice-dialog h3{margin:0 0 6px}.print-choice-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.print-choice-actions .btn:last-child{grid-column:1/-1}.entry-output-actions .btn{min-width:110px}@media(max-width:600px){.entry-output-actions{display:grid!important;grid-template-columns:1fr 1fr}.entry-output-actions .btn{width:100%;min-width:0}.print-choice-actions{grid-template-columns:1fr}}

/* v1.4.97 — Debit Memo: QR beside Customer Signature (Amount Written removed) + item name enlarged */
.thermal-qr-sign{display:flex;align-items:flex-end;gap:6px;margin-top:7px}
.thermal-qr-sign .thermal-qr{margin-top:0;flex:0 0 auto}
.thermal-qr-sign .tqs-sign{flex:1;text-align:center;min-width:0}
.thermal-qr-sign .tqs-sign-line{border-bottom:1px solid #111;height:20mm}
.thermal-qr-sign .tqs-sign span{display:block;padding-top:3px;font-size:9px;font-weight:600}
.thermal-sale-items td:nth-child(2){font-size:10.5px;font-weight:600}
.thermal-sale-items td:nth-child(2) small{font-size:7.5px;font-weight:500}
@media print{
  .thermal-qr-sign{display:flex!important;align-items:flex-end!important;gap:5px!important;margin-top:6px!important}
  .thermal-qr-sign .thermal-qr{margin-top:0!important;flex:0 0 auto!important}
  .thermal-qr-sign .tqs-sign{flex:1!important;text-align:center!important;min-width:0!important}
  .thermal-qr-sign .tqs-sign-line{border-bottom:1.2px solid #000!important;height:20mm!important}
  .thermal-qr-sign .tqs-sign span{font-size:9.5px!important;font-weight:700!important;padding-top:3px!important;color:#000!important}
  .thermal-sale-items td:nth-child(2){font-size:11px!important;font-weight:700!important}
  .thermal-sale-items td:nth-child(2) small{font-size:8px!important;font-weight:600!important;color:#000!important}
}

/* v1.4.99 — Thermal Debit/Cash Memo: Date pushed to right + compact tax summary + crisper thermal weights */
.thermal-doc-row{display:flex;justify-content:space-between;align-items:baseline;gap:6px;padding:1px 0}
.thermal-doc-row span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Compact tax summary: labels + amounts reduced. Grand Total STAYS bold + prominent. */
.thermal-tax-summary>div:not(.grand){font-size:9.5px;font-weight:600;padding:0 0}
@media print{
  .thermal-doc-row{display:flex!important;justify-content:space-between!important;align-items:baseline!important;gap:6px!important;padding:1px 0!important}
  .thermal-doc-row span{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;color:#000!important}
  /* Non-grand tax rows: compact + weight 700 for crisp thermal print (was 900, which can bleed on 203dpi) */
  .thermal-tax-summary>div:not(.grand){font-size:9px!important;font-weight:700!important;padding:0.5px 0!important}
  .thermal-tax-summary>div:not(.grand) span,.thermal-tax-summary>div:not(.grand) b{font-weight:700!important}
  /* Grand Total keeps its emphasis */
  .thermal-tax-summary .grand{font-size:13px!important;font-weight:900!important;padding:3px 0!important;border-top:1.4px solid #000!important;border-bottom:1.4px solid #000!important}
}

/* v1.4.100 — Thermal print WEIGHT NORMALIZATION.
   Reference: reference-software print (image 2) uses normal weight throughout;
   our stack had layers of font-weight:900 !important (from v1.3.75/76/77) which
   smears on 203-dpi thermal + cheap thermal paper. Reset to a clean hierarchy:
     - Base body:       500  (was 900, cause of blocky look)
     - Section headers: 700  (Company, TAX INVOICE)
     - Buyer name:      700
     - Item name col:   600
     - Item table cells:500
     - Grand Total:     900  (KEEPS its emphasis for hierarchy)
   Also adds real breathing room between Sl-No column and Item Description
   column so "1Kasturi" no longer looks conjoined. */
@media print{
  .invoice-thermal{font-weight:500!important}
  .thermal-head h2{font-weight:700!important;letter-spacing:.02px!important}
  .thermal-head h3{font-weight:700!important;letter-spacing:.05px!important}
  .thermal-company-compact,.thermal-company-compact *{font-weight:500!important}
  .thermal-meta,.thermal-doc-row,.thermal-app-ref,.thermal-salesperson{font-weight:500!important}
  .thermal-meta b,.thermal-doc-row b{font-weight:600!important}
  .thermal-buyer{font-weight:500!important}
  .thermal-buyer b{font-weight:700!important}
  .thermal-buyer span{font-weight:600!important}
  .thermal-sale-items th{font-weight:700!important}
  .thermal-sale-items td{font-weight:500!important}
  .thermal-sale-items td:nth-child(2){font-weight:600!important}
  .thermal-sale-items td:nth-child(2) small{font-weight:500!important}
  .thermal-sale-items tfoot td{font-weight:700!important}
  .thermal-balance,.thermal-balance *{font-weight:500!important}
  /* Grand Total keeps its visual anchor */
  .thermal-tax-summary .grand,.thermal-tax-summary .grand *{font-weight:900!important}
  /* Item Sl-No column: real breathing room from Item Description */
  .thermal-sale-items th:nth-child(1),.thermal-sale-items td:nth-child(1){padding-right:1.6mm!important;text-align:right!important}
  .thermal-sale-items th:nth-child(2),.thermal-sale-items td:nth-child(2){padding-left:1mm!important}
}
/* Screen preview aligned with print — so what you see = what you print */
.thermal-sale-items td:nth-child(2){font-weight:600}
.thermal-sale-items td{font-weight:500}

/* v1.4.117 — Windows browser / Epson-class 203-dpi thermal clarity.
   This final print-only profile deliberately overrides the older cumulative
   thermal rules. Keep dimensions in physical millimetres, avoid fractional
   CSS-pixel borders, and use only normal/bold faces so Chrome does not create
   weak synthetic intermediate weights before the Windows driver rasterises. */
@media print{
  /* v1.4.156: scope the 80mm thermal page contract to actual sales thermal documents.
     The previous global html/body 80mm rule leaked into Outstanding and other
     reports, causing A4 print/share pages to become a tiny left column. */
  @page thermal-receipt{size:80mm auto!important;margin:0!important}
  body:has(.invoice-thermal.thermal-browser-203){
    width:80mm!important;max-width:80mm!important;min-width:80mm!important;
    margin:0!important;padding:0!important;overflow:visible!important;
    background:#fff!important;
  }
  .invoice-thermal.thermal-browser-203{
    page:thermal-receipt;
    display:block!important;box-sizing:border-box!important;
    width:72mm!important;max-width:72mm!important;min-width:72mm!important;
    margin:0 4mm!important;padding:1mm 0!important;
    transform:none!important;zoom:1!important;overflow:visible!important;
    font-family:"Arial Narrow",Arial,Helvetica,sans-serif!important;
    font-size:11px!important;line-height:1.2!important;font-weight:400!important;
    color:#000!important;background:#fff!important;
    -webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;
    text-rendering:optimizeLegibility!important;
  }
  .thermal-browser-203,.thermal-browser-203 *{
    color:#000!important;background-color:#fff!important;
    box-shadow:none!important;text-shadow:none!important;filter:none!important;
    opacity:1!important;transform:none!important;
  }
  .thermal-browser-203 .thermal-head h2,
  .thermal-browser-203 .thermal-head h3,
  .thermal-browser-203 .thermal-buyer b,
  .thermal-browser-203 .thermal-sale-items th,
  .thermal-browser-203 .thermal-sale-items tfoot td,
  .thermal-browser-203 .thermal-tax-summary .grand,
  .thermal-browser-203 .thermal-tax-summary .grand *{font-weight:700!important}
  .thermal-browser-203 .thermal-company-compact,
  .thermal-browser-203 .thermal-company-compact *,
  .thermal-browser-203 .thermal-meta,
  .thermal-browser-203 .thermal-meta *,
  .thermal-browser-203 .thermal-sale-items td,
  .thermal-browser-203 .thermal-sale-items td *,
  .thermal-browser-203 .thermal-tax-summary>div:not(.grand),
  .thermal-browser-203 .thermal-tax-summary>div:not(.grand) *,
  .thermal-browser-203 .thermal-balance,
  .thermal-browser-203 .thermal-balance *{font-weight:400!important}
  .thermal-browser-203 .thermal-head h2{font-size:16px!important;line-height:1.1!important}
  .thermal-browser-203 .thermal-head h3{font-size:15px!important;line-height:1.12!important}
  .thermal-browser-203 .thermal-company-compact{font-size:9px!important;line-height:1.16!important}
  .thermal-browser-203 .thermal-meta{font-size:10.5px!important;line-height:1.2!important}
  .thermal-browser-203 .thermal-buyer b{font-size:15px!important}
  .thermal-browser-203 .thermal-sale-items{font-size:10px!important;line-height:1.18!important}
  .thermal-browser-203 .thermal-sale-items td:nth-child(2){font-size:11px!important;font-weight:700!important}
  .thermal-browser-203 .thermal-sale-items small{font-size:8.5px!important;font-weight:400!important}
  .thermal-browser-203 .thermal-tax-summary>div:not(.grand){font-size:10px!important}
  .thermal-browser-203 .thermal-tax-summary .grand{font-size:14px!important}
  .thermal-browser-203 .thermal-balance{font-size:10.5px!important}
  .thermal-browser-203 .thermal-head h3,
  .thermal-browser-203 .thermal-sale-items th,
  .thermal-browser-203 .thermal-sale-items td,
  .thermal-browser-203 .thermal-sale-items tfoot td,
  .thermal-browser-203 .thermal-tax-summary,
  .thermal-browser-203 .thermal-tax-summary .grand,
  .thermal-browser-203 .thermal-balance{border-color:#000!important}
  .thermal-browser-203 .thermal-head h3{border-top-width:.25mm!important;border-bottom-width:.25mm!important}
  .thermal-browser-203 .thermal-sale-items th,
  .thermal-browser-203 .thermal-sale-items td{border-bottom-width:.25mm!important}
  .thermal-browser-203 .thermal-sale-items tfoot td,
  .thermal-browser-203 .thermal-tax-summary,
  .thermal-browser-203 .thermal-tax-summary .grand,
  .thermal-browser-203 .thermal-balance{border-width:.25mm!important}
  .thermal-browser-203 .thermal-qr img{
    width:28.125mm!important;height:28.125mm!important;
    object-fit:contain!important;image-rendering:pixelated!important;
  }
}

/* v1.4.122 — Epson/Windows browser two-edge safe calibration.
   Physical tests established that 2 mm is required at the left edge while
   the right edge must remain at v1.4.120's safe 71-mm coordinate. Therefore
   reduce content to 69 mm: 2-mm left + 69-mm content + 9-mm right = 80 mm. */
@media print{
  .invoice-thermal.thermal-browser-203{
    width:69mm!important;max-width:69mm!important;min-width:69mm!important;
    margin:0 9mm 0 2mm!important;
  }
}

/* ============================================================
   v1.4.104 — Mobile UI polish (screenshots + video 2026-09-03)
   Fixes the following symptoms reported on Android portrait (360-380
   CSS-px viewport):
   1. Whole page scrolls sideways on New Sale / New Receipt / Stock /
      Cash Handover pages, hiding the leftmost characters of labels.
      Root cause: top-bar RHS elements + wide items tables exceed the
      viewport, and nothing globally suppressed body horizontal overflow.
   2. "Print / Save PDF" action panel on the invoice / sales-document
      pages floated OVER the side drawer when the drawer was opened
      (z-index:50 was ABOVE drawer z-index:40) and its sticky `top`
      value did not match the actual header height (visible gap-then-
      overlap between the two).
   3. "+ Next Sale" button was orphaned in the last row of the 2-column
      action-panel grid (5 buttons → 2+2+1 half-width).
   4. Top-bar date/time wrapped as "03 Sept 2026 ·" / "22:41 IST" with a
      dangling middle-dot at the end of line 1.
   5. Logged-in username was rendered but effectively invisible — the
      three RHS elements (bell + user + time) fought for the same
      `order:3` slot; time's `min-width` won and user got squeezed to 0.
   6. Bottom-nav (fixed) covered the last radio row on the New Sale /
      New Receipt forms; content padding-bottom didn't account for the
      nav + safe-area on notched phones.
   7. Bell icon was oversized vs the menu/refresh icons around it.
   Approach: purely additive CSS + one small template restructure of the
   top-bar RHS. No changes to business logic, forms, or Tally XML.
   ============================================================ */

/* 1. Kill whole-page horizontal scroll on mobile. Wide tables scroll
      internally via .tbl-scroll / .items-tbl rules below. */
html, body { overflow-x: hidden; max-width: 100vw; }

/* 2. Combined username + live-clock block in top-bar RHS.
      Replaces the old side-by-side layout that let time push user out. */
.majedar-right-meta{
  order:3; margin-left:0;
  display:flex; flex-direction:column; align-items:flex-end;
  gap:1px; min-width:0; max-width:150px; line-height:1.15;
}
.majedar-right-meta .majedar-user-line{
  font-size:12px; font-weight:800; color:#2f3440; letter-spacing:.1px;
  max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.majedar-right-meta .majedar-live-time{
  /* Override legacy standalone .majedar-live-time widths so it flows inside meta block. */
  order:0 !important;
  min-width:0 !important; max-width:100% !important;
  font-size:11px; font-weight:600; color:#665f53;
  white-space:nowrap; text-align:right; line-height:1.15;
}
@media(max-width:480px){
  .majedar-right-meta{ max-width:118px; }
  .majedar-right-meta .majedar-user-line{ font-size:11px; }
  .majedar-right-meta .majedar-live-time{ font-size:10.5px; }
}

/* 3. Compact icon buttons on very narrow viewports so top-bar fits without
      overflow. Bell was visually oversized vs menu/refresh. */
@media(max-width:480px){
  .brand-icon-btn{ padding:5px !important; }
  .brand-icon-btn svg{ width:24px !important; height:24px !important; }
  .notification-bell-btn{ padding:5px !important; }
  .notification-bell-btn svg{ width:22px !important; height:22px !important; }
  .majedar-nav{ gap:4px !important; padding-left:6px !important; padding-right:6px !important; }
  .majedar-app-logo{ width:74px !important; height:38px !important; }
}

/* 4. Sticky print/action toolbar on voucher_detail + sales_document +
      sales_order_document + tally_document + receipt_document.
      (a) z-index dropped so drawer sits above it.
      (b) `top` matches the real header height (red strip 7 + yellow border
          3 + nav min-height 72 desktop / 66 mobile = 82 / 76 px).
      (c) Trailing odd button ("+ Next Sale" when it lands alone in the last
          row of the 2-column grid) stretches to full width. */
.doc-toolbar.entry-doc-toolbar{ z-index:15; top:82px; }
@media(max-width:760px){ .doc-toolbar.entry-doc-toolbar{ top:76px; } }
@media(max-width:600px){
  .doc-toolbar.entry-doc-toolbar .btn:nth-child(odd):last-child{ grid-column:1 / -1; }
}

/* v1.4.115: keep the on-screen Receipt preview inside the phone viewport.
   Print remains the full A4 layout because these rules are screen-only. */
@media screen and (max-width:700px){
  .receipt-a4.receipt-document-view{width:100%;max-width:100%;min-width:0;min-height:0;padding:14px 10px;font-size:12px;overflow:hidden;border-radius:12px}
  .receipt-document-view .receipt-a4-head{flex-direction:column;align-items:center;gap:8px;overflow-wrap:anywhere}
  .receipt-document-view .receipt-a4-head img{width:105px;max-height:64px}
  .receipt-document-view .receipt-a4-head h1{font-size:17px}
  .receipt-document-view .receipt-title{margin:24px 0 18px}
  .receipt-document-view .receipt-meta{gap:10px;flex-wrap:wrap;margin-bottom:12px}
  .receipt-document-view .receipt-a4-table{min-height:360px;table-layout:fixed}
  .receipt-document-view .receipt-a4-table th:first-child{width:70%}
  .receipt-document-view .receipt-a4-table td{padding:8px 5px;overflow-wrap:anywhere}
  .receipt-document-view .receipt-account,.receipt-document-view .receipt-ref{margin-left:0}
  .receipt-document-view .receipt-payment-details{overflow-wrap:anywhere}
  .receipt-document-view .receipt-sign{margin-top:50px}
}
.entry-next-actions{ z-index:15; }
@media(max-width:760px){
  .entry-next-actions{ bottom:calc(68px + env(safe-area-inset-bottom)); }
}

/* 5. Drawer must sit above sticky action toolbars. Belt-and-braces after (4). */
.drawer{ z-index:60; }
.drawer-overlay{ z-index:55; }

/* 6. Bottom-fixed nav — reserve space for it PLUS notched safe-area. Also
      give long forms (receipt_new, voucher_new) enough breathing room so the
      final radio row / narration textarea isn't hidden under the nav. */
body.has-nav{ padding-bottom:calc(64px + env(safe-area-inset-bottom)); }
@media(max-width:760px){
  .content.with-nav{ padding-bottom:calc(96px + env(safe-area-inset-bottom)) !important; }
}

/* 7. Horizontal-scroll wrapper for wide items tables. Any <table
      class="items-tbl"> that's wrapped in .tbl-scroll now scrolls
      internally instead of pushing the whole page wider. */
.tbl-scroll{
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  margin:8px 0; max-width:100%;
}
.tbl-scroll > .tbl, .tbl-scroll > .items-tbl{ margin:0; min-width:460px; }
.items-tbl{ max-width:100%; }
@media(max-width:560px){
  .itemcell{ min-width:160px; }   /* was 200px — safer for 360px viewport */
}
/* End v1.4.104 */

/* ============================================================
   v1.4.107 — Cash Memo / Debit Memo pill badge
   One consistent visual for every place that shows a sale row
   (voucher list, voucher detail, sales register report). The
   classification comes from the sale_memo_kind() Jinja global
   registered in app/__init__.py, which mirrors the rule the print
   template already uses — so on-screen badges and printed memo
   labels can never disagree.
   ============================================================ */
.memo-pill{
  display:inline-block; padding:1px 8px; border-radius:9px;
  font-size:10px; font-weight:800; letter-spacing:.5px;
  text-transform:uppercase; line-height:1.4;
  vertical-align:middle; white-space:nowrap;
  margin-left:6px;
}
.memo-pill.cash  { background:#e6f4ea; color:#137333; border:1px solid #b7dfc6; }   /* green */
.memo-pill.credit{ background:#fef4e5; color:#a05a00; border:1px solid #f5d29a; }   /* amber */
@media print{
  .memo-pill{ background:transparent !important; color:#000 !important; border:1px solid #000 !important; }
}
/* End v1.4.107 */

/* ============================================================
   v1.4.124 — Stage 1 My Work dates + mobile overflow cleanup.
   History date filters are view-only. Back/future-date entry
   permissions remain create/edit-only and no transaction dates are changed.
   ============================================================ */
.date-filter{
  display:grid; grid-template-columns:minmax(132px,1fr) minmax(132px,1fr) auto auto;
  gap:10px; align-items:end; margin:10px 0 14px; padding:12px;
}
.date-filter label{margin:0}.date-filter input[type=date]{min-height:42px}.date-filter-note{grid-column:1/-1}
.report-table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.report-table-wrap>.report-table{min-width:720px}.report-table-wrap>.modern-audit-table{min-width:760px}
@media(max-width:760px){
  .date-filter{grid-template-columns:1fr 1fr}.date-filter .btn{width:100%;text-align:center}.date-filter-note{grid-column:1/-1}
  .pay-toggle{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;overflow:visible}
  .pay-opt{min-width:0;justify-content:flex-start;line-height:1.25;overflow-wrap:anywhere;white-space:normal;padding:10px 9px}
  #paidNowWrap{overflow:visible!important}.grid2{grid-template-columns:1fr}.actions{padding-bottom:10px}
  .notification-panel{position:fixed!important;top:calc(78px + env(safe-area-inset-top))!important;left:8px!important;right:8px!important;width:auto!important;max-height:calc(100dvh - 110px)!important}
}
@media(max-width:380px){
  .pay-toggle{grid-template-columns:1fr 1fr}.pay-opt{font-size:12.5px;padding:9px 7px}.date-filter{grid-template-columns:1fr}
}
/* End v1.4.124 */

/* v1.4.128: non-blocking PDF/share messages + robust document action toolbar */
.app-toast-box{position:fixed;left:12px;right:12px;bottom:84px;z-index:120;display:grid;gap:8px;pointer-events:none}
.app-toast{margin:0 auto;max-width:620px;background:#1f2937;color:#fff;padding:12px 14px;border-radius:12px;box-shadow:0 10px 28px rgba(0,0,0,.24);font-weight:700;font-size:14px;line-height:1.35}
.app-toast.danger{background:#7f1d1d}.app-toast.hide{opacity:0;transform:translateY(8px);transition:.22s ease}
.doc-toolbar.entry-doc-toolbar{align-items:center}
@media(max-width:700px){.doc-toolbar.entry-doc-toolbar{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.doc-toolbar.entry-doc-toolbar .btn{min-width:0;white-space:normal;line-height:1.2;padding-left:8px;padding-right:8px}}


/* v1.4.132 - Tally-style A4 Sales Invoice used by web print/PDF/share and Native PDF share. Thermal CSS is untouched. */
/* v1.4.133: fixed A4 invoice sheet sizing. Server PDF/share and browser print
   use this single full-width A4 contract; thermal rules remain separate. */
.a4-tally-invoice{width:196mm;max-width:196mm;min-width:196mm;box-sizing:border-box;border:1px solid #111;font:9.4pt/1.12 Arial,sans-serif;color:#000;background:#fff;margin:0 auto;overflow:hidden}
.a4-tally-invoice table{width:100%;border-collapse:collapse;table-layout:fixed}
.a4-tally-invoice td,.a4-tally-invoice th{border:1px solid #111;vertical-align:top;padding:1.05mm 1.25mm;box-sizing:border-box;overflow-wrap:break-word;word-break:normal}
.a4t-head td{border-bottom:1px solid #111}.a4t-logo-cell{width:33mm;text-align:center;border-right:0!important}.a4t-logo-cell img{width:28mm;max-height:19mm;object-fit:contain}.a4t-company-cell{border-left:0!important;text-align:center}.a4t-company-cell h1{font-size:17pt;line-height:1;margin:0 0 1mm;font-weight:800}.a4t-company-cell div{line-height:1.13}.a4t-title td{text-align:center;padding:.7mm 1.2mm}.a4t-title tr:first-child td{text-align:left}.a4t-title b{font-size:13pt}.a4t-party,.a4t-meta{height:29mm}.a4t-party{width:50%}.a4t-party b{font-size:9.5pt}.a4t-party div,.a4t-meta div{margin:.8mm 0}.a4t-party div span,.a4t-meta div span{display:inline-block;width:24mm}.a4t-party-spacer{height:10mm}.a4t-meta hr{border:0;border-top:1px solid #111;margin:2mm -1.25mm 1.2mm}.a4t-items{page-break-inside:avoid}.a4t-items th{text-align:center;font-weight:800;white-space:normal}.a4t-items th:nth-child(1){width:5%}.a4t-items th:nth-child(2){width:30%}.a4t-items th:nth-child(3){width:11%}.a4t-items th:nth-child(4){width:12%}.a4t-items th:nth-child(5){width:9%}.a4t-items th:nth-child(6){width:9%}.a4t-items th:nth-child(7){width:6%}.a4t-items th:nth-child(8){width:8%}.a4t-items th:nth-child(9){width:10%}.a4t-items tbody tr:not(.a4t-fill):not(.a4t-subtotal) td{height:7.2mm}.a4t-items td:nth-child(1),.a4t-items td:nth-child(3),.a4t-items td:nth-child(4),.a4t-items td:nth-child(5),.a4t-items td:nth-child(6),.a4t-items td:nth-child(7),.a4t-items td:nth-child(8){text-align:center}.a4t-items td:last-child{text-align:right}.a4t-fill td{height:56mm;border-top:0;border-bottom:0}.a4t-subtotal td{text-align:center;font-weight:600}.a4t-totals{page-break-inside:avoid}.a4t-totals td{height:auto}.a4t-balance{width:48%}.a4t-balance div{display:grid;grid-template-columns:34mm 1fr;margin:1mm 0}.a4t-tax-lines div{display:flex;justify-content:space-between;margin:.4mm 0}.a4t-grand{border-top:1px solid #111;padding-top:.8mm;font-weight:800}.a4t-hsn{page-break-inside:avoid}.a4t-hsn th,.a4t-hsn td{text-align:center}.a4t-hsn th{font-weight:800}.a4t-tax-words{border-left:1px solid #111;border-right:1px solid #111;border-bottom:1px solid #111;padding:1mm 1.25mm;page-break-inside:avoid}.a4t-footer{display:grid;grid-template-columns:1fr 32mm 50mm;min-height:36mm;border-left:1px solid #111;border-right:1px solid #111;border-bottom:1px solid #111;padding:1.3mm;gap:3mm;box-sizing:border-box;page-break-inside:avoid}.a4t-footer>div{align-self:start}.a4t-bank div{margin:.6mm 0}.a4t-terms{margin-top:3mm}.a4t-qr{text-align:center}.a4t-qr .payment-qr{width:26mm;height:26mm;object-fit:contain}.a4t-sign{text-align:center;padding-top:2mm}.a4t-sign .signature-img{max-width:24mm;max-height:17mm;margin:1.2mm auto}
@media(max-width:700px){.a4-tally-invoice{min-width:196mm}}
@media print{html,body{width:210mm!important;background:#fff!important}.content,main{width:100%!important;max-width:none!important;padding:0!important;margin:0!important}.a4-tally-invoice{width:196mm!important;min-width:196mm!important;max-width:196mm!important;margin:0 auto!important;break-inside:avoid;page-break-inside:avoid}.a4t-fill td{height:54mm!important}.a4t-footer{min-height:35mm!important}}


/* v1.4.134: stable full-width A4 Sales Invoice tables for browser preview and PDF render.
   This fixes wkhtml/weasy/browser differences where the Tally-style invoice tables
   shrink to content width and produce a narrow strip on the left. */
.a4-tally-invoice{box-sizing:border-box;width:100%;max-width:196mm;margin:0 auto;border:1px solid #111;background:#fff;color:#000;font:9pt/1.18 Arial,sans-serif;overflow:visible}
.a4-tally-invoice table{width:100%;max-width:100%;border-collapse:collapse;border-spacing:0;table-layout:fixed}
.a4-tally-invoice td,.a4-tally-invoice th{box-sizing:border-box;border:1px solid #111;padding:1.1mm 1.3mm;vertical-align:top;overflow-wrap:break-word;word-break:normal}
.a4t-head,.a4t-title,.a4t-party-meta,.a4t-items,.a4t-totals,.a4t-hsn{width:100%!important;max-width:100%!important}
.a4t-head td{border-bottom:1px solid #111}.a4t-logo-cell{width:36mm!important;text-align:center;border-right:0!important}.a4t-logo-cell img{width:30mm;max-height:18mm;object-fit:contain}.a4t-company-cell{border-left:0!important;text-align:center}.a4t-company-cell h1{font-size:18pt;line-height:1.05;margin:0 0 1mm;font-weight:800;white-space:nowrap}.a4t-company-cell div{line-height:1.14;font-size:8.5pt}
.a4t-title td{text-align:center;padding:.9mm 1.2mm}.a4t-title tr:first-child td{text-align:left;font-size:8.5pt}.a4t-title b{font-size:13pt}
.a4t-party,.a4t-meta{height:28mm!important}.a4t-party{width:50%!important}.a4t-party b{font-size:9.5pt}.a4t-party div,.a4t-meta div{margin:.7mm 0}.a4t-party div span,.a4t-meta div span{display:inline-block;width:25mm}.a4t-party-spacer{height:8mm}.a4t-meta hr{border:0;border-top:1px solid #111;margin:1.8mm -1.3mm 1mm}
.a4t-items{page-break-inside:avoid}.a4t-items th{text-align:center;font-weight:800;white-space:normal;font-size:8.5pt}.a4t-items td{font-size:8.5pt}.a4t-items th:nth-child(1){width:5%}.a4t-items th:nth-child(2){width:29%}.a4t-items th:nth-child(3){width:11%}.a4t-items th:nth-child(4){width:12%}.a4t-items th:nth-child(5){width:9%}.a4t-items th:nth-child(6){width:9%}.a4t-items th:nth-child(7){width:6%}.a4t-items th:nth-child(8){width:8%}.a4t-items th:nth-child(9){width:11%}.a4t-items tbody tr:not(.a4t-fill):not(.a4t-subtotal) td{height:7mm}.a4t-items td:nth-child(1),.a4t-items td:nth-child(3),.a4t-items td:nth-child(4),.a4t-items td:nth-child(5),.a4t-items td:nth-child(6),.a4t-items td:nth-child(7),.a4t-items td:nth-child(8){text-align:center}.a4t-items td:last-child{text-align:right}.a4t-fill td{height:48mm;border-top:0;border-bottom:0}.a4t-subtotal td{text-align:center;font-weight:600}
.a4t-totals,.a4t-hsn,.a4t-tax-words,.a4t-footer{page-break-inside:avoid;break-inside:avoid}.a4t-balance{width:48%!important}.a4t-balance div{display:grid;grid-template-columns:35mm 1fr;margin:.8mm 0}.a4t-tax-lines div{display:flex;justify-content:space-between;margin:.35mm 0}.a4t-grand{border-top:1px solid #111;padding-top:.7mm;font-weight:800}.a4t-hsn th,.a4t-hsn td{text-align:center;font-size:8pt}.a4t-hsn th{font-weight:800}.a4t-tax-words{border-left:1px solid #111;border-right:1px solid #111;border-bottom:1px solid #111;padding:.9mm 1.3mm;font-size:8pt}.a4t-footer{display:grid;grid-template-columns:1fr 31mm 49mm;min-height:33mm;border-left:1px solid #111;border-right:1px solid #111;border-bottom:1px solid #111;padding:1.2mm;gap:3mm;box-sizing:border-box}.a4t-footer>div{align-self:start}.a4t-bank div{margin:.45mm 0;font-size:8pt}.a4t-terms{margin-top:2mm}.a4t-qr{text-align:center}.a4t-qr .payment-qr{width:25mm;height:25mm;object-fit:contain}.a4t-sign{text-align:center;padding-top:1.5mm}.a4t-sign .signature-img{max-width:24mm;max-height:16mm;margin:1mm auto}
@media screen{.a4-tally-invoice{width:196mm!important;min-width:196mm!important;max-width:196mm!important}.a4-document-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}}
@media(max-width:700px){.a4-tally-invoice{width:196mm!important;min-width:196mm!important;max-width:196mm!important}}
@media print{html,body{width:210mm!important;background:#fff!important}.content,main{width:100%!important;max-width:none!important;padding:0!important;margin:0!important}.a4-tally-invoice{width:196mm!important;min-width:196mm!important;max-width:196mm!important;margin:0 auto!important;break-inside:avoid;page-break-inside:avoid}.a4-tally-invoice table{width:100%!important}.a4t-fill td{height:48mm!important}.a4t-footer{min-height:33mm!important}}

/* v1.4.135: A4 Sales Invoice margin polish.
   The invoice must not sit edge-to-edge in generated PDFs or web preview.
   Keep the same common A4 contract for web, PDF share and Native PDF share;
   thermal layouts are intentionally untouched. */
.a4-tally-invoice{
  width:190mm!important;
  min-width:190mm!important;
  max-width:190mm!important;
  margin:6mm auto 10mm!important;
}
@media screen{
  .a4-document-scroll{padding:6mm 0 14mm;box-sizing:border-box;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media(max-width:700px){
  .a4-document-scroll{padding-left:10px;padding-right:10px}
  .a4-tally-invoice{width:190mm!important;min-width:190mm!important;max-width:190mm!important}
}
@media print{
  /* v1.4.136: Do not declare a global A4 @page here.
     sales_document.html supplies the format-specific @page rule, and
     a global A4 rule leaked into browser thermal printing, causing tiny
     scaled output on long paper. */
  html,body{width:auto!important;margin:0!important;padding:0!important;background:#fff!important}
  .content,main{width:auto!important;max-width:none!important;margin:0!important;padding:0!important;background:#fff!important}
  .a4-document-scroll{padding:0!important;overflow:visible!important}
  .a4-tally-invoice{width:190mm!important;min-width:190mm!important;max-width:190mm!important;margin:0 auto!important}
  .a4t-fill td{height:42mm!important}
  .a4t-footer{min-height:31mm!important}
}


/* v1.4.136: Browser thermal restore after A4 invoice work.
   Thermal print must remain a physical 80mm receipt and must not inherit
   A4 invoice margins/widths. Native Bluetooth ESC/POS printing is separate. */
.invoice-thermal.thermal-browser-203{page:thermal-receipt}
.a4-tally-invoice{page:a4-sales-invoice}
@media print{
  @page thermal-receipt{size:80mm auto;margin:0}
  @page a4-sales-invoice{size:A4 portrait;margin:7mm}
  .invoice-thermal.thermal-browser-203{
    width:69mm!important;min-width:69mm!important;max-width:69mm!important;
    margin:0 9mm 0 2mm!important;padding:1mm 0!important;
    transform:none!important;zoom:1!important;overflow:visible!important;
    page-break-inside:auto!important;break-inside:auto!important;
  }
  .invoice-thermal.thermal-browser-203 table{width:100%!important;max-width:100%!important}
  .invoice-thermal.thermal-browser-203 ~ *,
  body:has(.invoice-thermal.thermal-browser-203) .a4-document-scroll{display:none!important}
}


/* ============================================================
   v1.4.138 — Daily Handover + mobile notification polish
   - Notification drawer actions stay visible on small phones.
   - Read/Mark-all-read buttons wrap cleanly instead of being clipped.
   - Notification list rows stack actions under text on mobile.
   ============================================================ */
.notification-panel-actions form{margin:0;display:flex;}
.notification-panel-actions button{white-space:nowrap;line-height:1.2;padding:6px 4px;}
.notif-row>.actions{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap;min-width:0;}
.notif-row>.actions form{margin:0;}
@media(max-width:760px){
  .page-head{align-items:flex-start;gap:10px;}
  .page-head>.actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-bottom:0;}
  .page-head>.actions .btn,.page-head>.actions form,.page-head>.actions button{width:100%;text-align:center;}
  .notif-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .notif-tabs .btn{width:100%;text-align:center;min-width:0;padding-left:8px;padding-right:8px;}
  .notif-row{grid-template-columns:10px 1fr;gap:9px;}
  .notif-row>.actions{grid-column:2;width:100%;justify-content:flex-start;padding-bottom:0;}
  .notif-row>.actions .btn,.notif-row>.actions button{min-width:92px;text-align:center;}
  .notification-panel{display:none;}
  .notification-panel.open{display:flex;}
  .notification-panel-head,.notification-panel-actions{gap:10px;padding:11px 12px;}
  .notification-panel-actions{display:grid;grid-template-columns:1fr 1fr;align-items:center;}
  .notification-panel-actions a,.notification-panel-actions button{display:block;width:100%;text-align:center;padding:8px 6px;border:1px solid #eadfca;border-radius:10px;background:#fff8e8;}
}
/* End v1.4.138 */


/* ============================================================
   v1.4.141 — FY endpoint alias, notification action visibility,
   and mobile safe-area polish.
   ============================================================ */
.notification-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.notification-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;min-width:0;}
.notification-head-actions a,.notification-head-actions button{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:6px 8px;border:1px solid #eadfca;border-radius:10px;background:#fff8e8;color:#c91f1f;font-size:12px;font-weight:800;text-decoration:none;white-space:nowrap;}
.notification-head-actions form{margin:0;display:inline-flex;}
.notification-panel-list{flex:1 1 auto;min-height:0;}
.notification-panel-actions{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:8px 12px calc(8px + env(safe-area-inset-bottom));}
.notification-panel-actions a{flex:1;text-align:center;border:1px solid #eadfca;border-radius:10px;background:#fff8e8;padding:8px 6px;}
@media(max-width:760px){
  body{padding-bottom:env(safe-area-inset-bottom);}
  .notification-panel{top:calc(72px + env(safe-area-inset-top))!important;max-height:calc(100dvh - 96px - env(safe-area-inset-bottom))!important;}
  .notification-panel-head{align-items:flex-start;}
  .notification-head-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;}
  .notification-head-actions a,.notification-head-actions button{width:100%;font-size:11px;padding:7px 4px;}
  .notification-panel-head{display:grid;grid-template-columns:1fr;}
  .app-bottom-nav,.bottom-nav,.mobile-bottom-nav{padding-bottom:calc(8px + env(safe-area-inset-bottom));}
  .fab,.floating-action,.create-entry-fab{bottom:calc(72px + env(safe-area-inset-bottom))!important;}
}
/* End v1.4.141 */


/* ============================================================
   v1.4.200 — Desktop workspace refinement only.
   IMPORTANT: mobile/tablet layout is intentionally unchanged.
   The global content shell uses the available browser width on desktop so
   wide reports/tables require less horizontal scrolling. Print is untouched.
   ============================================================ */
@media screen and (min-width: 901px){
  .content{
    width:calc(100vw - 96px);
    max-width:1320px;
    margin-left:auto;
    margin-right:auto;
    padding-left:18px;
    padding-right:18px;
  }
}
/* End v1.4.200 desktop workspace refinement */

.sync-paused{color:#9a6700!important;font-weight:800}
/* v1.4.208 Offline Sales status only; no existing print/layout geometry changed. */
.offline-sales-state{display:inline-block;padding:6px 10px;border-radius:16px;font-size:.88rem;font-weight:700;margin:0 0 10px}.offline-sales-state.online{background:#e8f5e9}.offline-sales-state.offline{background:#fff3cd}

/* v1.4.286: window-bound notification panel, all roles. */
.notification-panel{box-sizing:border-box;}
.notification-panel-list{flex:1 1 auto;min-height:0;overflow-y:auto;}
.notification-panel-head,.notification-panel-actions{flex-shrink:0;}
.notification-mini button{overflow-wrap:anywhere;}

/* Eight item columns; HSN remains in the summary. */
.a4t-items.a4t-items-no-hsn th:nth-child(1){width:5%}.a4t-items.a4t-items-no-hsn th:nth-child(2){width:40%}.a4t-items.a4t-items-no-hsn th:nth-child(3){width:12%}.a4t-items.a4t-items-no-hsn th:nth-child(4){width:9%}.a4t-items.a4t-items-no-hsn th:nth-child(5){width:9%}.a4t-items.a4t-items-no-hsn th:nth-child(6){width:6%}.a4t-items.a4t-items-no-hsn th:nth-child(7){width:8%}.a4t-items.a4t-items-no-hsn th:nth-child(8){width:11%}

/* v1.4.310: equal space above/below each invoice item. */
.invoice-thermal.thermal-browser-203 .thermal-sale-items tbody td {
 padding-top:1.2mm!important;padding-bottom:1.2mm!important;vertical-align:middle!important;
}
.a4t-items.a4t-items-no-hsn tbody tr:not(.a4t-fill):not(.a4t-subtotal) td {
 padding-top:1.2mm!important;padding-bottom:1.2mm!important;vertical-align:middle!important;
}
.thermal-common-hsn b {font-weight:700!important;}