:root{ color-scheme: dark; /* Dark palette (inspired by the provided UI) */ --bg:#0c1627; --bg2:#08111f; --panel:#152238; --card:#101a2d; --border:rgba(148,163,184,.18); --border-rgb: 148,163,184; --primary-rgb: 11,92,255; --primary-200:#9ec5ff; --text:rgba(255,255,255,.92); --muted:rgba(255,255,255,.66); --muted2:rgba(255,255,255,.52); --accent:#0b5cff; --accent-rgb: 11,92,255; --accent2:#22c55e; --danger:#ef4444; --danger-rgb: 239,68,68; --link: var(--accent); --shadow:0 14px 44px rgba(0,0,0,.35); --radius:18px; --font: "Vazirmatn", "IRANSansX", "IRANSans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", "Tahoma", Arial; } /* Light theme overrides (toggled by data-theme="light" on OR class="theme-light") */ :root[data-theme="light"], html.theme-light, body.theme-light{ color-scheme: light; --bg:#f4f7ff; --bg2:#eef4ff; --panel:#ffffff; --card:#ffffff; --border:rgba(15,23,42,.10); --border-rgb: 15,23,42; --primary-rgb: 11,92,255; --primary-200:#2563eb; --text:rgba(15,23,42,.92); --muted:rgba(15,23,42,.62); --muted2:rgba(15,23,42,.52); --accent:#0b5cff; --accent-rgb: 11,92,255; --accent2:#22c55e; --danger:#ef4444; --danger-rgb: 239,68,68; --link: var(--accent); --shadow:0 14px 44px rgba(2,6,23,.10); --radius:18px; --font: "Vazirmatn", "IRANSansX", "IRANSans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", "Tahoma", Arial; } *{box-sizing:border-box} /* Force HTML hidden attribute to work even when author CSS sets display:flex/inline-flex */ [hidden]{display:none !important;} html,body{height:100%} html,body{max-width:100%;overflow-x:hidden} html{-webkit-text-size-adjust:100%;text-size-adjust:100%;} body{ margin:0; font-family:var(--font); background:linear-gradient(160deg, var(--bg), var(--bg2) 55%, var(--bg)); color:var(--text); } /* Purchase and inventory: deliberately compact, operational UI. */ .inventoryPage{ display:grid; gap:14px; } .inventoryPage__head, .inventoryEditor__head, .inventoryLines__head, .inventoryEditor__actions, .inventoryFilters, .inventoryTabs{ display:flex; align-items:center; gap:10px; } .inventoryPage__head, .inventoryEditor__head, .inventoryLines__head{ justify-content:space-between; } .inventoryPage__head h1, .inventoryEditor__head h2{ margin:0; } .inventoryPage__head p{ margin:4px 0 0; color:var(--muted); font-size:13px; } .inventoryMessage{margin:0} .inventoryEditor, .inventoryListCard{padding:16px} .inventoryFormGrid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:14px; } .inventoryFormGrid label, .inventoryFilters label{ display:grid; gap:6px; color:var(--muted); font-size:12px; } .inventoryField--wide{grid-column:span 3} .inventoryLines{ margin-top:16px; padding-top:14px; border-top:1px solid var(--border); } .inventoryLines__head{margin-bottom:10px} .inventoryLinesTable{min-width:760px} .inventoryLinesTable select{min-width:220px} .inventoryLinesTable input{ width:110px; min-width:90px; } .inventoryLinesTable td:last-child, .inventoryLinesTable th:last-child{ width:44px; text-align:center; } .inventoryLineRemove{ border:0; background:transparent; color:var(--danger); cursor:pointer; font-size:19px; padding:5px 9px; } .inventoryLineTotal{white-space:nowrap} .inventoryTotals{ display:flex; justify-content:flex-end; gap:18px; flex-wrap:wrap; margin-top:12px; color:var(--muted); font-size:13px; } .inventoryTotals strong{color:var(--text)} .inventoryEditor__actions{ justify-content:flex-end; margin-top:14px; } .inventoryFilters{ align-items:end; flex-wrap:wrap; margin-bottom:14px; } .inventoryFilters label{min-width:180px} .inventoryFilters label:first-child{flex:1;min-width:240px} .inventoryTabs{ border-bottom:1px solid var(--border); } .inventoryTab{ border:0; border-bottom:2px solid transparent; background:transparent; color:var(--muted); cursor:pointer; padding:9px 14px; } .inventoryTab.is-active{ color:var(--text); border-bottom-color:var(--accent); } .inventoryStatus{ display:inline-flex; align-items:center; border:1px solid var(--border); border-radius:999px; padding:3px 8px; font-size:11px; white-space:nowrap; } .inventoryStatus--posted{ color:var(--accent2); border-color:rgba(34,197,94,.35); } .inventoryStatus--cancelled{ color:var(--danger); border-color:rgba(var(--danger-rgb),.35); } .inventoryActions{ display:flex; gap:6px; flex-wrap:wrap; } .inventoryEmpty{ color:var(--muted); padding:20px 4px; text-align:center; } .inventoryPager{ display:flex; justify-content:center; align-items:center; gap:8px; margin-top:12px; } .inventorySource{ color:var(--muted); font-size:12px; } .inventoryReportFilters{padding:16px} .inventoryReportFilterGrid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; } .inventoryReportFilterGrid label{ display:grid; gap:6px; color:var(--muted); font-size:12px; } .inventoryReportFilterActions{ display:flex; justify-content:flex-end; gap:8px; margin-top:14px; } .inventoryReportSummary{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; } .inventoryReportStat{ display:grid; gap:7px; padding:14px 16px; } .inventoryReportStat span{ color:var(--muted); font-size:12px; } .inventoryReportStat strong{ font-size:20px; line-height:1.2; } .inventoryReportTable{min-width:900px} .inventoryReportTable__in{color:var(--accent2)} .inventoryReportTable__out{color:var(--danger)} @media (max-width: 760px){ .inventoryPage__head{align-items:flex-start} .inventoryFormGrid{grid-template-columns:1fr} .inventoryField--wide{grid-column:auto} .inventoryEditor, .inventoryListCard{padding:12px} .inventoryFilters{display:grid;grid-template-columns:1fr} .inventoryFilters label, .inventoryFilters label:first-child{min-width:0;width:100%} .inventoryEditor__actions{align-items:stretch;flex-direction:column} .inventoryEditor__actions .btn{width:100%} .inventoryTotals{justify-content:flex-start} .inventoryReportFilterGrid, .inventoryReportSummary{grid-template-columns:1fr} .inventoryReportFilterActions{display:grid;grid-template-columns:1fr} .inventoryReportFilterActions .btn{width:100%} } /* Ensure Firefox form controls use the same font */ button,input,select,textarea{font-family:var(--font)} /* During silent auto-refresh, rows/buttons are patched in-place and no entry animation is replayed. */ [data-suppress-next-btn-anim="1"] .btn, [data-suppress-next-btn-anim="1"] .invActionBtn, [data-suppress-next-btn-anim="1"] .jobActionBtn{ animation: none !important; transition-duration: .08s !important; } html[data-theme="light"] .sidebar, body.theme-light .sidebar{ background:rgba(255,255,255,.86); } html[data-theme="light"] .card, body.theme-light .card{ background:rgba(255,255,255,.92); } html[data-theme="light"] .out, body.theme-light .out{ background:rgba(2,6,23,.04); } html[data-theme="light"] .modal__panel, body.theme-light .modal__panel{ background:rgba(255,255,255,.96); } html[data-theme="light"] .nav__item, body.theme-light .nav__item, html[data-theme="light"] .navGroup__btn, body.theme-light .navGroup__btn{ background:rgba(2,6,23,.02); } html[data-theme="light"] .nav__item.is-active, body.theme-light .nav__item.is-active{ background:rgba(var(--accent-rgb),.12); } /* Light mode: make sidebar texts more "blue" as requested */ html[data-theme="light"] .sidebar, body.theme-light .sidebar{ color:#0b5cff; } html[data-theme="light"] .sidebar .muted, body.theme-light .sidebar .muted{ color: rgba(11,92,255,.78); } html[data-theme="light"] .nav__item, body.theme-light .nav__item, html[data-theme="light"] .navGroup__btn, body.theme-light .navGroup__btn{ color:#0b5cff; } html[data-theme="light"] .nav__ico, body.theme-light .nav__ico{ color: currentColor; } html[data-theme="light"] .navGroup__chev:hover, body.theme-light .navGroup__chev:hover{ background: rgba(2,6,23,.03); } .layout{ display:grid; grid-template-columns: 280px 1fr; min-height:100vh; } .sidebar{ background:rgba(15,23,42,.82); border-left:1px solid var(--border); padding:16px; position:sticky; top:0; height:100vh; display:flex; flex-direction:column; gap:14px; /* prevent expanded menus from spilling under the footer */ overflow:hidden; } .brand__title{font-size:20px;font-weight:800;letter-spacing:.3px} .brand__sub{font-size:12px;color:var(--muted);margin-top:2px} .activebox{ background:rgba(255,255,255,.03); border:1px solid var(--border); border-radius:var(--radius); padding:12px; } .activebox__label{color:var(--muted);font-size:12px} .activebox__value{margin-top:6px;font-weight:700} .activebox__actions{margin-top:10px} .nav{ display:flex; flex-direction:column; justify-content:flex-start; gap:8px; /* make the menu scroll inside the sidebar so footer stays clean */ flex:1 1 auto; min-height:0; overflow:auto; padding-bottom:10px; } /* Hide the scrollbar in the sidebar nav (still scrollable with wheel/touch) */ .nav{ scrollbar-width:none; -ms-overflow-style:none; } .nav::-webkit-scrollbar{ width:0; height:0; } .navbtn{ border:1px solid var(--border); background:rgba(255,255,255,.02); color:var(--text); padding:10px 12px; border-radius:12px; cursor:pointer; text-align:right; transition:.15s ease; } .navbtn:hover{transform:translateY(-1px);box-shadow:var(--shadow)} .navbtn.active{ background:rgba(79,140,255,.18); border-color:rgba(79,140,255,.45); } .footer{margin-top:auto;display:flex;flex-direction:column;gap:6px} .link{color:var(--muted);text-decoration:none} .link:hover{color:var(--text)} .main{padding:18px 18px 40px} .topbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; } .topbar__title{font-weight:900;font-size:18px} .topbar__right{display:flex;gap:8px;align-items:center} .card{ background:linear-gradient(180deg, rgba(15,25,48,.86), rgba(15,25,48,.68)); border:1px solid var(--border); border-radius:var(--radius); padding:16px; box-shadow:var(--shadow); backdrop-filter: blur(6px); } .card h2{margin:0 0 10px;font-size:16px} .h3{margin:0 0 8px;font-size:14px} .small{font-size:12px} .grid2{display:grid;grid-template-columns: 1fr 1fr;gap:14px} .grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px} @media (max-width: 1180px){ .grid3{grid-template-columns:repeat(2,minmax(0,1fr))} } @media (max-width: 980px){ .layout{grid-template-columns: 1fr} .sidebar{position:relative;height:auto} .grid2{grid-template-columns:1fr} .grid3{grid-template-columns:1fr} } .form{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 16px;align-items:start} .form label{display:flex;flex-direction:column;gap:6px;width:100%} .form label.check{flex-direction:row;gap:8px;align-items:center} /* Switch (checkbox) inside forms */ .form label.check{ user-select:none; } .form label.check input[type="checkbox"]{ appearance:none; width:46px; height:28px; padding:0; margin:0; border-radius:999px; border:1px solid rgba(148,163,184,.35); background:rgba(148,163,184,.18); position:relative; cursor:pointer; box-shadow: inset 0 1px 0 rgba(255,255,255,.06); flex:0 0 auto; } .form label.check input[type="checkbox"]::before{ content:""; position:absolute; width:22px; height:22px; border-radius:999px; inset-block-start:2px; inset-inline-start:2px; background:rgba(255,255,255,.90); box-shadow:0 10px 18px rgba(0,0,0,.25); transition: inset-inline-start .16s ease, transform .16s ease; } .form label.check input[type="checkbox"]:checked{ background:rgba(var(--accent-rgb),.30); border-color:rgba(var(--accent-rgb),.55); } .form label.check input[type="checkbox"]:checked::before{ inset-inline-start: calc(100% - 2px - 22px); transform: translateZ(0); } html[data-theme="light"] .form label.check input[type="checkbox"], body.theme-light .form label.check input[type="checkbox"]{ border-color: rgba(15,23,42,.18); background: rgba(2,6,23,.06); box-shadow: inset 0 1px 0 rgba(255,255,255,.92); } html[data-theme="light"] .form label.check input[type="checkbox"]:checked, body.theme-light .form label.check input[type="checkbox"]:checked{ background: rgba(var(--accent-rgb),.20); border-color: rgba(var(--accent-rgb),.55); } /* Settings: key-from-file row alignment */ .keyFileRow{ align-items:center; gap:12px; } .keyFileRow .check{ white-space:nowrap; } .keyFileRow .filepick{ flex:1 1 360px; } /* v115: spacing for certificate file switch below certificate input */ .certFields .keyFileRow{ margin-top:10px; } .certFields .check{ margin-top:0; } .form label > input, .form label > select, .form label > textarea{width:100%; box-sizing:border-box} /* فیلتر بازه زمانی (جمع‌وجور) */ .filter-mini{ display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap; padding:8px 10px; border:1px solid rgba(255,255,255,.08); border-radius:16px; background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); } html[data-theme="light"] .filter-mini, body.theme-light .filter-mini{ border-color:rgba(15,23,42,.12); background:linear-gradient(180deg, rgba(2,6,23,.02), rgba(2,6,23,.01)); box-shadow: inset 0 1px 0 rgba(255,255,255,.85); } .filter-mini__toggle{display:flex;flex-direction:row;align-items:center;gap:8px;margin:0} .filter-mini__fields{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap} .filter-mini__field{display:flex;flex-direction:column;gap:6px;font-size:11px;color:var(--muted)} .filter-mini__field input{width:150px;min-width:150px} .input--sm{padding:8px 10px;border-radius:10px;font-size:12px} /* فرم‌ها: چیدمان تمیزتر و کمتر تکراری (ورودی‌ها خودشان قاب دارند) */ .form{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:12px 14px; align-items:start; } .form label{display:flex;flex-direction:column;gap:6px;width:100%} /* روی فرم‌های قبلی که از label.check استفاده می‌کنند */ .form label.check{flex-direction:row;gap:8px;align-items:center} /* برای فرم‌های شلوغ: گرید ۱۲ ستونه با امکان کوچک/بزرگ کردن فیلدها */ .form--pro{ grid-template-columns:repeat(12, minmax(0, 1fr)); } .form--pro > label{grid-column: span 6;} .form--pro > .row, .form--pro > .formmsg, .form--pro > .formsep{grid-column: span 12;} .form--pro > label.col-12{grid-column: span 12;} .form--pro > label.col-8{grid-column: span 8;} .form--pro > label.col-6{grid-column: span 6;} .form--pro > label.col-5{grid-column: span 5;} .form--pro > label.col-4{grid-column: span 4;} .form--pro > label.col-3{grid-column: span 3;} .form--pro > label.col-2{grid-column: span 2;} .form--pro > .col-12{grid-column: span 12;} .form--pro > .col-8{grid-column: span 8;} .form--pro > .col-6{grid-column: span 6;} .form--pro > .col-5{grid-column: span 5;} .form--pro > .col-4{grid-column: span 4;} .form--pro > .col-3{grid-column: span 3;} .form--pro > .col-2{grid-column: span 2;} /* جداکننده/تیتر داخل فرم‌ها */ .formsep{ display:flex; align-items:center; gap:10px; margin-top:2px; padding-top:8px; color:var(--muted); font-weight:800; font-size:12px; } .formsep::before{ content:""; flex:1 1 auto; height:1px; background:rgba(148,163,184,.24); } .formsep::after{ content:""; flex:10 10 auto; height:1px; background:rgba(148,163,184,.14); } html[data-theme="light"] .formsep::before, html[data-theme="light"] .formsep::after, body.theme-light .formsep::before, body.theme-light .formsep::after{ background:rgba(15,23,42,.12); } /* در عرض‌های کمتر (موبایل): فرم‌ها ستونیِ کامل نشوند؛ ترکیبی و خوانا باشند */ @media (max-width: 980px){ /* فرم‌های ساده: 1 یا 2 ستون بسته به فضا */ .form{grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));} /* فرم‌های Pro: همان گرید ۱۲ ستونه، ولی اسپن‌ها برای موبایل بهینه می‌شوند */ .form--pro{grid-template-columns:repeat(12, minmax(0, 1fr));} /* پیش‌فرض: فیلدها تمام‌عرض (تا ریز نشوند) */ .form--pro > label{grid-column: span 12;} .form--pro > .row, .form--pro > .formmsg, .form--pro > .formsep{grid-column: span 12;} /* فیلدهای کوچک‌تر: دو ستونه */ .form--pro > label.col-4, .form--pro > label.col-3, .form--pro > label.col-2{grid-column: span 6;} /* نیم‌عرضِ اجباری (برای جاهایی مثل لوگو/امضاء یا تلفن/ایمیل) */ .form--pro > label.keep-half{grid-column: span 6 !important;} /* اسپن‌های دقیق برای موبایل (sm-*) — فقط در صورت نیاز روی همان فیلد بگذار */ .form--pro > label.sm-12{grid-column: span 12 !important;} .form--pro > label.sm-7{grid-column: span 7 !important;} .form--pro > label.sm-6{grid-column: span 6 !important;} .form--pro > label.sm-5{grid-column: span 5 !important;} /* سایر اجزاءِ غیر-لیبل که col-* دارند */ .form--pro > .col-12{grid-column: span 12;} .form--pro > .col-8{grid-column: span 12;} .form--pro > .col-6{grid-column: span 12;} .form--pro > .col-5{grid-column: span 12;} .form--pro > .col-4, .form--pro > .col-3, .form--pro > .col-2{grid-column: span 12;} } /* دیگر label به شکل باکس تکراری نیست؛ اگر جایی باکس خواستی از .fieldbox استفاده کن */ .fieldbox{ padding:10px 10px; border-radius:16px; border:1px solid rgba(255,255,255,.06); background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); } html[data-theme="light"] .fieldbox, body.theme-light .fieldbox{ border-color:rgba(15,23,42,.09); background:linear-gradient(180deg, rgba(2,6,23,.02), rgba(2,6,23,.01)); box-shadow: inset 0 1px 0 rgba(255,255,255,.85); } .field{display:flex;flex-direction:column;gap:6px} label{color:var(--muted);font-size:12px} input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea{ padding:10px 12px; border-radius:12px; border:1px solid var(--border); background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)); color:var(--text); outline:none; box-shadow: inset 0 1px 0 rgba(255,255,255,.05); } input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover, select:hover, textarea:hover{ border-color:rgba(255,255,255,.14); } input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus, select:focus, textarea:focus{ border-color:rgba(79,140,255,.55); box-shadow: 0 0 0 3px rgba(79,140,255,.16), inset 0 1px 0 rgba(255,255,255,.06); } /* ---------------- File inputs (nicer upload boxes) ---------------- */ input[type="file"]{ padding:10px 12px; border-radius:14px; border:1px dashed rgba(148,163,184,.35); background:rgba(255,255,255,.03); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); } html[data-theme="light"] input[type="file"], body.theme-light input[type="file"]{ border-color:rgba(15,23,42,.18); background:rgba(2,6,23,.02); box-shadow: inset 0 1px 0 rgba(255,255,255,.9); } input[type="file"]::file-selector-button{ border:1px solid rgba(var(--accent-rgb),.40); background:rgba(var(--accent-rgb),.10); color:var(--accent); border-radius:12px; padding:8px 12px; margin-inline-end:10px; cursor:pointer; } input[type="file"]::file-selector-button:hover{ background:rgba(var(--accent-rgb),.16); } input[type="file"]:hover{ border-color:rgba(var(--accent-rgb),.35); } input[type="file"]:focus{ border-color:rgba(var(--accent-rgb),.55); box-shadow: 0 0 0 3px rgba(var(--accent-rgb),.14), inset 0 1px 0 rgba(255,255,255,.06); } /* File pick (custom, for private key selection) */ .filepick{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:10px 12px; border-radius:14px; border:1px dashed rgba(148,163,184,.35); background:rgba(255,255,255,.02); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); } .filepick__name{ flex:1 1 220px; min-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } html[data-theme="light"] .filepick, body.theme-light .filepick{ border-color:rgba(15,23,42,.18); background:rgba(255,255,255,.80); box-shadow: 0 8px 16px rgba(2,6,23,.05); } @media (max-width: 520px){ .filepick{gap:8px;} .filepick__name{flex-basis:100%; min-width:0;} } /* کنترل‌های فرم در حالت روشن */ html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html[data-theme="light"] select, html[data-theme="light"] textarea, body.theme-light input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), body.theme-light select, body.theme-light textarea{ background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.86)); border-color:rgba(15,23,42,.12); box-shadow: inset 0 1px 0 rgba(255,255,255,.9); } html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover, html[data-theme="light"] select:hover, html[data-theme="light"] textarea:hover, body.theme-light input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover, body.theme-light select:hover, body.theme-light textarea:hover{ border-color:rgba(15,23,42,.20); } /* رفع مشکل خوانایی منوی کشویی در حالت شب */ select, option{ background-color: rgba(15,23,42,.98); color: var(--text); } html[data-theme="light"] select, html[data-theme="light"] option, body.theme-light select, body.theme-light option{ background-color:#ffffff; color: var(--text); } textarea{resize:vertical} .muted{color:var(--muted)} .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:flex-start} .sortHeadBtn{display:inline-flex;align-items:center;gap:6px;background:transparent;border:0;padding:0;color:inherit;font:inherit;cursor:pointer} .sortHeadBtn__dir{font-size:11px;opacity:.8} .sortHeadBtn.is-active{font-weight:700} .invRowActions{flex-wrap:nowrap;gap:4px;align-items:center;white-space:nowrap} .invRowActions .btn{flex:0 0 auto} .invActionsCell{white-space:nowrap} .invActionBtn{background:transparent !important;border:1px solid var(--border) !important;box-shadow:none !important} .invActionBtn:hover{background:rgba(var(--accent-rgb),.08) !important;border-color:rgba(var(--accent-rgb),.35) !important} /* عملیات فهرست فاکتور: دکمه‌ها داخل باکس مربعی */ .invActionBtn.btn--iconOnly{min-width:34px;width:34px;height:34px;border-radius:0 !important} .invActionBtn .btn__ico svg{width:15px;height:15px} /* عملیات داخل جدول (طرف حساب/کالا): مرتب و جمع‌وجور */ .opActions{ display:flex; gap:8px; flex-wrap:nowrap; align-items:center; justify-content:flex-start; } .opActions .btn{ min-width:92px; justify-content:center; } /* نسخه جمع‌وجور برای ردیف‌های شلوغ (طرف حساب/کالا) */ .opActions--mini{ gap:6px; } .opActions--mini .btn{ min-width:0; padding-inline:10px; } /* نوار عملیات گروهی (انتخاب‌شده/حذف انتخاب‌شده/حذف همه) */ .bulkActions{ display:flex; gap:8px; align-items:center; justify-content:flex-start; flex-wrap:wrap; } @media (max-width: 640px){ .opActions{ flex-wrap:wrap; gap:6px; } .opActions .btn{ min-width:84px; } } /* عملیات داخل جدول (تنظیمات شرکت): دکمه‌ها هم‌اندازه و زیر هم */ .opsRow{ gap:8px; flex-wrap:nowrap; flex-direction:column; align-items:stretch; } .opsRow .btn{ width:100%; min-width:0; justify-content:center; } .opsRow .btn--sm{min-width:0} /* تنظیمات چاپ: ردیف دکمه‌ها و پیش‌نمایش مرتب‌تر */ .printActions{gap:10px;flex-wrap:wrap;align-items:center} .printPreviews{gap:12px;flex-wrap:wrap;align-items:flex-end} .printActionBtns{display:flex;gap:10px;flex-wrap:wrap;align-items:center;flex:1 1 100%;min-width:0} .printActions--split{align-items:flex-start} .printActions--split .printPreviews{flex:1 1 100%;width:100%} /* Connection ID is alphanumeric: keep it LTR so the whole value is readable (esp. on mobile) */ #c_clientId{direction:ltr;text-align:left;unicode-bidi:plaintext} .imgPreview{ max-height:64px; max-width:200px; display:none; border:1px solid var(--border); border-radius:12px; padding:6px; background:rgba(255,255,255,.88); box-shadow: inset 0 1px 0 rgba(255,255,255,.6); } html[data-theme="dark"] .imgPreview{background:rgba(2,6,23,.55)} .btn{ display:inline-flex; position:relative; align-items:center; justify-content:center; gap:8px; white-space:nowrap; border:1px solid rgba(var(--accent-rgb),.55); background:linear-gradient(180deg, rgba(var(--accent-rgb),.98), rgba(var(--accent-rgb),.78)); color:#fff; padding:10px 12px; border-radius:14px; cursor:pointer; box-shadow:0 12px 30px rgba(var(--accent-rgb),.16); transition:transform .15s ease, filter .15s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease, opacity .15s ease; } .btn svg{width:18px;height:18px;flex:0 0 18px} .btn:hover{filter:brightness(1.03);transform:translateY(-1px)} .btn:active{transform:translateY(0);filter:brightness(.98)} .btn:disabled{opacity:.55;cursor:not-allowed;transform:none} /* حاشیه/هایلایت ظریف فقط برای دکمه‌های آبی (Primary) */ .btn:not(.btn--ghost):not(.btn--danger)::after{ content:""; position:absolute; inset:1px; border-radius:inherit; border:1px solid rgba(255,255,255,.22); pointer-events:none; } html[data-theme="dark"] .btn:not(.btn--ghost):not(.btn--danger)::after{ border-color: rgba(255,255,255,.18); } @keyframes popIn{ from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:translateY(0)} } .btn.btn-in{animation:popIn .18s ease-out both} .btn--ghost{ border:1px solid rgba(var(--accent-rgb),.28); background:rgba(255,255,255,.04); color:var(--accent); box-shadow:none; } .btn--ghost:hover{background:rgba(var(--accent-rgb),.08)} .btn--danger{ border:1px solid rgba(var(--danger-rgb),.60); background:linear-gradient(180deg, rgba(var(--danger-rgb),.96), rgba(var(--danger-rgb),.70)); color:#fff; box-shadow:0 12px 30px rgba(var(--danger-rgb),.12); } .divider{height:1px;background:var(--border);margin:8px 0} .kv{display:grid;grid-template-columns: 160px 1fr;gap:8px;align-items:center;margin-top:10px} .kv__k{color:var(--muted);font-size:12px} .kv__v{font-weight:700} .out{ background:rgba(0,0,0,.25); border:1px solid var(--border); border-radius:12px; padding:12px; overflow:auto; min-height:180px; } .out--sm{min-height:auto;max-height:360px;white-space:pre-wrap} .msgbox{ padding:10px; border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,.03); line-height:1.9; } .msgbox--ok{border-color:rgba(34,197,94,.45)} .msgbox--err{border-color:rgba(255,90,95,.55)} .table{ width:100%; border-collapse:collapse; font-size:13px; } .table th,.table td{ border-bottom:1px solid var(--border); padding:10px 8px; text-align:right; vertical-align:top; } .table th{color:var(--muted);font-weight:700} .th-sort{cursor:pointer;user-select:none;white-space:nowrap} .th-sort:hover{color:var(--text)} .th-sort .sort-ind{margin-right:6px;color:var(--muted2);font-size:11px} .th-sort.is-active{color:var(--text)} .badge{ display:inline-block; padding:3px 8px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.03); font-size:12px; } /* green "active" label in settings */ .badge--active{ border-color: rgba(46, 204, 113, .65); background: rgba(46, 204, 113, .14); color: #2ecc71; font-weight: 800; } .tablewrap{overflow:auto} /* Some markup uses tableWrap (capital W). Keep both. */ .tableWrap{overflow:auto} .tablewrap,.tableWrap{-webkit-overflow-scrolling:touch;max-width:100%;width:100%} /* جدول طرف حساب: ستون‌ها متناسب با محتوا باشند، بدون بزرگ‌کردن کل باکس فهرست */ .table--fit{width:100%;table-layout:auto} .table--customers{width:100%;table-layout:auto} .table--customers th,.table--customers td{white-space:nowrap} .table--customers thead th{text-align:center;vertical-align:middle;} .table--customers thead .sortHeadBtn{margin-inline:auto;justify-content:center;} .table--customers .custCol--code, .table--customers .custCol--nid, .table--customers .custCol--phone, .table--customers .custCol--ops{ width:1%; } .table--customers .custCol--name{ width:auto; white-space:normal; word-break:break-word; min-width:220px; } .table--customers .custCol--nid, .table--customers .custCol--phone{ direction:ltr; text-align:left; unicode-bidi:plaintext; min-width:0; } .table--customers .custCol--ops{min-width:108px;text-align:center;} .table--customers thead .custCol--ops{padding-inline:14px;} /* فرم طرف حساب: متن نوع خریدار داخل select واضح‌تر دیده شود */ #cust_buyerType{font-size:13px;padding-inline-start:14px} /* ---------------- Settings (mobile-friendly) ---------------- */ /* Companies list as cards (used on narrow screens) */ .companyCards{display:flex;flex-direction:column;gap:10px} .companyCard{ border:1px solid var(--border); border-radius:16px; padding:12px; background:rgba(255,255,255,.02); } .companyCard__head{display:flex;flex-direction:column;gap:6px;margin-bottom:8px} .companyCard__badges{display:flex;gap:8px;flex-wrap:wrap;align-items:center} .companyCard__name{font-weight:900;font-size:14px} .companyCard__meta .kv{margin:0;grid-template-columns:110px 1fr;gap:6px} .companyCard__url{ direction:ltr; text-align:left; unicode-bidi:plaintext; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; } .companyCard__actions{margin-top:10px} html[data-theme="light"] .companyCard, body.theme-light .companyCard{ background:rgba(255,255,255,.92); border-color:rgba(15,23,42,.10); box-shadow:0 10px 22px rgba(2,6,23,.06); } /* Settings rows that tend to overflow on small screens */ @media (max-width: 640px){ .keyFileRow{align-items:stretch;} .keyFileRow .check{width:100%;} .keyFileRow .filepick{flex:1 1 auto; min-width:0; width:100%;} /* Settings: connection id field feels too tight on phones */ #c_clientId{min-height:46px;} } /* Settings (narrow screens): keep print actions split (buttons + previews side-by-side) and do NOT show an empty previews column when no assets exist. */ @media (max-width: 980px){ .printActions--split{flex-wrap:nowrap;align-items:stretch;gap:12px;} .printActionBtns{flex:1 1 auto; min-width:0;} .printActionBtns .btn{flex:1 1 100%; width:100%;} .printActionBtns .muted.small{flex:1 1 100%; width:100%;} .printActions--split .printPreviews{ display:none; /* shown only when JS adds .is-show */ flex:0 0 168px; max-width:168px; width:168px; flex-direction:column; justify-content:flex-start; align-items:stretch; gap:10px; } .printActions--split .printPreviews.is-show{display:flex;} .printActions--split .printPreviews .muted.small{display:none;} .printActions--split .imgPreview{max-width:100%;max-height:118px;} /* Connection id readability */ #c_clientId{min-height:46px;} } .n{direction:ltr;text-align:left;unicode-bidi:plaintext} .c{text-align:center} .in{ padding:8px 10px; border-radius:10px; border:1px solid var(--border); background:rgba(255,255,255,.04); color:var(--text); width:100%; } .in--wide{min-width:180px} .btn--sm{padding:6px 10px;border-radius:12px;font-size:12px} .btn--sm svg{width:16px;height:16px;flex:0 0 16px} /* Extra small buttons (for edit/delete inside dense tables) */ .btn--xs{padding:4px 8px;border-radius:10px;font-size:11px;gap:6px;line-height:1;min-height:28px} .btn--xs svg{width:14px;height:14px;flex:0 0 14px} /* عملیات جدول (طرف حساب/کالا): دکمه‌های ویرایش/حذف جمع‌وجور و استاندارد */ .opActions--mini .btn.btn--xs{padding:4px 8px;min-height:28px;min-width:72px} .opActions--mini{gap:6px} /* در گزارش‌ها: وقتی تعداد کارت‌ها فرد است، کارت آخر تمام عرض را بگیرد */ .span2{grid-column:1 / -1} /* Small icon/text helpers */ .btn__ico{display:inline-flex;align-items:center;justify-content:center} .btn__text{display:inline-block;line-height:1} /* Theme toggle (system/day/night) */ #btnThemeToggle .ico--system, #btnThemeToggle .ico--sun, #btnThemeToggle .ico--moon{display:none} html[data-theme-mode="system"] #btnThemeToggle .ico--system{display:block} html[data-theme-mode="light"] #btnThemeToggle .ico--sun{display:block} html[data-theme-mode="dark"] #btnThemeToggle .ico--moon{display:block} /* ---- v7 UI aliases (new ids/classes) ---- */ .brand{font-size:20px;font-weight:800;letter-spacing:.3px} .brand--logo{ position:relative; display:flex; align-items:center; min-width:0; padding:0; background:transparent !important; border:0 !important; box-shadow:none !important; } .brandLogoImg{ display:block; width:min(100%, 250px); height:54px; object-fit:contain; object-position:right center; } .brandLogoImg--light, .brandLogoImg--dark{display:none;} html[data-theme="light"] .brandLogoImg--light, body.theme-light .brandLogoImg--light{display:block;} html[data-theme="dark"] .brandLogoImg--dark{display:block;} .brandRow{display:flex;align-items:center;justify-content:space-between;gap:10px} .brandActions{display:flex;align-items:center;gap:8px} /* Top-right icon buttons (fullscreen + help): icon-only, no border box */ .topIconBtn{ width:40px;height:40px;flex:0 0 40px;padding:0;border-radius:14px; border:0 !important; background:transparent !important; box-shadow:none !important; } .topIconBtn:hover{ background:rgba(var(--accent-rgb),.08) !important; } .topIconBtn:active{ background:rgba(var(--accent-rgb),.12) !important; } .topIconBtn svg{width:18px;height:18px;flex:0 0 18px} .fsBtn svg{width:18px;height:18px;flex:0 0 18px} .fsBtn .ico--fs-exit{display:none} .fsBtn.is-on .ico--fs{display:none} .fsBtn.is-on .ico--fs-exit{display:block} .sidebar__footer{margin-top:auto;color:var(--muted);font-size:12px} /* Footer controls (theme + timer) */ .sidebar__footerTop{justify-content:space-between;align-items:flex-start;gap:10px} .sidebar__footerBottom{justify-content:space-between;align-items:center;margin-top:8px} /* Footer meta (username + rotating clock) */ .footerMeta{display:flex;flex-direction:column;gap:6px;min-width:0} /* A tiny "gold board"-like ticker: Jalali (weekday+date) -> Gregorian -> Time (big) */ .clockTicker{ position:relative; height:42px; padding:0 10px; border-radius:14px; border:1px solid rgba(251,191,36,.28); background:linear-gradient(180deg, rgba(15,23,42,.94), rgba(2,6,23,.92)); color:rgba(253,224,71,.95); text-shadow:0 1px 0 rgba(0,0,0,.55); box-shadow:inset 0 0 0 1px rgba(255,255,255,.06); max-width:260px; overflow:hidden; } .clockTicker__track{display:flex;flex-direction:column;will-change:transform} .clockTicker__slide{ height:42px; display:flex; align-items:center; justify-content:center; padding:0 6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .clockTicker__slide--jalali, .clockTicker__slide--greg{font-size:12px;font-weight:700;opacity:.95} .clockTicker__slide--time{ font-size:22px; font-weight:900; direction:ltr; font-variant-numeric:tabular-nums; letter-spacing:.6px; } html[data-theme="light"] .clockTicker, body.theme-light .clockTicker{ box-shadow:inset 0 0 0 1px rgba(255,255,255,.06), 0 12px 26px rgba(2,6,23,.14); } /* Clock ticker in the sidebar footer: match the UI chips (same style as theme toggle) */ .clockTicker--ui{ /* a bit taller so the time/date never looks clipped */ height:44px; /* کمی فضای مفید بیشتر برای متن‌های بلند تاریخ */ padding:0 8px; border-radius:14px; border:1px solid rgba(var(--accent-rgb),.28); background:rgba(255,255,255,.04); /* Match requested text color for the rotating date/time ticker */ color:#99BCFB; text-shadow:none; box-shadow:none; max-width:320px; } .clockTicker--ui .clockTicker__slide{padding:0 4px} .clockTicker--ui .clockTicker__slide{height:44px} .clockTicker--ui .clockTicker__slide--jalali, .clockTicker--ui .clockTicker__slide--greg{font-size:12px;font-weight:800;opacity:1} .clockTicker--ui .clockTicker__slide--time{font-size:22px;font-weight:900;color:inherit;line-height:1} :root[data-theme="light"] .clockTicker--ui, html.theme-light .clockTicker--ui, body.theme-light .clockTicker--ui{ background:rgba(2,6,23,.03); border-color:rgba(var(--accent-rgb),.22); /* In day mode: use a stronger theme-blue for readability */ color: var(--accent); } .footerControls{display:flex;flex-direction:column;align-items:center;gap:6px} .footerControls--bar{width:100%;align-items:stretch} .footerControls__top{ /* Stable footer layout (prevents jumping/misalignment) */ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; } .footerActionsMini{ display:flex; flex-direction:column; align-items:stretch; gap:8px; /* کمی فضای بیشتری به باکس اسلاید تاریخ/ساعت بده (بدون تغییر ترکیب) */ flex:0 1 112px; min-width:0; } .footerMetaMini{ display:flex; flex-direction:column; gap:8px; flex:1 1 auto; min-width:0; } .clockTicker--ui{width:100%;max-width:none} .footerUserMini{ width:100%; display:flex; align-items:center; gap:8px; justify-content:space-between; } .footerUserMini #envLabel{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } /* Sidebar footer plan/user chips */ .footerLinkChip, .footerInfoChip{ display:inline-flex; align-items:center; justify-content:center; min-height:44px; border-radius:14px; border:1px solid rgba(var(--accent-rgb),.22); background:rgba(255,255,255,.03); color:var(--text); padding:0 12px; font-weight:700; line-height:1; } .footerLinkChip{ width:100%; cursor:pointer; transition:border-color .18s ease, background .18s ease, transform .08s ease; } .footerLinkChip:hover{ border-color:rgba(var(--accent-rgb),.35); background:rgba(var(--accent-rgb),.08); } .footerLinkChip:active{ transform:translateY(1px); } .footerLinkChip:focus-visible{ outline:0; box-shadow:0 0 0 3px rgba(var(--accent-rgb),.18); } .sidebar__footerBottom{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; margin-top:8px; } .sidebar__footerBottom #planLabel, .sidebar__footerBottom #userNameLabel{ min-width:0; justify-content:flex-start; padding-inline:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .sidebar__footerBottom #planLabel{ color:var(--text); direction:rtl; text-align:right; } .sidebar__footerBottom #userNameLabel{ color:var(--muted); } @media (max-width: 460px){ .sidebar__footerBottom{ grid-template-columns:1fr; } } @media (max-width: 460px){ .footerControls__top{flex-direction:column;align-items:stretch} .footerActionsMini{flex:1 1 auto} #btnThemeToggle,#sessionTimer{width:100%} } /* When the viewport is medium (e.g. mobile/off-canvas sidebar on a wider screen), stack footer rows so the date/time ticker has enough width (prevents truncation). */ @media (max-width: 920px) and (min-width: 461px){ .footerControls__top{flex-direction:column;align-items:stretch} .footerMetaMini{order:1} .footerActionsMini{order:2;flex-direction:row;gap:10px;flex:1 1 auto} #btnThemeToggle,#sessionTimer{flex:1 1 0;min-width:0;width:auto} #btnThemeToggle .btn__text{white-space:nowrap} } /* On narrow sidebars, make the ticker a touch more compact to avoid truncation */ @media (max-width: 420px){ .clockTicker--ui .clockTicker__slide--jalali, .clockTicker--ui .clockTicker__slide--greg{font-size:11px} .clockTicker--ui .clockTicker__slide--time{font-size:20px} } .btn--icon{min-width:0;padding:6px 8px;border-radius:12px} /* Sidebar footer: make all chips/buttons the same height for a neat aligned look */ .sidebar__footer #btnThemeToggle, .sidebar__footer #sessionTimer, .sidebar__footer .clockTicker--ui{min-height:44px} .sidebar__footer #btnThemeToggle{height:44px;padding:0 10px;border-radius:14px} .sidebar__footer #sessionTimer{height:44px;border-radius:14px;padding:0 10px} .sidebar__footer .timerChip{height:44px;padding:0 10px;border-radius:14px} .sidebar__footer .btn--icon{width:44px;height:44px;padding:0;border-radius:14px} /* دکمه روز/شب و تایمر کمی جمع‌وجورتر شود تا جا برای ساعت/تاریخ باز شود */ #btnThemeToggle{min-width:84px;font-size:11.5px} #btnThemeToggle .btn__text{white-space:nowrap} #sessionTimer{display:inline-flex;align-items:center;gap:6px;min-width:84px;justify-content:center;text-align:center;direction:ltr} .timerChip{ padding:8px 10px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.03); color:var(--text); text-shadow:none; box-shadow:none; } .timerChip svg{width:16px;height:16px;flex:0 0 16px} html[data-theme="light"] .timerChip, body.theme-light .timerChip{ background:rgba(255,255,255,.92); box-shadow:0 10px 22px rgba(2,6,23,.06); } /* فیلدهای ناقص هنگام ذخیره */ .invalid{ border-color:rgba(239,68,68,.95) !important; box-shadow:0 0 0 3px rgba(239,68,68,.14) !important; } .nav__item{ position:relative; border:1px solid var(--border); background:rgba(255,255,255,.02); color:var(--text); padding:11px 12px; border-radius:16px; cursor:pointer; text-align:right; transition:.15s ease; display:flex; align-items:center; justify-content:space-between; gap:10px; } .nav__content{display:flex;align-items:center;gap:10px;min-width:0} .nav__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .nav__ico{width:18px;height:18px;flex:0 0 18px;opacity:.92} /* Official Tax Organization mark used for the Moadian list navigation item. The PNG is used as a CSS mask so it always inherits the exact icon color of the surrounding theme, just like the inline SVG icons. */ .taxOrgIcon{ display:inline-block; background-color:currentColor; -webkit-mask:url('/brand/tax-organization-mark-mask.png') center/100% 100% no-repeat; mask:url('/brand/tax-organization-mark-mask.png') center/100% 100% no-repeat; } .mobileMoreSheet__ico .taxOrgIcon--mobile{width:20px;height:20px} .nav__item:hover{transform:translateY(-1px);box-shadow:var(--shadow)} .nav__item::before{ content:""; position:absolute; left:10px; top:50%; transform:translateY(-50%); width:6px;height:6px; border-radius:999px; background:transparent; } .nav__item.is-active{ background:rgba(var(--accent-rgb),.16); border-color:rgba(var(--accent-rgb),.40); } .nav__item.is-active::before{ background:rgba(var(--accent-rgb),.95); box-shadow:0 0 0 6px rgba(var(--accent-rgb),.10); } /* --- Collapsible nav group (Account) --- */ .navGroup{display:flex;flex-direction:column;gap:6px} .navGroup__btn{ position:relative; border:1px solid var(--border); background:rgba(255,255,255,.02); color:var(--text); padding:11px 12px; border-radius:16px; cursor:pointer; text-align:right; transition:.15s ease; display:flex; align-items:center; justify-content:space-between; gap:10px; } /* Account group button should NOT show the left active dot */ .navGroup__btn::before{ display:none !important; } .navGroup__btn:hover{transform:translateY(-1px);box-shadow:var(--shadow)} .navGroup__chev{display:inline-flex;align-items:center;justify-content:center;opacity:.85;transition:.18s ease} .navGroup__chev{padding:6px;border-radius:12px;cursor:pointer;user-select:none} .navGroup__chev:hover{background:rgba(255,255,255,.04)} .navGroup__chev svg{width:16px;height:16px} .navGroup.is-open .navGroup__chev{transform:rotate(-90deg)} .navGroup:not(.is-open) .navGroup__chev{transform:rotate(90deg)} .navGroup.has-active .navGroup__btn{ background:rgba(var(--accent-rgb),.10); border-color:rgba(var(--accent-rgb),.32); } /* Tree look: dotted vertical line + dotted branches (RTL-friendly) */ .navTree{ position:relative; display:flex; flex-direction:column; justify-content:flex-start; gap:6px; margin-top:2px; padding-right:26px; } .navTree::before{ content:""; position:absolute; right:12px; top:8px; bottom:8px; border-right:1px dashed rgba(148,163,184,.55); pointer-events:none; } .nav__item--sub{ border-radius:14px; padding:10px 12px; font-size:13px; } .nav__item--sub .nav__ico{width:16px;height:16px;flex:0 0 16px} /* The official mark is visually denser than line icons, so its box is slightly larger to match their perceived size without changing row alignment. */ .nav__item--sub .nav__ico.taxOrgIcon{width:18px;height:18px;flex:0 0 18px} /* replace the default left dot with a tree node on the right */ .nav__item--sub::before{ content:""; position:absolute; left:auto; right:-17px; top:50%; transform:translateY(-50%); width:6px;height:6px; border-radius:999px; background:rgba(148,163,184,.85); } .nav__item--sub::after{ content:""; position:absolute; left:auto; right:-17px; top:50%; transform:translateY(-50%); width:17px; border-top:1px dashed rgba(148,163,184,.55); } .nav__item--sub.is-active::before{ background:rgba(var(--accent-rgb),.95); box-shadow:0 0 0 6px rgba(var(--accent-rgb),.10); } .nav__item--sub.is-active::after{ border-top-color: rgba(var(--accent-rgb),.65); } html[data-theme="light"] .navTree::before, body.theme-light .navTree::before{ border-right-color: rgba(11,92,255,.28); } html[data-theme="light"] .nav__item--sub::before, body.theme-light .nav__item--sub::before{ background: rgba(11,92,255,.35); } html[data-theme="light"] .nav__item--sub::after, body.theme-light .nav__item--sub::after{ border-top-color: rgba(11,92,255,.28); } @media (max-width: 980px){ .navTree{ padding-right:22px; } .navTree::before{ right:10px; } .nav__item--sub::before, .nav__item--sub::after{ right:-15px; } .nav__item--sub::after{ width:15px; } } .page{margin-bottom:18px} .page[hidden]{display:none} h1{margin:0 0 12px;font-size:18px} .card h3{margin:10px 0 8px;font-size:14px;color:var(--text)} hr{border:none;border-top:1px solid var(--border);margin:12px 0} .check{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:12px} .check input{width:auto} /* prevent base input styles from affecting checkboxes in check labels */ .check input[type="checkbox"]{width:46px} .right{justify-content:flex-end} .modal{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center} .modal[hidden]{display:none} .modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55)} .modal__panel{position:relative;z-index:1;background:rgba(15,25,48,.96);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);width:min(920px, calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto} .modal__header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 14px;border-bottom:1px solid var(--border)} .modal__body{padding:14px} /* inputs inside tables */ .table input.in{min-width:120px} /* ---- Compact message modal + status bar ---- */ #msgModal .modal__panel--sm{ width:min(640px, calc(100vw - 24px)); } #msgModal .modal__header{ padding:10px 12px; } #msgModal .modal__body{ padding:10px 12px; } #msgModal #msgTitle{ font-weight:800; font-size:14px; } #msgModal #msgText{ font-size:13px; padding:10px 10px; border-radius:12px; } .statusbar{ transition:opacity .22s ease, transform .22s ease; position:fixed; left:50%; bottom:12px; transform:translateX(-50%); z-index:55; border:1px solid var(--border); background:rgba(255,255,255,.05); color:var(--text); padding:8px 12px; border-radius:999px; box-shadow:var(--shadow); font-size:12px; display:flex; align-items:center; gap:8px; max-width:min(92vw, 720px); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .statusbar--ok{ background:rgba(34,197,94,.10); } .statusbar--err{ background:rgba(239,68,68,.10); } /* Statusbar light theme contrast */ :root[data-theme="light"] .statusbar, html.theme-light .statusbar, body.theme-light .statusbar{ background:rgba(15,23,42,.92); border-color:rgba(15,23,42,.18); color:rgba(255,255,255,.92); box-shadow:0 12px 28px rgba(2,6,23,.18); } :root[data-theme="light"] .statusbar--ok, html.theme-light .statusbar--ok, body.theme-light .statusbar--ok{ background:rgba(22,163,74,.92); border-color:rgba(22,163,74,.38); color:#fff; } :root[data-theme="light"] .statusbar--err, html.theme-light .statusbar--err, body.theme-light .statusbar--err{ background:rgba(220,38,38,.92); border-color:rgba(220,38,38,.40); color:#fff; } /* خطاها بدون کپسول پس‌زمینه نمایش داده شوند */ .statusbar.statusbar--err{ background:transparent !important; border-color:transparent !important; box-shadow:none !important; border-radius:8px !important; color:#fca5a5 !important; text-shadow:0 1px 8px rgba(0,0,0,.45); font-weight:900; white-space:normal; text-align:center; justify-content:center; } :root[data-theme="light"] .statusbar.statusbar--err, html.theme-light .statusbar.statusbar--err, body.theme-light .statusbar.statusbar--err{ background:transparent !important; border-color:transparent !important; box-shadow:none !important; color:#dc2626 !important; text-shadow:none; } /* SelectX (کشوی سفارشی برای خوانایی در حالت شب/روز) */ .selectx{ position:relative; display:block; width:100%; } .selectx-native{ position:absolute; inset:0; opacity:0; pointer-events:none; } .selectx-btn{ width:100%; min-height:40px; border:1px solid var(--border); background:rgba(255,255,255,.04); color:var(--text); border-radius:12px; padding:10px 38px 10px 12px; text-align:right; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:10px; box-shadow:var(--shadow-in); } .selectx-btn.is-bad{ border-color:rgba(239,68,68,.65); } .selectx-btn.is-bad:focus{ outline:2px solid rgba(239,68,68,.35); } .selectx-btn:focus{ outline:2px solid rgba(59,130,246,.35); outline-offset:2px; } .selectx-label{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .selectx-caret{ width:18px; height:18px; flex:0 0 18px; opacity:.9; } .selectx-menu{ position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:80; border:1px solid var(--border); background:var(--panel); color:var(--text); border-radius:12px; box-shadow:var(--shadow); max-height:300px; overflow:auto; padding:6px; } .selectx-menu--portal{ z-index:100000 !important; margin:0; } .selectx-item{ padding:9px 10px; border-radius:10px; cursor:pointer; user-select:none; } .selectx-item:hover{ background:rgba(255,255,255,.06); } .selectx-item.is-selected{ background:rgba(59,130,246,.25); } .selectx-item.is-disabled{ opacity:.45; cursor:not-allowed; } .selectx-item--hasAction{ display:flex; align-items:center; justify-content:space-between; gap:10px; } .selectx-itemAction{ display:grid; place-items:center; flex:0 0 34px; width:34px; height:34px; padding:0; border:1px solid color-mix(in srgb,var(--accent) 48%,var(--border) 52%); border-radius:9px; background:color-mix(in srgb,var(--accent) 18%,transparent); color:color-mix(in srgb,var(--accent) 72%,#fff 28%); font:800 20px/1 inherit; cursor:pointer; } .selectx-itemAction:hover{ background:color-mix(in srgb,var(--accent) 28%,transparent); } .accountingEntryTabs--top{ margin:0 0 16px; padding-top:0; } .accountingEntryUnavailable{ min-height:260px; display:grid; place-items:center; align-content:center; gap:10px; padding:36px 20px; text-align:center; } .accountingEntryUnavailable__icon{ display:grid; place-items:center; width:46px; height:46px; border:1px solid color-mix(in srgb,var(--accent) 38%,var(--border) 62%); border-radius:13px; background:color-mix(in srgb,var(--accent) 14%,transparent); color:color-mix(in srgb,var(--accent) 72%,#fff 28%); font-size:26px; font-weight:800; } .accountingEntryUnavailable h2{ margin:4px 0 0; font-size:18px; } .accountingEntryUnavailable p{ max-width:560px; margin:0; color:var(--muted); line-height:1.9; } .accountingEntryUnavailable .btn{ margin-top:8px; } /* SelectX search (for long lists like countries/cities) */ .selectx-searchWrap{ position:sticky; top:0; z-index:1; background:var(--panel); padding:6px; margin:-6px -6px 6px; border-bottom:1px solid var(--border); border-top-left-radius:12px; border-top-right-radius:12px; } .selectx-search{ width:100%; border:1px solid var(--border); border-radius:10px; padding:8px 10px; background:rgba(255,255,255,.04); color:var(--text); box-shadow:var(--shadow-in); font-size:12px; outline:none; } .selectx-search:focus{ outline:2px solid rgba(59,130,246,.35); outline-offset:2px; } .selectx-items{ display:block; } /* Inline success message under forms */ .formmsg{ margin-top:10px; padding:8px 10px; border-radius:12px; border:1px solid var(--border); font-size:12px; line-height:1.6; } .formmsg--ok{ background:rgba(34,197,94,.10); } .formmsg--err{ background:rgba(239,68,68,.10); } /* ---- WP Announcements ---- */ .wpAnn{ position:fixed; top:12px; left:24px; z-index:100; width:min(360px, 92vw); border:1px solid var(--border); background:rgba(255,255,255,.06); border-radius:16px; box-shadow:var(--shadow); overflow:hidden; backdrop-filter: blur(6px); } .wpAnn__head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 10px; border-bottom:1px solid var(--border); } .wpAnn__title{ font-weight:800; font-size:12px; } .wpAnn__headActions{ display:flex; align-items:center; gap:6px; } .wpAnn__readAll, .wpAnn__pushToggle, .wpAnn__readBtn{ border:1px solid var(--border); border-radius:10px; background:rgba(255,255,255,.05); color:var(--text); cursor:pointer; font-size:11px; padding:5px 8px; line-height:1.2; } .wpAnn__readAll:hover, .wpAnn__pushToggle:hover, .wpAnn__readBtn:hover{ background:rgba(255,255,255,.09); } .wpAnn__readState{ font-size:11px; color:var(--muted); white-space:nowrap; } .wpAnn__itemActions{ display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; } .wpAnn__item--read{ opacity:.72; } .wpAnn__item--unread{ box-shadow:inset 3px 0 0 rgba(255,80,80,.7); } .wpAnn__close{ width:28px; height:28px; border-radius:10px; border:1px solid var(--border); background:transparent; color:var(--text); cursor:pointer; } .wpAnn__close:hover{ background:rgba(255,255,255,.06); } .wpAnn__list{ padding:8px 10px; display:flex; flex-direction:column; gap:8px; } .wpAnn__item{ border:1px solid var(--border); border-radius:12px; padding:8px 10px; background:rgba(0,0,0,.10); } .wpAnn__item--warning{ background:rgba(245,158,11,.10); } .wpAnn__item--error{ background:rgba(239,68,68,.10); } .wpAnn__itemTitle{ font-weight:800; font-size:12px; margin-bottom:4px; } .wpAnn__itemMsg{ font-size:12px; color:var(--text); line-height:1.6; white-space:pre-wrap; } .wpAnn__itemMeta{ margin-top:6px; display:flex; justify-content:space-between; align-items:center; gap:10px; } .wpAnn__itemTime{ font-size:11px; color:var(--muted); } .wpAnn__itemLink{ font-size:11px; color:var(--link); text-decoration:none; } .wpAnn__itemLink:hover{ text-decoration:underline; } /* ---- Announcement bell ---- */ .annBell{ position:fixed; top:12px; left:24px; z-index:120; width:48px; height:48px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.06); color:var(--text); display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:var(--shadow); backdrop-filter: blur(6px); } .annBell:hover{background:rgba(255,255,255,.09)} .annBell__icon{display:flex; align-items:center; justify-content:center; line-height:1} .annBell__icon svg{display:block; fill:currentColor} .annBell__badge{ position:absolute; top:6px; left:6px; min-width:20px; height:20px; padding:0 6px; border-radius:999px; background:rgba(255,80,80,.95); color:white; font-size:11px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(0,0,0,.2); } .wpAnn{ top:58px; /* فاصله برای دکمه اعلان */ z-index:110; } .wpAnn__ticon{margin-left:6px; display:inline-flex; align-items:center} .wpAnn__ticon svg{display:block; fill:currentColor} /* ---- Pagination + bulk actions ---- */ .pager{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; flex-wrap:wrap; } .pager__left,.pager__right{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .pager__btn{ padding:6px 10px; border-radius:10px; border:1px solid var(--border); background:rgba(255,255,255,.04); color:var(--text); cursor:pointer; font-size:12px; } .pager__btn:hover{background:rgba(255,255,255,.07)} .pager__btn[disabled]{opacity:.45;cursor:not-allowed} .pager__num{min-width:34px;text-align:center} .pager__nums{display:flex;gap:6px;flex-wrap:wrap} .pager__btn.is-active{background:rgba(90,200,250,.18);border-color:rgba(90,200,250,.35)} .bulkbar{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; padding-top:8px; border-top:1px dashed var(--border); flex-wrap:wrap; } .bulkbar__left,.bulkbar__right{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .checkbox{width:16px;height:16px;accent-color:#60c6ff} .smallmuted{color:var(--muted);font-size:12px} .form label.span2{grid-column:1/-1} .selectx{min-height:40px} .form input,.form select,.form textarea{width:100%} .actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:flex-start;margin-top:10px} .form>.row{grid-column:1/-1;justify-content:flex-start} .form>.actions{grid-column:1/-1} .actions.actions--end{justify-content:flex-end} /* گزارش */ .reportCard{ margin-bottom:14px; position:relative; overflow:hidden; } .reportCard::before{ content:""; position:absolute; inset:-2px; background: radial-gradient(800px 260px at 70% -20%, rgba(var(--accent-rgb),.22), transparent 55%), radial-gradient(560px 220px at 20% 10%, rgba(34,197,94,.10), transparent 60%); pointer-events:none; } .reportCard > *{ position:relative; } /* گزارش: تیتر + تولبار جدید */ .reportTop{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; padding-bottom:10px; border-bottom:1px solid rgba(148,163,184,.14); } .reportTitle{min-width:240px} .reportTitle__h{margin:0;font-size:18px;font-weight:900} .reportTitle__sub{margin-top:4px;max-width:58ch} .reportToolbar{ align-items:flex-end; } .reportToolbar .filter-mini__fields{ align-items:flex-end; } .reportHint{ margin-top:12px; } .reportHead{ justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; padding-bottom:10px; border-bottom:1px solid rgba(148,163,184,.14); } .reportHead__title{margin:0;font-size:18px;font-weight:900} .reportHead__controls{ gap:10px; align-items:center; flex-wrap:wrap; padding:8px 10px; border-radius:16px; border:1px solid rgba(148,163,184,.18); background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); } .repSel{width:auto;min-width:120px} .reportStats{margin-top:12px} @media (min-width: 1100px){ /* به جای ۲×۲، چهار کارت در یک ردیف */ .reportStats{ grid-template-columns:repeat(4, 1fr) !important; } } .statBox{ border:1px solid rgba(148,163,184,.18); background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); border-radius:18px; padding:12px 12px; box-shadow: 0 10px 28px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.06); } .statBox__label{color:var(--muted);font-size:12px} .statBox__value{font-size:20px;font-weight:900;margin-top:6px;letter-spacing:.2px} .reportCharts{margin-top:12px} .chartBox{ border:1px solid rgba(148,163,184,.18); background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)); border-radius:20px; padding:12px 12px; box-shadow: 0 10px 28px rgba(0,0,0,.10); } .chartBox__title{margin:0 0 10px 0;font-size:14px;color:var(--text);font-weight:900} .chartBox canvas{width:100%;height:260px;display:block} .legend{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px} .legend__item{ display:flex; align-items:center; gap:8px; font-size:12px; color:var(--muted); padding:6px 10px; border-radius:999px; border:1px solid rgba(148,163,184,.16); background:rgba(255,255,255,.03); } .legend__dot{width:10px;height:10px;border-radius:50%} /* گزارش در حالت روشن */ html[data-theme="light"] .reportHead__controls, body.theme-light .reportHead__controls{ background:linear-gradient(180deg, rgba(2,6,23,.02), rgba(2,6,23,.01)); border-color: rgba(15,23,42,.10); box-shadow: inset 0 1px 0 rgba(255,255,255,.92); } html[data-theme="light"] .statBox, body.theme-light .statBox{ background:#ffffff; border-color: rgba(15,23,42,.10); box-shadow: 0 10px 28px rgba(2,6,23,.06); } html[data-theme="light"] .chartBox, body.theme-light .chartBox{ background:#ffffff; border-color: rgba(15,23,42,.10); box-shadow: 0 10px 28px rgba(2,6,23,.06); } /* ---------------- داشبورد ---------------- */ .dashGrid{align-items:start} .dashCardHead{justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px} .dashStats{margin-top:10px} .dashChartBox{margin-top:14px} .dashCounters{gap:8px;flex-wrap:wrap} .pill{ display:inline-flex;align-items:center;gap:6px; padding:6px 10px;border-radius:999px; background:rgba(255,255,255,.06); border:1px solid var(--border); color:var(--muted); font-size:12px; } .pill b{color:var(--text);font-weight:800} .pill--warn{background:rgba(255,90,95,.10);border-color:rgba(255,90,95,.22)} .eventList{display:flex;flex-direction:column;gap:10px;max-height:420px;overflow:auto;padding-left:2px} .eventItem{ border:1px solid var(--border); background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)); border-radius:12px; padding:10px 12px; box-shadow:0 8px 22px rgba(0,0,0,.14); } .eventItem__title{font-weight:800;margin-bottom:4px} .eventItem__msg{color:var(--text);opacity:.92;line-height:1.6} .eventItem__meta{margin-top:6px;color:var(--muted);font-size:12px} .eventItem--info{border-right:3px solid var(--accent2)} .eventItem--warn{border-right:3px solid rgba(255,255,255,.22)} .eventItem--error{border-right:3px solid var(--danger)} .dashQuick{justify-content:flex-end;margin-top:10px;gap:8px;flex-wrap:wrap} .topItems{display:flex;flex-direction:column;gap:8px} .topItem{ display:flex;justify-content:space-between;align-items:center;gap:10px; padding:8px 10px;border-radius:12px; border:1px solid var(--border); background:rgba(255,255,255,.04); } .topItem__name{font-weight:800} .topItem__meta{color:var(--muted);font-size:12px;margin-top:2px} .topItem__val{font-weight:900;white-space:nowrap} /* --- Invoice list toolbar (2 rows) --- */ .inv-toolbar2{ display:flex; flex-direction:column; gap:10px; } .inv-toolbar2__row{ display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; } .inv-toolbar2__row--top{ padding-bottom:8px; border-bottom:1px solid rgba(255,255,255,.06); } html[data-theme="light"] .inv-toolbar2__row--top, body.theme-light .inv-toolbar2__row--top{ border-bottom-color:rgba(15,23,42,.10); } /* Top row: search / status / sort / dir */ .inv-toolbar2__row--top .invtf{min-width:160px;flex:0 0 auto} .inv-toolbar2__row--top .invtf--search{min-width:260px;flex:1 1 320px} .inv-toolbar2__row--top .invtf--sort{min-width:190px} .inv-toolbar2__row--top .invtf--dir{min-width:110px} /* Bottom row: date range + actions */ .inv-toolbar2__row--bottom{justify-content:space-between} .inv-dates{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap} .inv-toolbar2__row--bottom .invtf--date{min-width:170px;flex:0 0 auto} /* Make labels compact (and override any form label "pill" styles) */ .inv-toolbar2 label{ display:flex; flex-direction:column; gap:6px; white-space:nowrap; font-size:11px; padding:0 !important; border:0 !important; background:transparent !important; box-shadow:none !important; } .inv-toolbar2 .input--sm{padding:7px 10px;border-radius:10px;font-size:12px;height:36px;line-height:1.2;box-sizing:border-box} .inv-actions{display:flex;gap:8px;align-items:flex-end;flex:0 0 auto;direction:ltr} .inv-actions .btn{white-space:nowrap} /* --- Upload progress modal --- */ .uploadModal{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center} .uploadModal[hidden]{display:none} .uploadModal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45)} .uploadModal__panel{position:relative;z-index:1;width:min(520px,92vw);background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:0 18px 50px rgba(0,0,0,.25);padding:14px 14px 12px} .uploadModal__title{font-weight:800;margin-bottom:10px} .uploadModal__bar{height:12px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);overflow:hidden} html[data-theme="light"] .uploadModal__bar, body.theme-light .uploadModal__bar{background:rgba(15,23,42,.06);border-color:rgba(15,23,42,.08)} .uploadModal__barFill{height:100%;background:rgba(99,102,241,.9)} .uploadModal__meta{margin-top:8px;font-size:12px;color:var(--muted);display:flex;justify-content:flex-end} /* --- Invoice form layout (tidy) --- */ .inv-formgrid{ display:grid; grid-template-columns: 1fr 1fr; gap:16px; } .inv-col{ border:1px solid var(--border); border-radius:14px; padding:12px; background:rgba(255,255,255,0.02); } .sec-title{ font-weight:800; font-size:14px; margin:0 0 10px 0; } @media (max-width: 980px){ .inv-formgrid{ grid-template-columns:1fr; } } /* Invoice Excel preview modal */ .invPrevPanel{ width:min(1100px, calc(100vw - 24px)); max-height:88vh; overflow:auto; } .invPrevActions{ justify-content:flex-start; align-items:center; gap:10px; margin-bottom:10px; } .invPrevTitle{ font-weight:800; font-size:16px; margin-bottom:2px; } .invPrevTable .in.in--sm{ min-width:110px; height:28px; padding:4px 6px; font-size:12px; } .invPrevRow--err td{ background: rgba(255, 73, 73, .08); } #errListModal .table td{ vertical-align: top; } .errListToolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap} .errListPager{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .btn--iconOnly{min-width:32px;width:32px;height:32px;padding:0;display:inline-flex;align-items:center;justify-content:center} .btn--iconOnly .btn__ico svg{width:16px;height:16px} .opActions--mini .btn--iconOnly{min-width:32px;width:32px;padding:0} /* ---------------- Mobile polish & responsive layout ---------------- */ .mobMenuBtn{ display:none; position:fixed; top:12px; right:12px; z-index:220; width:44px; height:44px; border-radius:14px; border:1px solid var(--border); background:rgba(255,255,255,.06); color:var(--text); box-shadow:var(--shadow); cursor:pointer; } .sidebarScrim{ position:fixed; inset:0; z-index:210; /* a bit less "foggy" */ background:rgba(0,0,0,.46); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); } @media (max-width: 980px){ /* Use an off-canvas sidebar instead of pushing content down */ .mobMenuBtn{display:inline-flex;align-items:center;justify-content:center} .layout{display:block} .main{padding:64px 12px 28px} .sidebar{ position:fixed; top:0; bottom:0; right:0; height:100dvh; width:min(340px, 88vw); transform:translateX(110%); transition:transform .18s ease; z-index:215; /* Keep mobile navigation readable over dense page content. */ background:#080f20; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); /* prevent the sidebar scrollbar; nav itself scrolls */ overflow:hidden; border-left:1px solid var(--border); border-right:0; box-shadow:var(--shadow); } html[data-theme="light"] .sidebar, body.theme-light .sidebar{ background:#fff; } /* slightly more solid menu items on mobile */ .sidebar .nav__item, .sidebar .navGroup__btn{ background: rgba(255,255,255,.035); } html[data-theme="light"] .sidebar .nav__item, html[data-theme="light"] .sidebar .navGroup__btn, body.theme-light .sidebar .nav__item, body.theme-light .sidebar .navGroup__btn{ background: rgba(2,6,23,.03); } .sidebar.is-open{ transform:translateX(0); } body.sidebar-open{ overflow:hidden; } } /* IMPORTANT: There is a later rule `html[data-theme="dark"] .sidebar{ background: rgba(15,23,42,.78) }` which overrides the mobile sidebar background and makes it too transparent. Make mobile dark sidebar/scrim more solid with equal (or higher) specificity. */ @media (max-width: 980px){ html[data-theme="dark"] .sidebar{ background:#080f20; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); } html[data-theme="dark"] .sidebarScrim{ /* slightly more transparent than before */ background: rgba(0,0,0,.58); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); } } @media (max-width: 640px){ .card{padding:12px} h1{font-size:16px} .brand{font-size:18px} /* Prevent iOS input zoom + improve tap targets */ input, select, textarea{ font-size:16px; } .input--sm{ font-size:16px; height:44px; } .btn{ padding:12px 12px; } .btn.btn--sm{ padding:8px 10px; } .btn.btn--xs{ padding:6px 8px; min-height:32px; } /* Stack key/value grids */ .kv{ grid-template-columns:1fr; } .kv b{ color:var(--muted); font-weight:700; } /* Toolbars: each filter full width */ .inv-toolbar2__row--top .invtf, .inv-toolbar2__row--top .invtf--search, .inv-toolbar2__row--top .invtf--sort, .inv-toolbar2__row--top .invtf--dir{ min-width:100% !important; flex:1 1 100% !important; } /* Date range (Invoices + Jobs): keep From/To side-by-side on mobile */ .inv-toolbar2__row--bottom .inv-dates{ width:100%; display:grid; grid-template-columns: 1fr 1fr; gap:10px; align-items:end; } .inv-toolbar2__row--bottom .inv-dates .invtf--date{ min-width:0 !important; flex:0 0 auto !important; width:100%; } .inv-actions{ width:100%; justify-content:stretch; flex-wrap:wrap; } .inv-actions .btn{ flex:1 1 46%; } /* Rows with many buttons */ .row{ align-items:stretch; } .row > .btn{ flex:1 1 46%; } /* But keep table operation buttons compact */ .opsRow{ align-items:center; } .opsRow > .btn{ flex:0 0 auto !important; } /* Tables: readable and scrollable */ .table{ font-size:12px; } .table th,.table td{ padding:8px 6px; } } /* In very narrow screens, keep date range readable but still paired */ @media (max-width: 360px){ .inv-toolbar2__row--bottom .inv-dates{ gap:8px; } } /* ---------------- Inspired light UI (blue + pill) ---------------- */ html[data-theme="light"] body{ background: linear-gradient(180deg, var(--bg) 0%, var(--bg2) 100%); } html[data-theme="light"] .sidebar{ background: rgba(255,255,255,.94); border-left-color: rgba(15,23,42,.10); box-shadow: 0 14px 44px rgba(2,6,23,.10); } html[data-theme="light"] .card{ background: #ffffff; border-color: rgba(15,23,42,.10); box-shadow: 0 14px 44px rgba(2,6,23,.10); backdrop-filter: none; } html[data-theme="light"] label{ color: rgba(15,23,42,.70); font-weight: 700; } html[data-theme="light"] .form label:not(.check){ padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; } html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html[data-theme="light"] select, html[data-theme="light"] textarea, body.theme-light input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), body.theme-light select, body.theme-light textarea{ background: rgba(11,92,255,.06); border-color: rgba(11,92,255,.18); border-radius: 18px; padding: 12px 14px; box-shadow: none; } html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover, html[data-theme="light"] select:hover, html[data-theme="light"] textarea:hover{ border-color: rgba(11,92,255,.28); } html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus, html[data-theme="light"] select:focus, html[data-theme="light"] textarea:focus{ border-color: rgba(11,92,255,.55); box-shadow: 0 0 0 4px rgba(11,92,255,.14); background: rgba(11,92,255,.08); } html[data-theme="light"] .btn{ display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; padding: 0 16px; border-radius: 16px; border: 1px solid rgba(11,92,255,.85); background: #0b5cff; color: #ffffff; font-weight: 800; box-shadow: 0 10px 22px rgba(11,92,255,.18); transition: transform .12s ease, filter .12s ease, box-shadow .12s ease, background .12s ease; } html[data-theme="light"] .btn:hover{ filter: brightness(1.03); } html[data-theme="light"] .btn:active{ transform: translateY(1px); box-shadow: 0 8px 18px rgba(11,92,255,.18); } html[data-theme="light"] .btn--sm{ min-height: 36px; padding: 0 10px; border-radius: 12px; font-size: 12px; } html[data-theme="light"] .btn--ghost{ background: rgba(255,255,255,.86); color: #0b5cff; border-color: rgba(11,92,255,.32); box-shadow: 0 8px 16px rgba(2,6,23,.05); } html[data-theme="light"] .btn--ghost:hover{ background: rgba(11,92,255,.10); } html[data-theme="light"] .btn--ghost:active{ transform: translateY(1px); box-shadow: 0 6px 12px rgba(2,6,23,.05); } html[data-theme="light"] .btn--danger{ border-color: rgba(239,68,68,.70); background: rgba(239,68,68,.92); box-shadow: 0 10px 22px rgba(239,68,68,.16); } html[data-theme="light"] .nav__item{ border-radius: 16px; background: rgba(11,92,255,.05); border-color: rgba(11,92,255,.12); color: #0b5cff; font-weight: 700; } html[data-theme="light"] .nav__item.is-active{ background: rgba(11,92,255,.12); border-color: rgba(11,92,255,.35); color: #0b5cff; } html[data-theme="light"] .nav__item:hover{ background: rgba(11,92,255,.08); } html[data-theme="light"] .filter-mini{ border-color: rgba(15,23,42,.10); background: #ffffff; box-shadow: none; border-radius: 18px; } html[data-theme="light"] .statusbar{ background: rgba(255,255,255,.92); } html[data-theme="light"] .mobMenuBtn{ background: rgba(255,255,255,.92); border-color: rgba(15,23,42,.10); } /* Dark mode: hamburger button was too transparent */ html[data-theme="dark"] .mobMenuBtn{ /* Match the announcement bell: slightly frosted, not fully opaque */ background: rgba(255,255,255,.08); border-color: rgba(148,163,184,.22); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); } /* ---------------- Inspired dark UI (blue + pill) ---------------- */ html[data-theme="dark"] body{ background: linear-gradient(180deg, var(--bg) 0%, var(--bg2) 100%); } html[data-theme="dark"] .sidebar{ background: rgba(15,23,42,.78); border-left-color: rgba(148,163,184,.18); box-shadow: 0 18px 60px rgba(0,0,0,.35); } html[data-theme="dark"] .card{ background: rgba(15,23,42,.55); border-color: rgba(148,163,184,.18); box-shadow: 0 18px 60px rgba(0,0,0,.28); } html[data-theme="dark"] label{ color: rgba(255,255,255,.70); font-weight: 700; } html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html[data-theme="dark"] select, html[data-theme="dark"] textarea{ background: rgba(255,255,255,.04); border-color: rgba(148,163,184,.18); border-radius: 18px; padding: 12px 14px; box-shadow: none; } html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus, html[data-theme="dark"] select:focus, html[data-theme="dark"] textarea:focus{ border-color: rgba(var(--accent-rgb),.55); box-shadow: 0 0 0 4px rgba(var(--accent-rgb),.16); background: rgba(var(--accent-rgb),.08); } html[data-theme="dark"] .btn{ min-height: 46px; padding: 0 16px; border-radius: 16px; border-color: rgba(var(--accent-rgb),.78); background: #0b5cff; box-shadow: 0 12px 26px rgba(var(--accent-rgb),.16); font-weight: 800; } html[data-theme="dark"] .btn--sm{ min-height: 36px; padding: 0 10px; border-radius: 12px; font-size: 12px; } html[data-theme="dark"] .btn--ghost{ background: rgba(255,255,255,.03); color: #9cc0ff; border-color: rgba(var(--accent-rgb),.26); box-shadow: none; } html[data-theme="dark"] .btn--ghost:hover{ background: rgba(var(--accent-rgb),.10); } html[data-theme="dark"] .nav__item{ background: rgba(255,255,255,.02); border-color: rgba(148,163,184,.16); } html[data-theme="dark"] .nav__item:hover{ background: rgba(var(--accent-rgb),.08); } html[data-theme="dark"] .nav__item.is-active{ background: rgba(var(--accent-rgb),.16); border-color: rgba(var(--accent-rgb),.38); } /* ---------------- Layout Optimization (v22) ---------------- */ .page{ max-width:1220px; margin:0 auto 18px; } /* Page header */ .pageHead{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; flex-wrap:wrap; } .pageHead h1{ margin:0; } .pageHead__hint{ margin-bottom:2px; } /* Generic vertical stack */ .stack{ display:grid; gap:14px; } /* Invoice (Send) page layout */ .sendGrid{ display:grid; grid-template-columns: 1.7fr .9fr; gap:14px; align-items:start; } .sendMain{ min-width:0; } .sendSide{ min-width:0; } .sendCard{ overflow:visible; } /* Standard invoice layout (Send) */ .sendStd{ display:grid; gap:14px; } .sendStd__top{ display:grid; grid-template-columns: 1.1fr .9fr; /* first col is right in RTL */ gap:14px; align-items:start; } .sendHeaderGrid{ display:grid; grid-template-columns: 1.1fr .9fr; /* first col is right in RTL */ gap:14px; } .sendMetaCard{ justify-self:center; width:min(980px, 100%); } .sendStd__bottom{ display:grid; grid-template-columns: 1.7fr .9fr; /* lines right, left column for pay/totals */ gap:14px; align-items:start; } .sendStd__left{ display:grid; gap:14px; min-width:0; } @media (max-width: 980px){ .sendStd__top, .sendHeaderGrid, .sendStd__bottom{ grid-template-columns:1fr; } .sendMetaCard{ width:100%; justify-self:stretch; } } /* Invoice (Send) - POS inspired layout (v34) */ .sendLayout{ display:grid; gap:14px; align-items:start; } .sendLayout--pos{ /* چیدمان استاندارد (الهام‌گرفته از فرم‌های POS): ردیف ۱: مشخصات فاکتور (راست) + نوع/الگو (چپ) ردیف ۲: خریدار (تمام‌عرض) ردیف ۳: اقلام (تمام‌عرض) ردیف ۴: محاسبات (راست) + پرداخت (چپ) */ /* در RTL، ستون اول = سمت راست */ gap:12px; align-items:start; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); grid-template-areas: "header meta" "buyer buyer" "lines lines" "totals pay"; } .sendArea--buyer{ grid-area: buyer; min-width:0; } .sendArea--header{ grid-area: header; min-width:0; } .sendArea--meta{ grid-area: meta; min-width:0; } .sendArea--lines{ grid-area: lines; min-width:0; } .sendArea--pay{ grid-area: pay; min-width:0; } .sendArea--totals{ grid-area: totals; min-width:0; } .sendArea--help{ grid-area: help; min-width:0; } /* اقلام وسط صفحه (در دسکتاپ) */ .sendLayout--pos .sendArea--lines{ justify-self:center; width:min(1320px, 100%); } /* نوع/الگو در بالا (ستون راست) باید هم‌قد با بقیه کارت‌ها باشد */ .sendLayout--pos .sendMetaCard{ justify-self:stretch; width:100%; } /* top header grid (inside card) */ .invHeaderGrid{ display:grid; /* دو ستون هم‌قد + اجازه‌ی کوچک شدن برای جلوگیری از بیرون‌زدگی */ grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap:12px; margin-top:10px; } /* جلوگیری از بیرون‌زدگی اجزاء داخل کارت «مشخصات فاکتور» */ .invHeaderGrid > *{ min-width:0; } .invHeaderGrid .form:not(.form--pro){ grid-template-columns: 1fr; } /* فرم‌های جمع‌وجورتر برای هدر فاکتور (شماره/تاریخ/ساعت و موضوع/فروشنده) */ .invHdrPro{ gap:10px 12px; } .invHdrPro label{ min-width:0; } /* در عرض‌های متوسط موبایل/تبلت: شماره تمام‌عرض، تاریخ/ساعت کنار هم */ @media (max-width: 820px){ .invHdrPro > label.col-5{ grid-column: span 12 !important; } .invHdrPro > label.col-4, .invHdrPro > label.col-3{ grid-column: span 6 !important; } } @media (min-width: 981px){ .invHeaderGrid .grid2{ grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } } .grid2--tight{ gap:10px; } .grid3--tight{ gap:10px; } /* meta (type + pattern) */ .metaRow{ margin-top:10px; } .metaRow.form--pro{ gap:10px 12px; } /* جدول اقلام باید همیشه داخل خودش اسکرول افقی داشته باشد */ .sendCard .tableWrap{ overflow:auto; } .sendMetaCard{ justify-self:center; width:min(980px, 100%); } /* spacing inside areas */ .sendLayout--pos .buyerBar{ margin-top:8px; } .sendLayout--pos #buyerBox{ margin-top:8px; } .sendLayout--pos .tableWrap{ margin-top:8px; } .sendLayout--pos .totals--side{ margin-top:8px; } .sendLayout--pos .sendActions{ margin-top:8px; } .sendLayout--pos #headerExtraFields, .sendLayout--pos #paymentsFields{ margin-top:8px; } /* کمی جمع‌وجورتر کردن کارت‌های ثبت فاکتور (فقط همین صفحه) */ .sendLayout--pos .sendCard{ padding:12px; } .sendLayout--pos .inv-col{ padding:10px; border-radius:14px; } .sendLayout--pos .sec-title{ font-size:12px; margin-bottom:8px; } /* باکس اطلاعات خریدار: حذف فاصله‌ی اضافی و جمع‌وجورتر */ .sendLayout--pos #buyerBox .kv{ margin-top:0; grid-template-columns:120px 1fr; gap:6px 10px; align-items:baseline; } /* Help inside totals card */ .sendHelpDetails{ margin-top:12px; } .sendHelpDetails > summary{ cursor:pointer; list-style:none; user-select:none; font-weight:700; } .sendHelpDetails > summary::-webkit-details-marker{ display:none; } .sendHelpDetails > summary:after{ content:"▾"; display:inline-block; margin-right:8px; transform: translateY(-1px); opacity:.75; } .sendHelpDetails[open] > summary:after{ content:"▴"; } /* keep the wide items table scroll nicely */ .sendArea--lines .table{ min-width: 980px; } /* actions: 2 columns on desktop, 1 column on small screens */ .sendActions{ display:grid; grid-template-columns: 1fr 1fr; gap:10px; } .sendActions .btn{ width:100%; } @media (max-width: 980px){ .sendLayout--pos{ grid-template-columns:1fr; grid-template-areas: "header" "meta" "buyer" "lines" "pay" "totals"; } .invHeaderGrid{ grid-template-columns:1fr; } .sendMetaCard{ width:100%; justify-self:stretch; } .sendArea--lines .table{ min-width: 940px; } } @media (max-width: 560px){ .metaRow{ grid-template-columns:1fr; } .sendActions{ grid-template-columns:1fr; } } .cardHeadRow{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; flex-wrap:wrap; } .cardHeadRow h2{ margin:0; } .inv-col--soft{ background:rgba(255,255,255,.02); } body.theme-light .inv-col--soft{ background:rgba(2,6,23,.02); } /* Buyer controls */ .buyerBar{ display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; } .buyerBar__code{ flex:1 1 260px; min-width:220px; } .buyerBar__actions{ display:flex; gap:8px; flex-wrap:wrap; } .buyerBar__actions .btn{ white-space:nowrap; } .sendSideSticky{ position:sticky; top:12px; } .sendActions{ display:grid; gap:10px; } .sendActions .btn{ width:100%; } /* Slightly tighter totals inside side panel */ .totals--side .totals__row{ padding:10px 10px; border-radius:14px; } .totals--side .totals__pay{ border-radius:16px; } @media (max-width: 980px){ .sendGrid{ grid-template-columns: 1fr; } .sendSideSticky{ position:static; } } @media (max-width: 520px){ .buyerBar__actions .btn{ flex:1 1 46%; } .sendActions .btn{ padding:12px 14px; border-radius:16px; } } /* ---------------- Invoice (Send) rebuilt layout v1 ---------------- */ .invSend{ display:grid; gap:12px; align-items:start; } .invSend--v1{ max-width:1480px; margin-inline:auto; } .invSend__top{ display:grid; gap:12px; align-items:start; /* در RTL، ستون اول = سمت راست */ grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); } .invSend__bottom{ display:grid; gap:12px; align-items:start; /* در RTL، ستون اول = سمت راست */ grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .invCard{ padding:12px; } .invSend .cardHeadRow{ align-items:baseline; } .invSend .cardHeadRow h2{ font-size:15px; font-weight:900; } .invHdrBlocks{ display:grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap:12px; margin-top:10px; } .invHdrBlock{ background:rgba(255,255,255,.03); border:1px solid var(--border); border-radius:14px; padding:10px; min-width:0; } body.theme-light .invHdrBlock, html[data-theme="light"] .invHdrBlock{ background:rgba(2,6,23,.02); } .invHdrGrid{ gap:10px 12px; } .invMetaGrid{ margin-top:10px; gap:10px 12px; } .buyerRow{ display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; margin-top:8px; } .buyerRow__code{ flex:1 1 260px; min-width:220px; } .buyerRow__actions{ display:flex; gap:8px; flex-wrap:wrap; } .buyerRow__actions .btn{ white-space:nowrap; } .buyerFacts{ display:grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap:10px; margin-top:10px; } .fact{ grid-column: span 6; background:rgba(255,255,255,.02); border:1px solid var(--border); border-radius:14px; padding:10px; min-width:0; } body.theme-light .fact, html[data-theme="light"] .fact{ background:rgba(2,6,23,.02); } .fact--wide{ grid-column: span 12; } .fact__k{ display:block; color:var(--muted); font-size:12px; } .fact__v{ display:block; margin-top:6px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .fact--wide .fact__v{ white-space:normal; line-height:1.7; font-weight:700; } .tableWrap--lines{ margin-top:8px; overflow:auto; } .invCard--lines .table{ min-width:980px; } /* Let the lines table grow with long numbers inside its own scroller (prevents page overflow) */ .invCard--lines .table.table--lines{ width:max-content; min-width:980px; } /* actions: 3 columns on desktop for a shorter card */ .sendActions.sendActions--wide{ grid-template-columns: repeat(3, 1fr); } @media (max-width: 1100px){ .invHdrBlocks{ grid-template-columns:1fr; } } @media (max-width: 980px){ .invSend__top{ grid-template-columns:1fr; } .invSend__bottom{ grid-template-columns:1fr; } .sendActions.sendActions--wide{ grid-template-columns: 1fr 1fr; } .fact{ grid-column: span 12; } } @media (max-width: 520px){ .sendActions.sendActions--wide{ grid-template-columns: 1fr; } .buyerRow__actions .btn{ flex:1 1 46%; } } /* Excel import cards layout */ .excelImports{ margin-top:14px; } .excelImports .row{flex-wrap:wrap} .excelImports .filepick{min-width:0} /* ---------------- Mobile hamburger menu: darker (less glass) in Night mode ---------------- */ /* Place this at the end so it wins against the global dark sidebar "glass" rules. */ @media (max-width: 980px){ html[data-theme="dark"] .sidebar{ background: rgba(2,6,23,.94) !important; backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(8px) !important; } html[data-theme="dark"] .sidebarScrim{ background: rgba(0,0,0,.58) !important; backdrop-filter: blur(2px) !important; -webkit-backdrop-filter: blur(2px) !important; } /* slightly more solid menu items to avoid seeing the page through them */ html[data-theme="dark"] .sidebar .nav__item, html[data-theme="dark"] .sidebar .navGroup__btn{ background: rgba(255,255,255,.05) !important; } } /* ---------------- Invoice (Send) clean layout v2 ---------------- */ .invSend--v2{ width:100%; max-width:1480px; margin-inline:auto; } /* Head card: invoice meta (right) + buyer (left) merged into ONE card تا فضای خالی بزرگ زیر ستون کوتاه‌تر ایجاد نشود */ .invSend--v2 .invCard--head{ padding:10px; } .invSend--v2 .invHeadGrid{ display:grid; gap:12px; align-items:start; /* در RTL، ستون اول سمت راست می‌نشیند */ grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .invSend--v2 .invHeadCol{ min-width:0; } .invSend--v2 .invHeadCol--buyer{ border-inline-start:1px solid var(--border); padding-inline-start:12px; } .invSend--v2 .invTopGrid{ margin-top:8px; gap:8px 10px; } .invSend--v2 .invTopGrid label{ min-width:0; gap:4px; } /* Buyer: denser and readable */ .invSend--v2 .invHeadCol--buyer .buyerRow{ margin-top:8px; gap:8px; } .invSend--v2 .invHeadCol--buyer .buyerRow__code{ flex:1 1 180px; min-width:160px; } .invSend--v2 .invHeadCol--buyer .buyerRow__actions{ gap:6px; } /* keep 2-column facts (base style), just make them tighter */ .invSend--v2 .invHeadCol--buyer .buyerFacts{ gap:8px; margin-top:10px; } .invSend--v2 .invHeadCol--buyer .fact{ padding:8px 10px; border-radius:12px; } .invSend--v2 .invHeadCol--buyer .fact:not(.fact--wide){ display:flex; align-items:baseline; justify-content:space-between; gap:10px; } .invSend--v2 .invHeadCol--buyer .fact:not(.fact--wide) .fact__k{ display:inline; white-space:nowrap; } .invSend--v2 .invHeadCol--buyer .fact:not(.fact--wide) .fact__v{ margin-top:0; white-space:nowrap; } /* Prevent long buyer values from causing horizontal overflow (mobile) */ .invSend--v2 .invHeadCol--buyer .fact__v{ min-width:0; overflow-wrap:anywhere; word-break:break-word; } .invSend--v2 .invHeadCol--buyer .fact:not(.fact--wide){ align-items:flex-start; } .invSend--v2 .invHeadCol--buyer .fact:not(.fact--wide) .fact__v{ flex:1 1 auto; } /* Numeric buyer facts should be LTR to avoid RTL caret/scroll quirks */ #buyerTinView, #buyerPostView, #buyerPhoneView{ direction:ltr; unicode-bidi:plaintext; text-align:left; } /* Bottom row: merged into ONE card (no empty column), inside it two columns (totals right / payments left) */ .invSend--v2 .invSend__bottom{ grid-template-columns:1fr; } .invSend--v2 .invCard--bottom{ padding:10px; } .invSend--v2 .invBottomGrid{ display:grid; gap:12px; align-items:start; /* در RTL، ستون اول سمت راست می‌نشیند */ grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); } .invSend--v2 .invBottomCol{ min-width:0; } .invSend--v2 .invBottomCol--pay{ border-inline-start:1px solid var(--border); padding-inline-start:12px; } /* Payments fields: denser grid so space isn't wasted */ .invSend--v2 .invBottomCol--pay .form{ grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:10px 12px; } /* Actions grid: 2 columns desktop, 1 column mobile */ .invSend--v2 .sendActions.sendActions--grid{ grid-template-columns: 1fr 1fr; } /* RTL + numeric inputs: keep them LTR so the page doesn't "pull" sideways on mobile */ .page--send #invNumber, .page--send #issueJalali, .page--send #refTaxId, .page--send #buyerCode, .page--send .table--lines input.n{ direction:ltr; unicode-bidi:plaintext; text-align:left; } /* Lines table: slightly tighter so it looks like a POS grid */ .page--send .table--lines{ font-size:12px; } .page--send .table--lines th, .page--send .table--lines td{ padding:9px 6px; } /* Keep large numbers inside the table scroller (not the page) */ .page--send .tableWrap--lines{ max-width:100%; overflow:auto; overscroll-behavior-x:contain; } .page--send .table--lines th, .page--send .table--lines td{ white-space:nowrap; } .page--send .table--lines td[data-calc]{ min-width:120px; } .page--send .table--lines td[data-calc], .page--send .table--lines td.n{ direction:ltr; text-align:left; } .page--send .table--lines td[data-calc]{ font-variant-numeric: tabular-nums; } @media (max-width: 980px){ .invSend--v2 .invHeadGrid{ grid-template-columns:1fr; } .invSend--v2 .invHeadCol--buyer{ border-inline-start:0; padding-inline-start:0; border-top:1px solid var(--border); padding-top:12px; } .invSend--v2 .invHeadCol--buyer .fact{ grid-column: span 12; } .invSend--v2 .invSend__bottom{ grid-template-columns:1fr; } .invSend--v2 .invBottomGrid{ grid-template-columns:1fr; } .invSend--v2 .invBottomCol--pay{ border-inline-start:0; padding-inline-start:0; border-top:1px solid var(--border); padding-top:12px; } } @media (max-width: 520px){ .invSend--v2 .sendActions.sendActions--grid{ grid-template-columns:1fr; } } @media (max-width: 640px){ /* Invoice (Send) mobile polish */ .page--send .invSend{ gap:10px; } .page--send .invSend--v2 .invCard--head, .page--send .invSend--v2 .invCard--lines, .page--send .invSend--v2 .invCard--bottom{ padding:12px; } .page--send .invSend--v2 .invHeadGrid, .page--send .invSend--v2 .invBottomGrid{ gap:10px; } /* Buyer row: stack code + actions for narrow phones */ .page--send .invSend--v2 .invHeadCol--buyer .buyerRow{ flex-direction:column; align-items:stretch; } .page--send .invSend--v2 .invHeadCol--buyer .buyerRow__code{ min-width:0; width:100%; } .page--send .invSend--v2 .invHeadCol--buyer .buyerRow__actions{ width:100%; } .page--send .invSend--v2 .invHeadCol--buyer .buyerRow__actions .btn{ flex:1 1 32%; } /* Buyer facts: keep compact (2 columns) on phones */ .page--send .invSend--v2 .invHeadCol--buyer .fact{ grid-column: span 6; } .page--send .invSend--v2 .invHeadCol--buyer .fact.fact--wide{ grid-column: span 12; } /* Lines table: smoother horizontal scroll + tighter cells */ .page--send .tableWrap--lines{ -webkit-overflow-scrolling:touch; } .page--send .table--lines{ font-size:11px; } .page--send .table--lines th, .page--send .table--lines td{ padding:8px 6px; } .page--send .table--lines input.in{ min-width:92px; padding:6px 8px; } .page--send .table--lines td:last-child .row{ gap:6px; } .page--send .table--lines td[data-calc]{ min-width:104px; } } @media (max-width: 420px){ /* Ultra-small phones: facts full width + action buttons 2 columns */ .page--send .invSend--v2 .invHeadCol--buyer .fact{ grid-column: span 12; } .page--send .invSend--v2 .invHeadCol--buyer .buyerRow__actions .btn{ flex:1 1 46%; } } /* ثبت فاکتور: روی دسکتاپ فضای افقی بیشتری بگیر تا جدول اقلام با اعداد بزرگ کمتر به هم بریزد */ .page.page--send{ max-width: min(1600px, calc(100vw - 24px)); } /* اقلام کالا: اعداد محاسباتی طولانی صفحه را به هم نریزند؛ داخل همان جدول قابل اسکرول بمانند */ .page--send .invCard--lines{ min-width:0; } .page--send .tableWrap--lines{ width:100%; max-width:100%; } .page--send .table--lines{ table-layout:auto; } .page--send .table--lines td[data-calc]{ min-width:120px; max-width:168px; overflow:hidden; text-overflow:ellipsis; font-size:11px; } /* ---------------- Invoice send form sizing + line extra modal polish (v155) ---------------- */ /* فیلدهای ردیف اقلام: به اندازه نیاز هر ستون */ .page--send .table--lines td > .in{ max-width:100%; } .page--send .table--lines input[data-f="sstid"]{ min-width:88px; width:96px; } .page--send .table--lines input[data-f="sstt"]{ min-width:180px; width:220px; } .page--send .table--lines input[data-f="mu"]{ min-width:76px; width:84px; } .page--send .table--lines input[data-f="qty"]{ min-width:74px; width:82px; } .page--send .table--lines input[data-f="unitPrice"]{ min-width:118px; width:132px; } .page--send .table--lines input[data-f="discount"]{ min-width:104px; width:118px; } .page--send .table--lines input[data-f="vatRate"]{ min-width:62px; width:72px; } /* دکمه داخل فیلد (مثل «یافتن» داخل ورودی) */ .inAffix{ position:relative; width:100%; min-width:0; } .inAffix > input, .inAffix > .in{ width:100%; box-sizing:border-box; padding-left:72px; /* جا برای دکمه کوچک «یافتن» سمت چپ */ } .inAffix > .inAffix__btn{ position:absolute; left:8px; top:50%; transform:translateY(-50%); z-index:3; white-space:nowrap; padding:3px 7px; min-height:24px; font-size:11px; line-height:1; border-radius:9px; } .inAffix--line > .in{ padding-left:62px; } .inAffix--buyer > input{ padding-left:62px; padding-right:12px; direction:rtl; unicode-bidi:plaintext; text-align:right; /* متن/placeholder از سمت راست شروع شود و زیر دکمه نرود */ } .inAffix--buyer > input::placeholder{ text-align:right; direction:rtl; } #buyerCode{ direction:rtl !important; text-align:right !important; padding-right:12px !important; padding-left:62px !important; } #buyerCode::placeholder{ text-align:right !important; } /* عنوان کالا + دکمه یافتن (داخل همان فیلد) */ .page--send .table--lines .lineTitlePick{ min-width:0; } /* مودال «یافتن»: صفحه‌بندی + جدول قابل اسکرول */ #modalTable .modalPickerPager{ margin-top:10px; padding-top:10px; border-top:1px solid rgba(148,163,184,.16); } #modalTable .modalPickerPager .pager{ margin-top:0; } #modalTable .modalPickerPager .pager__left{ color:var(--muted); font-size:12px; } #modalTable .tablewrap{ max-height:min(52vh, 460px); overflow:auto; border:1px solid rgba(148,163,184,.14); border-radius:12px; } #modalTable .table thead th{ position:sticky; top:0; z-index:1; background:var(--card); } /* ستون عملیات اقلام: دکمه‌ها نفس بکشند و به لبه‌ها نچسبند */ .page--send .table--lines td:last-child{ min-width:156px; } .page--send .table--lines td:last-child .row{ gap:6px; flex-wrap:wrap; justify-content:flex-start; } /* فیلدهای هدر فاکتور: جمع‌وجورتر بر اساس نیاز (بدون شکستن ریسپانسیو) */ .page--send .invTopGrid > label{ min-width:0; } .page--send #invNumber{ max-width:140px; } .page--send #issueJalali{ max-width:170px; } .page--send #invType{ max-width:150px; } .page--send #invSubject{ max-width:190px; } .page--send #invPattern{ max-width:360px; } .page--send #refTaxId{ max-width:260px; } .page--send #invNote{ max-width:520px; } /* Line extra modal (جزئیات ردیف): هدر/فوتر استاندارد + فاصله مناسب از دکمه‌ها */ #lineExtraModal .modal__panel{ width:min(920px, calc(100vw - 24px)); max-height:calc(100vh - 24px); overflow:hidden; display:flex; flex-direction:column; } #lineExtraModal .modal__head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 14px; border-bottom:1px solid var(--border); } #lineExtraModal .modal__title{ font-weight:800; font-size:14px; } #lineExtraModal .modal__body{ padding:12px 14px; overflow:auto; } #lineExtraModal #lineExtraHint{ margin:0; padding:8px 10px; border:1px dashed var(--border); border-radius:10px; line-height:1.6; } #lineExtraModal #lineExtraForm{ margin-top:12px !important; grid-template-columns:repeat(12, minmax(0, 1fr)); gap:10px 12px; align-items:start; } #lineExtraModal #lineExtraForm > label{ grid-column:span 4; min-width:0; } #lineExtraModal #lineExtraForm > label > input{ width:100%; min-width:0; } #lineExtraModal .modal__foot{ display:flex; justify-content:flex-end; align-items:center; gap:8px; padding:12px 14px; border-top:1px solid var(--border); background:rgba(255,255,255,.02); } html[data-theme="light"] #lineExtraModal .modal__foot, body.theme-light #lineExtraModal .modal__foot{ background:rgba(2,6,23,.02); } @media (max-width: 980px){ #lineExtraModal #lineExtraForm > label{ grid-column:span 6; } } @media (max-width: 640px){ /* موبایل: فیلدهای هدر دوباره تمام‌عرض شوند */ .page--send #invNumber, .page--send #issueJalali, .page--send #invType, .page--send #invSubject, .page--send #invPattern, .page--send #refTaxId, .page--send #invNote{ max-width:100%; } .page--send .table--lines td:last-child{ min-width:148px; } #lineExtraModal .modal__head, #lineExtraModal .modal__body, #lineExtraModal .modal__foot{ padding:10px 12px; } #lineExtraModal #lineExtraForm > label{ grid-column:span 12; } #lineExtraModal .modal__foot{ flex-wrap:wrap; } #lineExtraModal .modal__foot .btn{ flex:1 1 48%; } } /* ---------------- Invoice send hotfixes (v155) ---------------- */ /* 1) منوی کشویی الگو/نوع روی کارت بعدی نیفتد (به‌خصوص حالت شب به‌خاطر stacking context کارت‌ها) */ .page--send .invCard--head, .page--send .invCard--lines{ position: relative; } .page--send .invCard--head{ z-index: 6; overflow: visible; } .page--send .invCard--lines{ z-index: 1; } .page--send .invCard--head .selectx{ position:relative; } .page--send .invCard--head .selectx.open{ z-index: 120; } .page--send .invCard--head .selectx.open .selectx-menu{ z-index: 9999; } /* 2) فیلد یادداشت چاپ تمام‌عرض واقعی باشد (کوچک‌تر از فیلدهای بالا نشود) */ .page--send #invNoteRow, .page--send #invNoteRow > input, .page--send #invNote{ width: 100%; } .page--send #invNote{ max-width: none !important; } /* 3) مقادیر عددی/جمع‌ها زیر ستون خودشان دیده شوند (هم‌راستای هدر) */ .page--send .table--lines td.n, .page--send .table--lines td[data-calc]{ text-align: right; } .page--send .table--lines td[data-calc]{ min-width: 132px; } /* هدر جدول اقلام هم ثابت و خوانا */ .page--send .table--lines thead th{ vertical-align: bottom; } /* ---------------- Invoice send line table tweaks (v156) ---------------- */ /* ردیف اقلام: سلول‌ها عمودی وسط‌چین شوند تا عددهای محاسباتی وسط باکس‌ها دیده شوند */ .page--send .table--lines tbody td{ vertical-align: middle; } .page--send .table--lines tbody td[data-calc], .page--send .table--lines tbody td[data-col="idx"]{ padding-top: 12px; padding-bottom: 12px; line-height: 1.25; font-variant-numeric: tabular-nums; } /* در حالت RTL مقدارهای محاسباتی زیر هدرها تمیزتر بایستند */ .page--send .table--lines tbody td[data-calc]{ text-align: center; } /* ---------------- Invoice send + picker modal polish (v157) ---------------- */ /* مودال یافتن: فاصله بهتر بین عنوان «جستجو» و فیلد + تنفس بیشتر بالای جدول */ #modal .modal__body > .row:first-child{ align-items:flex-end; gap:12px; margin-bottom:12px; } #modal .modal__body > .row:first-child .form{ min-width:0; } #modal .modal__body > .row:first-child .form label{ gap:8px; } #modal .modal__body #modalSearch{ margin-top:0; } #modal #modalTable{ margin-top:4px; } /* نوع ۳: کارت اقلام مخفی و بخش پرداخت برجسته‌تر/جایگزین شود */ .page--send.is-type3 .invCard--lines{ display:none; } .page--send.is-type3 .invBottomGrid{ grid-template-columns:minmax(0,1fr); gap:14px; } .page--send.is-type3 .invBottomCol--pay{ order:1; border-inline-start:0; padding-inline-start:0; border:1px solid rgba(79,140,255,.24); background:linear-gradient(180deg, rgba(79,140,255,.08), rgba(79,140,255,.03)); border-radius:14px; padding:12px; box-shadow: inset 0 0 0 1px rgba(79,140,255,.05); } .page--send.is-type3 .invBottomCol--totals{ order:2; } .page--send.is-type3 .invBottomCol--pay .cardHeadRow{ margin-bottom:2px; } .page--send.is-type3 .invBottomCol--pay #paymentsFields{ margin-top:10px; } .page--send.is-type3 #paymentsFields .payrow{ background:rgba(255,255,255,.02); border-radius:12px; } .page--send.is-type3 #paymentsFields .payrow > .grid2{ gap:10px 12px; } .page--send.is-type3 .invBottomCol--totals .totals{ display:none; } .page--send.is-type3 .invBottomCol--totals .cardHeadRow .muted.small{ opacity:.9; } @media (max-width:980px){ .page--send.is-type3 .invBottomCol--pay{ border-top:0; padding-top:12px; } } /* ---------------- Invoice send fixes (v158) ---------------- */ /* دکمه پاک کنار کد خریدار: هماهنگ‌تر با دکمه‌های اطراف */ .page--send #btnBuyerClear{ min-height: 34px; padding: 0 14px; border-radius: 12px; font-size: 12px; line-height: 1; } .page--send .buyerRow__actions{ align-items: stretch; } .page--send .buyerRow__actions #btnBuyerClear{ min-width: 64px; } /* فیلد کد طرف حساب: متن/placeholder سمت راست بایستد و زیر دکمه «یافتن» نرود */ .page--send .inAffix--buyer > input, .page--send #buyerCode{ direction: rtl !important; text-align: right !important; unicode-bidi: plaintext; padding-right: 14px !important; padding-left: 58px !important; /* جا برای دکمه یافتن کوچک‌تر */ } .page--send .inAffix--buyer > .inAffix__btn, .page--send .lineTitlePick > .inAffix__btn{ padding: 2px 6px; min-height: 22px; font-size: 10px; border-radius: 8px; left: 7px; } .page--send .inAffix--buyer > .inAffix__btn{ min-width: 42px; } .page--send .inAffix--line > .in{ padding-left: 56px; } /* در حالت ابطالی/اصلاحی/برگشت از فروش: عرض الگو و شناسه مرجع هم‌اندازه و پرکننده ستون */ .page--send #invPatternRow, .page--send #refTaxRow{ min-width: 0; } .page--send #invPatternRow > select, .page--send #refTaxRow > input, .page--send #invPattern, .page--send #refTaxId{ width: 100%; max-width: none !important; } /* نوع ۳: چیدمان پرداخت‌ها از کل عرض استفاده کند (دیگر در یک ستون باریک نچسبد) */ .page--send.is-type3 #paymentsType3Hint{ display: block; color: var(--muted); } .page--send:not(.is-type3) #paymentsType3Hint{ display:none !important; } .page--send.is-type3 #paymentsFields{ display: grid; grid-template-columns: 1fr; gap: 10px; width: 100%; } .page--send.is-type3 #paymentsFields > .payrowsHead, .page--send.is-type3 #paymentsFields > .payrowsList{ grid-column: 1 / -1; width: 100%; } .page--send.is-type3 #paymentsFields > .payrowsList{ display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 0 !important; } .page--send.is-type3 #paymentsFields .payrow{ width: 100%; box-sizing: border-box; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair{ margin-top: 0 !important; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair + .payrow__pair{ margin-top: 10px !important; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child label:last-child{ display: flex; justify-content: flex-start; align-self: end; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child label:last-child .btn{ min-height: 34px; padding-inline: 14px; } /* دسکتاپ عریض: داخل هر کارت پرداخت، فیلدها فشرده‌تر و یکنواخت‌تر */ @media (min-width: 1200px){ .page--send.is-type3 #paymentsFields .payrow{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 12px; align-items: start; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair{ display: contents; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair label{ grid-column: span 2; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child label:last-child{ grid-column: span 2; align-self: end; } } /* ---------------- Invoice send refinements (v159) ---------------- */ /* حذف متن راهنمای نوع ۳ (در هر دو کارت) */ .page--send #totalsType3Hint, .page--send #paymentsType3Hint{ display:none !important; } /* دکمه پاک کنار کد خریدار: هم‌ارتفاع با فیلد */ .page--send .buyerRow{ align-items:stretch; } .page--send .buyerRow__code{ display:flex; align-items:flex-end; } .page--send #btnBuyerClear{ min-height: 40px !important; height: 40px; padding: 0 16px !important; border-radius: 12px; font-weight: 700; } .page--send .buyerRow__actions{ align-items:flex-end; } .page--send .buyerRow__actions #btnBuyerClear{ min-width: 70px; } /* اقلام فاکتور: جمع / مالیات / خالص دقیقاً زیر هدر خودشان بنشینند */ .page--send .table--lines thead th:nth-child(9), .page--send .table--lines thead th:nth-child(10), .page--send .table--lines thead th:nth-child(11){ min-width: 136px; width: 136px; text-align: center; } .page--send .table--lines tbody td:nth-child(9), .page--send .table--lines tbody td:nth-child(10), .page--send .table--lines tbody td:nth-child(11){ min-width: 136px; width: 136px; text-align: center !important; direction:ltr; unicode-bidi:isolate; font-variant-numeric: tabular-nums; letter-spacing: .1px; } .page--send .table--lines tbody td[data-calc]{ padding-inline: 10px; } /* محاسبات و عملیات: ظاهر دکمه‌ها زیباتر و حرفه‌ای‌تر */ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ margin-top: 14px; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn{ min-height: 54px; border-radius: 18px; font-weight: 800; font-size: 14px; letter-spacing: 0; box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 10px 24px rgba(2,6,23,.18); transition: transform .18s ease, box-shadow .18s ease, filter .18s ease, background-color .18s ease, border-color .18s ease; } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn:hover{ transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 14px 28px rgba(2,6,23,.22); } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn:active{ transform: translateY(0); box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 8px 18px rgba(2,6,23,.16); } /* چیدمان دلخواه (منظم‌تر) */ .page--send #btnEnqueue{ order:1; } .page--send #btnCreateInvoice{ order:2; } .page--send #btnSendNow{ order:3; } .page--send #btnPrint{ order:4; } .page--send #btnDuplicateInvoice{ order:5; } .page--send #btnCancelInvoice{ order:6; grid-column:1 / -1; } /* دکمه‌های اصلی */ .page--send #btnEnqueue, .page--send #btnCreateInvoice{ border-color: rgba(var(--accent-rgb), .55); background: linear-gradient(180deg, rgba(var(--accent-rgb), .98), rgba(var(--accent-rgb), .84)); color:#fff; } /* دکمه‌های ثانویه (ارسال/چاپ/تکثیر) */ .page--send #btnSendNow, .page--send #btnPrint, .page--send #btnDuplicateInvoice{ border:1px solid rgba(148,163,184,.20); color: var(--text); background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 8px 18px rgba(2,6,23,.12); } html[data-theme="light"] .page--send #btnSendNow, html[data-theme="light"] .page--send #btnPrint, html[data-theme="light"] .page--send #btnDuplicateInvoice{ border-color: rgba(15,23,42,.10); background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.92)); box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 10px 22px rgba(2,6,23,.06); } /* ابطال: دکمه شاخص و تمام‌عرض */ .page--send #btnCancelInvoice{ min-height: 52px; border-color: rgba(var(--danger-rgb), .62); background: linear-gradient(180deg, rgba(var(--danger-rgb), .96), rgba(var(--danger-rgb), .78)); box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 12px 26px rgba(var(--danger-rgb), .16); } @media (max-width: 980px){ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ grid-template-columns:1fr; gap:10px; } .page--send #btnCancelInvoice{ grid-column:auto; } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn{ min-height: 50px; border-radius: 16px; font-size: 13px; } } /* ---------------- Invoice send polish overrides (v160) ---------------- */ /* tax17 label + tooltip icon */ .page--send .lbl__cap--help{ display:inline-flex; align-items:center; gap:6px; } .page--send .helpDot{ display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; border-radius:999px; border:1px solid rgba(148,163,184,.28); color:var(--muted); background:rgba(255,255,255,.03); font-size:10px; font-weight:800; line-height:1; cursor:help; user-select:none; } .page--send .helpDot:hover, .page--send .helpDot:focus-visible{ color:var(--text); border-color: rgba(var(--accent-rgb), .45); background: rgba(var(--accent-rgb), .12); outline:none; } /* دکمه پاک کنار کد طرف حساب: هم‌قد فیلد */ .page--send .buyerRow__actions #btnBuyerClear{ height: 44px !important; min-height: 44px !important; padding: 0 18px !important; border-radius: 14px !important; } /* اقلام فاکتور: هم‌راستاسازی دقیق‌تر ستون‌های جمع/مالیات/خالص */ .page--send .table--lines thead th:nth-child(9), .page--send .table--lines thead th:nth-child(10), .page--send .table--lines thead th:nth-child(11), .page--send .table--lines tbody td:nth-child(9), .page--send .table--lines tbody td:nth-child(10), .page--send .table--lines tbody td:nth-child(11){ width: 148px !important; min-width: 148px !important; max-width: 148px !important; box-sizing: border-box; text-align: center !important; } .page--send .table--lines tbody td[data-calc]{ overflow: visible !important; text-overflow: clip !important; white-space: nowrap; font-size: 12px; padding-inline: 8px !important; } /* محاسبات و عملیات: بازطراحی مینیمال و تمیز */ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ margin-top: 12px; gap: 10px; grid-template-columns: repeat(2, minmax(0,1fr)); } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn{ min-height: 46px; border-radius: 14px; font-size: 13px; font-weight: 700; letter-spacing: 0; box-shadow: none !important; transform: none !important; transition: background-color .16s ease, border-color .16s ease, color .16s ease, opacity .16s ease; } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn:hover{ filter: none; } /* نظم چیدمان */ .page--send #btnCreateInvoice{ order:1; } .page--send #btnEnqueue{ order:2; } .page--send #btnSendNow{ order:3; } .page--send #btnPrint{ order:4; } .page--send #btnDuplicateInvoice{ order:5; } .page--send #btnCancelInvoice{ order:6; grid-column: 1 / -1; } /* اولیه‌ها: یک دکمه اصلی، یک دکمه تاکیدی ثانویه */ .page--send #btnCreateInvoice{ color:#fff; border-color: rgba(var(--accent-rgb), .55); background: linear-gradient(180deg, rgba(var(--accent-rgb), .95), rgba(var(--accent-rgb), .84)); } .page--send #btnEnqueue{ color: var(--text); border:1px solid rgba(var(--accent-rgb), .28); background: linear-gradient(180deg, rgba(var(--accent-rgb), .14), rgba(var(--accent-rgb), .08)); } /* ثانویه‌ها */ .page--send #btnSendNow, .page--send #btnPrint, .page--send #btnDuplicateInvoice{ color: var(--text); border:1px solid rgba(148,163,184,.18); background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)); } .page--send #btnSendNow:hover, .page--send #btnPrint:hover, .page--send #btnDuplicateInvoice:hover, .page--send #btnEnqueue:hover{ border-color: rgba(148,163,184,.28); background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02)); } .page--send #btnCreateInvoice:hover{ border-color: rgba(var(--accent-rgb), .62); background: linear-gradient(180deg, rgba(var(--accent-rgb), .98), rgba(var(--accent-rgb), .88)); } /* ابطال: واضح اما شیک، نه خیلی توی چشم */ .page--send #btnCancelInvoice{ min-height: 46px; color: #ffd6d6; border: 1px solid rgba(var(--danger-rgb), .34); background: linear-gradient(180deg, rgba(var(--danger-rgb), .14), rgba(var(--danger-rgb), .08)); } .page--send #btnCancelInvoice:hover{ border-color: rgba(var(--danger-rgb), .48); background: linear-gradient(180deg, rgba(var(--danger-rgb), .20), rgba(var(--danger-rgb), .11)); } @media (max-width: 980px){ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ grid-template-columns: 1fr; gap: 8px; } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn, .page--send #btnCancelInvoice{ min-height: 44px; border-radius: 13px; font-size: 12.5px; } } /* ---------------- Invoice send refinements (v161) ---------------- */ /* Tooltip مدرن و بدون مکث برای راهنمای فیلد */ .page--send .helpDot{ position: relative; } .page--send .helpDot[data-tip]::after, .page--send .helpDot[data-tip]::before{ position: absolute; opacity: 0; pointer-events: none; transition: opacity .12s ease, transform .12s ease; z-index: 50; } .page--send .helpDot[data-tip]::after{ content: attr(data-tip); inset-inline-end: 0; top: calc(100% + 8px); width: min(420px, 78vw); white-space: pre-line; text-align: right; line-height: 1.65; padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(148,163,184,.24); background: rgba(8,14,28,.96); color: #e5edf9; box-shadow: 0 16px 36px rgba(2,6,23,.34); transform: translateY(-4px); font-size: 11px; font-weight: 500; } .page--send .helpDot[data-tip]::before{ content: ""; inset-inline-end: 5px; top: calc(100% + 2px); border: 6px solid transparent; border-bottom-color: rgba(8,14,28,.96); transform: translateY(-4px); } .page--send .helpDot[data-tip]:hover::after, .page--send .helpDot[data-tip]:hover::before, .page--send .helpDot[data-tip]:focus-visible::after, .page--send .helpDot[data-tip]:focus-visible::before{ opacity: 1; transform: translateY(0); } /* دکمه‌های عملیات: بازگشت به استایل خوش‌فرم‌تر + نظم بهتر */ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ margin-top: 14px; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn{ min-height: 54px; border-radius: 18px; font-weight: 800; font-size: 14px; letter-spacing: 0; box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 10px 24px rgba(2,6,23,.18); transition: transform .18s ease, box-shadow .18s ease, filter .18s ease, background-color .18s ease, border-color .18s ease; } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn:hover{ transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 14px 28px rgba(2,6,23,.22); } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn:active{ transform: translateY(0); box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 8px 18px rgba(2,6,23,.16); } .page--send #btnEnqueue{ order:1; } .page--send #btnCreateInvoice{ order:2; } .page--send #btnSendNow{ order:3; } .page--send #btnPrint{ order:4; } .page--send #btnDuplicateInvoice{ order:5; } .page--send #btnCancelInvoice{ order:6; grid-column:1 / -1; } .page--send #btnEnqueue, .page--send #btnCreateInvoice{ border-color: rgba(var(--accent-rgb), .55) !important; background: linear-gradient(180deg, rgba(var(--accent-rgb), .98), rgba(var(--accent-rgb), .84)) !important; color:#fff !important; } .page--send #btnSendNow, .page--send #btnPrint, .page--send #btnDuplicateInvoice{ border:1px solid rgba(148,163,184,.20) !important; color: var(--text) !important; background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 8px 18px rgba(2,6,23,.12) !important; } html[data-theme="light"] .page--send #btnSendNow, html[data-theme="light"] .page--send #btnPrint, html[data-theme="light"] .page--send #btnDuplicateInvoice{ border-color: rgba(15,23,42,.10) !important; background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.92)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 10px 22px rgba(2,6,23,.06) !important; } .page--send #btnCancelInvoice{ min-height: 52px !important; border-color: rgba(var(--danger-rgb), .62) !important; background: linear-gradient(180deg, rgba(var(--danger-rgb), .96), rgba(var(--danger-rgb), .78)) !important; color:#fff !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 12px 26px rgba(var(--danger-rgb), .16) !important; } /* دکمه پاک کنار کد خریدار: هم‌قد و هماهنگ */ .page--send .buyerRow{ align-items:stretch; } .page--send .buyerRow__code{ display:flex; align-items:flex-end; } .page--send .buyerRow__actions{ align-items:flex-end; } .page--send .buyerRow__actions #btnBuyerClear{ min-height: 44px !important; height: 44px !important; min-width: 74px; padding: 0 16px !important; border-radius: 14px !important; font-weight: 700; } /* اقلام فاکتور: ستون‌های جمع/مالیات/خالص دقیق‌تر + عمودی وسط */ .page--send .table--lines thead th:nth-child(9), .page--send .table--lines thead th:nth-child(10), .page--send .table--lines thead th:nth-child(11), .page--send .table--lines tbody td:nth-child(9), .page--send .table--lines tbody td:nth-child(10), .page--send .table--lines tbody td:nth-child(11){ width: 140px !important; min-width: 140px !important; max-width: 140px !important; text-align: center !important; } .page--send .table--lines tbody td{ vertical-align: middle; } .page--send .table--lines tbody td[data-calc]{ direction:ltr; unicode-bidi:isolate; font-variant-numeric: tabular-nums; white-space: nowrap; line-height: 1.35; padding-top: 15px !important; padding-bottom: 15px !important; } /* نوع ۳: ستون پرداخت عریض‌تر و مناسب داده زیاد */ .page--send.is-type3 .invSend--v2 .invBottomGrid{ grid-template-columns: minmax(280px, .78fr) minmax(0, 1.95fr); } .page--send.is-type3 #paymentsFields > .payrowsHead{ margin-bottom: 8px; } .page--send.is-type3 #paymentsFields > .payrowsHead .muted{ font-weight: 700; } .page--send.is-type3 #paymentsFields > .payrowsHead .btn{ border-radius: 12px; } .page--send.is-type3 #paymentsFields > .payrowsList{ display:grid; grid-template-columns: repeat(auto-fit, minmax(460px, 1fr)); gap: 12px; margin-top: 0 !important; } .page--send.is-type3 #paymentsFields .payrow{ display:grid; grid-template-columns: repeat(12, minmax(0,1fr)); gap: 10px 12px; align-items: start; margin-top: 0 !important; padding: 12px !important; border-radius: 14px !important; border:1px solid rgba(148,163,184,.16) !important; background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.012)); box-shadow: inset 0 1px 0 rgba(255,255,255,.03); } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair{ display: contents; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair label{ grid-column: span 3; min-width: 0; gap: 6px; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:first-child label{ grid-column: span 6; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child label:first-child{ grid-column: span 4; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child .payrow__actions{ grid-column: span 8; display:flex; align-items:flex-end; justify-content:flex-start; } .page--send.is-type3 #paymentsFields .payrow label{ font-size: 12px; } .page--send.is-type3 #paymentsFields .payrow .in, .page--send.is-type3 #paymentsFields .payrow select{ min-height: 40px; } .page--send.is-type3 #paymentsFields .payrow [data-act="delpay"]{ min-height: 40px; border-radius: 12px; padding: 0 14px; border-color: rgba(var(--danger-rgb), .34); background: linear-gradient(180deg, rgba(var(--danger-rgb), .14), rgba(var(--danger-rgb), .08)); color: #ffd7d7; box-shadow: none; } .page--send.is-type3 #paymentsFields .payrow [data-act="delpay"]:hover{ border-color: rgba(var(--danger-rgb), .46); background: linear-gradient(180deg, rgba(var(--danger-rgb), .18), rgba(var(--danger-rgb), .10)); } /* حذف متن راهنمای نوع ۳ */ .page--send #totalsType3Hint, .page--send #paymentsType3Hint{ display:none !important; } @media (max-width: 1400px){ .page--send.is-type3 .invSend--v2 .invBottomGrid{ grid-template-columns: minmax(260px, .9fr) minmax(0, 1.45fr); } .page--send.is-type3 #paymentsFields > .payrowsList{ grid-template-columns: 1fr; } } @media (max-width: 1200px){ .page--send.is-type3 #paymentsFields .payrow{ grid-template-columns: repeat(6, minmax(0,1fr)); } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair label{ grid-column: span 3; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:first-child label{ grid-column: span 3; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child label:first-child{ grid-column: span 3; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child .payrow__actions{ grid-column: span 3; justify-content: stretch; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child .payrow__actions .btn{ width: 100%; } } @media (max-width: 980px){ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ grid-template-columns:1fr; gap:10px; } .page--send #btnCancelInvoice{ grid-column:auto; } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn{ min-height: 50px; border-radius: 16px; font-size: 13px; } .page--send.is-type3 .invSend--v2 .invBottomGrid{ grid-template-columns: 1fr; } .page--send.is-type3 #paymentsFields .payrow{ grid-template-columns: 1fr; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair label, .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:first-child label, .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child label:first-child, .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child .payrow__actions{ grid-column: auto; } } /* ---------------- Invoice send refinements (v162) ---------------- */ /* دکمه‌های عملیات پایین: ظریف‌تر و تمیزتر */ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ margin-top: 12px !important; gap: 10px !important; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn{ min-height: 44px !important; height: 44px; border-radius: 14px !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: 0; box-shadow: none !important; transform: none !important; transition: border-color .14s ease, background-color .14s ease, color .14s ease, opacity .14s ease !important; } .page--send #btnCreateInvoice, .page--send #btnEnqueue{ color: #fff !important; border: 1px solid rgba(var(--accent-rgb), .45) !important; background: linear-gradient(180deg, rgba(var(--accent-rgb), .88), rgba(var(--accent-rgb), .78)) !important; } .page--send #btnCreateInvoice:hover, .page--send #btnEnqueue:hover{ border-color: rgba(var(--accent-rgb), .58) !important; background: linear-gradient(180deg, rgba(var(--accent-rgb), .94), rgba(var(--accent-rgb), .82)) !important; } .page--send #btnSendNow, .page--send #btnPrint, .page--send #btnDuplicateInvoice{ color: var(--text) !important; border: 1px solid rgba(148,163,184,.20) !important; background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)) !important; } .page--send #btnSendNow:hover, .page--send #btnPrint:hover, .page--send #btnDuplicateInvoice:hover{ border-color: rgba(148,163,184,.32) !important; background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)) !important; } .page--send #btnCancelInvoice{ min-height: 44px !important; color: #ffd8d8 !important; border: 1px solid rgba(var(--danger-rgb), .34) !important; background: linear-gradient(180deg, rgba(var(--danger-rgb), .14), rgba(var(--danger-rgb), .08)) !important; box-shadow: none !important; } .page--send #btnCancelInvoice:hover{ border-color: rgba(var(--danger-rgb), .46) !important; background: linear-gradient(180deg, rgba(var(--danger-rgb), .20), rgba(var(--danger-rgb), .11)) !important; } @media (max-width: 980px){ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ grid-template-columns: 1fr !important; gap: 8px !important; } .page--send #btnCancelInvoice{ grid-column: auto !important; } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn{ min-height: 42px !important; border-radius: 13px !important; font-size: 12.5px !important; } } /* نوع ۳: بازگشت چیدمان اطلاعات پرداخت به فرم قبلی (بدون کارت‌های پهن جدید) */ .page--send.is-type3 .invSend--v2 .invBottomGrid{ grid-template-columns: minmax(0,1fr) !important; gap: 14px !important; } .page--send.is-type3 .invBottomCol--pay{ order: 1; border-inline-start: 0 !important; padding-inline-start: 0 !important; border: 1px solid rgba(79,140,255,.22) !important; background: linear-gradient(180deg, rgba(79,140,255,.06), rgba(79,140,255,.02)) !important; border-radius: 14px; padding: 12px; box-shadow: inset 0 0 0 1px rgba(79,140,255,.04); } .page--send.is-type3 .invBottomCol--totals{ order: 2; } .page--send.is-type3 .invBottomCol--pay .cardHeadRow{ margin-bottom: 2px; } .page--send.is-type3 .invBottomCol--pay #paymentsFields{ margin-top: 10px !important; } .page--send.is-type3 #paymentsFields{ display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; width: 100%; } .page--send.is-type3 #paymentsFields > .payrowsHead, .page--send.is-type3 #paymentsFields > .payrowsList{ grid-column: 1 / -1; width: 100%; } .page--send.is-type3 #paymentsFields > .payrowsList{ display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; margin-top: 0 !important; } .page--send.is-type3 #paymentsFields > .payrowsHead .btn{ border-radius: 10px !important; } /* هر پرداخت مثل قبل: یک کارت ساده با گرید داخلی منظم */ .page--send.is-type3 #paymentsFields .payrow{ width: 100%; box-sizing: border-box; display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 12px; align-items: start; margin-top: 0 !important; padding: 10px !important; border-radius: 12px !important; border: 1px solid rgba(148,163,184,.14) !important; background: rgba(255,255,255,.02) !important; box-shadow: none !important; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair{ display: contents !important; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair + .payrow__pair{ margin-top: 0 !important; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair label{ grid-column: span 2; min-width: 0; gap: 6px; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child .payrow__actions{ grid-column: span 2; display: flex; align-items: flex-end; justify-content: flex-start; } .page--send.is-type3 #paymentsFields .payrow label{ font-size: 12px; } .page--send.is-type3 #paymentsFields .payrow .in, .page--send.is-type3 #paymentsFields .payrow select{ min-height: 38px; } /* دکمه حذف پرداخت: ساده‌تر و هماهنگ‌تر */ .page--send.is-type3 #paymentsFields .payrow [data-act="delpay"]{ min-height: 38px !important; height: 38px; border-radius: 10px !important; padding: 0 12px !important; font-size: 12px !important; font-weight: 700; color: #ffd8d8 !important; border: 1px solid rgba(var(--danger-rgb), .28) !important; background: rgba(var(--danger-rgb), .10) !important; box-shadow: none !important; } .page--send.is-type3 #paymentsFields .payrow [data-act="delpay"]:hover{ border-color: rgba(var(--danger-rgb), .40) !important; background: rgba(var(--danger-rgb), .14) !important; } @media (max-width: 1200px){ .page--send.is-type3 #paymentsFields .payrow{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair label, .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child .payrow__actions{ grid-column: span 1; } } @media (max-width: 980px){ .page--send.is-type3 .invSend--v2 .invBottomGrid{ grid-template-columns: 1fr !important; } .page--send.is-type3 #paymentsFields .payrow{ grid-template-columns: 1fr !important; gap: 8px !important; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair label, .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child .payrow__actions{ grid-column: auto; } .page--send.is-type3 #paymentsFields .payrow [data-act="delpay"]{ width: 100%; } } /* Desktop (non-type3): keep payment and calculations panels equal width */ @media (min-width: 981px){ .page--send:not(.is-type3) .invSend--v2 .invBottomGrid{ grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; } } /* ---------------- Invoice send polish (v163) ---------------- */ /* بهبود ظاهر باکس اطلاعات پرداخت + دکمه‌های عملیات پایین (جمع‌وجورتر) */ .page--send .invCard--bottom{ padding: 12px !important; } .page--send .invBottomGrid{ gap: 12px !important; align-items: start; } .page--send .invBottomCol{ border: 1px solid rgba(148,163,184,.12); border-radius: 16px; padding: 12px; background: linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.008)); box-shadow: inset 0 1px 0 rgba(255,255,255,.03); } .page--send .invBottomCol .cardHeadRow{ margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px dashed rgba(148,163,184,.14); } .page--send .invBottomCol .cardHeadRow h2{ margin: 0; font-size: 15px; line-height: 1.3; } /* دکمه‌های عملیات: جمع‌وجورتر، متعادل‌تر، بدون دکمه خیلی پهن */ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ margin-top: 10px !important; gap: 8px !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn{ min-height: 40px !important; height: 40px; border-radius: 12px !important; padding: 0 10px !important; font-size: 12.5px !important; font-weight: 700 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .page--send #btnCancelInvoice{ grid-column: auto !important; } /* سطوح دکمه‌ها ظریف‌تر */ .page--send #btnCreateInvoice, .page--send #btnEnqueue{ box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important; } .page--send #btnSendNow, .page--send #btnPrint, .page--send #btnDuplicateInvoice{ border-color: rgba(148,163,184,.18) !important; background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01)) !important; } .page--send #btnSendNow:hover, .page--send #btnPrint:hover, .page--send #btnDuplicateInvoice:hover{ border-color: rgba(148,163,184,.28) !important; } .page--send #btnCancelInvoice{ color: #ffdede !important; border-color: rgba(var(--danger-rgb), .28) !important; background: linear-gradient(180deg, rgba(var(--danger-rgb), .12), rgba(var(--danger-rgb), .07)) !important; } /* ظاهر اطلاعات پرداخت (نوع ۳) */ .page--send.is-type3 .invBottomCol--pay{ border: 1px solid rgba(79,140,255,.18) !important; border-radius: 16px !important; padding: 10px !important; background: linear-gradient(180deg, rgba(79,140,255,.055), rgba(79,140,255,.02)) !important; box-shadow: inset 0 0 0 1px rgba(79,140,255,.035); } .page--send.is-type3 #paymentsFields{ gap: 8px !important; } .page--send.is-type3 #paymentsFields > .payrowsHead{ margin: 0 !important; padding: 8px 10px; border: 1px solid rgba(148,163,184,.12); border-radius: 12px; background: rgba(255,255,255,.018); } .page--send.is-type3 #paymentsFields > .payrowsHead .muted{ color: rgba(255,255,255,.9); font-weight: 700; font-size: 12px; } .page--send.is-type3 #paymentsFields > .payrowsHead .btn{ min-height: 34px !important; height: 34px; border-radius: 10px !important; padding: 0 10px !important; font-size: 12px !important; } .page--send.is-type3 #paymentsFields > .payrowsList{ gap: 8px !important; } /* هر ردیف پرداخت: فشرده‌تر و منظم‌تر */ .page--send.is-type3 #paymentsFields .payrow{ grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 8px 10px !important; padding: 10px !important; border-radius: 14px !important; border: 1px solid rgba(148,163,184,.12) !important; background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)) !important; } .page--send.is-type3 #paymentsFields .payrow label{ grid-column: span 2 !important; margin: 0; min-width: 0; gap: 5px; font-size: 11.5px !important; color: rgba(255,255,255,.88); } .page--send.is-type3 #paymentsFields .payrow .in, .page--send.is-type3 #paymentsFields .payrow select{ min-height: 36px !important; height: 36px; border-radius: 10px !important; padding-inline: 10px !important; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child .payrow__actions{ grid-column: span 2 !important; align-self: end; justify-content: stretch !important; } .page--send.is-type3 #paymentsFields .payrow [data-act="delpay"]{ width: 100%; min-height: 36px !important; height: 36px; border-radius: 10px !important; padding: 0 10px !important; font-size: 12px !important; border-color: rgba(var(--danger-rgb), .24) !important; background: linear-gradient(180deg, rgba(var(--danger-rgb), .11), rgba(var(--danger-rgb), .07)) !important; } .page--send.is-type3 #paymentsFields .payrow [data-act="delpay"]:hover{ border-color: rgba(var(--danger-rgb), .36) !important; background: linear-gradient(180deg, rgba(var(--danger-rgb), .16), rgba(var(--danger-rgb), .10)) !important; } /* رسپانسیو */ @media (max-width: 1220px){ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } .page--send.is-type3 #paymentsFields .payrow{ grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } .page--send.is-type3 #paymentsFields .payrow label, .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child .payrow__actions{ grid-column: span 2 !important; } } @media (max-width: 760px){ .page--send .invBottomCol{ padding: 10px; border-radius: 14px; } .page--send .invBottomCol .cardHeadRow h2{ font-size: 14px; } .page--send .invBottomCol--totals .sendActions.sendActions--grid{ grid-template-columns: 1fr !important; gap: 7px !important; } .page--send .invBottomCol--totals .sendActions.sendActions--grid .btn{ min-height: 39px !important; height: 39px; border-radius: 11px !important; font-size: 12px !important; } .page--send.is-type3 #paymentsFields .payrow{ grid-template-columns: 1fr !important; gap: 8px !important; } .page--send.is-type3 #paymentsFields .payrow label, .page--send.is-type3 #paymentsFields .payrow > .payrow__pair:last-child .payrow__actions{ grid-column: auto !important; } } /* --- Payment row close icon (top-right) --- */ .page--send.is-type3 #paymentsFields .payrow{ position: relative; padding-top: 12px !important; padding-right: 46px !important; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair.payrow__pair--last .payrow__time{ grid-column: span 4 !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ position: absolute; top: 8px; right: 8px; width: 28px; min-width: 28px; height: 28px; min-height: 28px !important; border-radius: 999px !important; padding: 0 !important; display: inline-flex; align-items: center; justify-content: center; line-height: 1; font-size: 18px !important; font-weight: 700; color: #ffdede !important; border: 1px solid rgba(var(--danger-rgb), .24) !important; background: rgba(var(--danger-rgb), .08) !important; box-shadow: none !important; cursor: pointer; z-index: 2; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]:hover{ border-color: rgba(var(--danger-rgb), .38) !important; background: rgba(var(--danger-rgb), .14) !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]:focus-visible{ outline: 2px solid rgba(var(--danger-rgb), .38); outline-offset: 1px; } @media (max-width: 1220px){ .page--send.is-type3 #paymentsFields .payrow > .payrow__pair.payrow__pair--last .payrow__time{ grid-column: span 4 !important; } } @media (max-width: 760px){ .page--send.is-type3 #paymentsFields .payrow{ padding-right: 10px !important; padding-top: 40px !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ top: 8px; right: 8px; } .page--send.is-type3 #paymentsFields .payrow > .payrow__pair.payrow__pair--last .payrow__time{ grid-column: auto !important; } } /* ---------------- Invoice send polish (v164) ---------------- */ /* داک عملیات فاکتور: جای مشخص، جمع‌وجور و آیکن‌دار */ .page--send .invCard--bottom{ display: flex; flex-direction: column; gap: 12px; } .page--send .sendDock{ border-top: 1px dashed rgba(148,163,184,.16); padding-top: 10px; display: grid; gap: 8px; } .page--send .sendDock__group{ display: grid; gap: 8px; } .page--send .sendDock__group--primary{ grid-template-columns: repeat(2, minmax(0, 1fr)); } .page--send .sendDock__group--secondary{ grid-template-columns: repeat(4, minmax(0, 1fr)); } .page--send .sendDock__btn{ width: 100%; min-height: 38px !important; height: 38px; border-radius: 12px !important; padding: 0 10px !important; gap: 6px !important; font-size: 12px !important; font-weight: 700 !important; box-shadow: none !important; } .page--send .sendDock__btn--primary{ min-height: 40px !important; height: 40px; box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important; } .page--send .sendDock__btn .sendDock__ic{ display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; font-size: 14px; line-height: 1; opacity: .95; flex: 0 0 18px; } .page--send .sendDock__btn .sendDock__tx{ overflow: hidden; text-overflow: ellipsis; } .page--send .sendDock__group--secondary .sendDock__btn{ background: linear-gradient(180deg, rgba(255,255,255,.022), rgba(255,255,255,.01)) !important; border-color: rgba(148,163,184,.16) !important; } .page--send .sendDock__group--secondary .sendDock__btn:hover{ border-color: rgba(148,163,184,.28) !important; } .page--send .sendDock__btn--danger{ border-color: rgba(var(--danger-rgb), .30) !important; background: linear-gradient(180deg, rgba(var(--danger-rgb), .14), rgba(var(--danger-rgb), .08)) !important; color: #ffdede !important; } .page--send .sendDock__btn--danger:hover{ border-color: rgba(var(--danger-rgb), .42) !important; } /* غیرفعال‌کردن استایل گرید قبلی دکمه‌ها برای این نسخه */ .page--send .invBottomCol--totals .sendActions.sendActions--grid{ display: none !important; } @media (max-width: 1220px){ .page--send .sendDock__group--secondary{ grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 760px){ .page--send .sendDock{ gap: 7px; padding-top: 8px; } .page--send .sendDock__group--primary, .page--send .sendDock__group--secondary{ grid-template-columns: 1fr; } .page--send .sendDock__btn, .page--send .sendDock__btn--primary{ min-height: 37px !important; height: 37px; border-radius: 11px !important; font-size: 11.5px !important; justify-content: flex-start; padding-inline: 12px !important; } .page--send .sendDock__btn .sendDock__ic{ width: 16px; height: 16px; font-size: 13px; flex-basis: 16px; } } /* ---------------- Invoice send polish (v165) ---------------- */ /* اصلاحات درخواست‌شده: حذف پرداخت سمت چپ + مربعی، خوانایی select روش پرداخت، آیکن واقعی برای دکمه‌ها */ .page--send.is-type3 #paymentsFields .payrow{ padding-inline-start: 44px !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ left: 8px !important; right: auto !important; width: 28px; min-width: 28px; height: 28px; min-height: 28px !important; border-radius: 8px !important; /* مربعی با گوشه نرم */ font-size: 17px !important; } @media (max-width: 760px){ .page--send.is-type3 #paymentsFields .payrow{ padding-left: 10px !important; padding-right: 10px !important; padding-top: 40px !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ left: 8px !important; right: auto !important; } } /* خوانایی روش پرداخت در تم تیره/روشن */ .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"]{ color: var(--text) !important; -webkit-text-fill-color: var(--text); background: rgba(255,255,255,.04) !important; } .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"] option{ color: #0f172a !important; background: #ffffff !important; } html[data-theme="light"] .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"] option, body.theme-light .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"] option{ color: #0f172a !important; background: #ffffff !important; } /* دکمه‌های داک پایین: آیکن SVG واقعی (نه ایموجی) */ .page--send .sendDock__btn .sendDock__ic{ font-size: 0; /* جلوگیری از تراز نامناسب */ } .page--send .sendDock__btn .sendDock__ic svg{ width: 16px; height: 16px; display: block; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .page--send .sendDock__btn--primary .sendDock__ic svg{ width: 17px; height: 17px; } /* ---------------- Invoice send final tweaks (v166) ---------------- */ /* حذف راهنمای بازشونده پایین کارت عملیات */ .page--send .sendHelpDetails{ display:none !important; } /* دکمه حذف پرداخت: فاصله بهتر از لبه + مربعی تمیز */ .page--send.is-type3 #paymentsFields .payrow{ padding-top: 14px !important; padding-inline-start: 50px !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ top: 10px !important; left: 10px !important; right: auto !important; width: 30px !important; min-width: 30px !important; height: 30px !important; min-height: 30px !important; border-radius: 9px !important; } @media (max-width: 760px){ .page--send.is-type3 #paymentsFields .payrow{ padding-top: 42px !important; padding-inline-start: 12px !important; padding-inline-end: 12px !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ top: 9px !important; left: 9px !important; width: 28px !important; height: 28px !important; min-width: 28px !important; min-height: 28px !important; } } /* روش پرداخت: خواناتر (مقدار انتخابی + فلش) */ .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"]{ color: #eef4ff !important; -webkit-text-fill-color: #eef4ff !important; font-weight: 700 !important; text-shadow: 0 0 0 currentColor; direction: rtl; text-align: right; background-color: rgba(255,255,255,.045) !important; border-color: rgba(148,163,184,.20) !important; } .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"]:focus{ border-color: rgba(var(--accent-rgb), .42) !important; box-shadow: 0 0 0 2px rgba(var(--accent-rgb), .12); } .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"] option{ color: #0f172a !important; background: #fff !important; } /* برچسب زمان پرداخت: بدون متن راهنما/placeholder شلوغ */ .page--send.is-type3 #paymentsFields .payrow input[data-pkey="pdt"]::placeholder{ color: transparent !important; } /* آیکن AI کنار ارسال هوشمند کمی برجسته‌تر */ .page--send #btnEnqueue .sendDock__ic svg{ width: 18px; height: 18px; } /* پیام هشدار مودال ارسال هوشمند */ #scheduleModal .smartSendNote{ display: inline-flex; align-items: center; gap: 6px; width: fit-content; max-width: 100%; padding: 6px 10px; border-radius: 10px; line-height: 1.45; background: rgba(255,107,107,.08); border: 1px solid rgba(255,107,107,.20); box-shadow: inset 0 0 0 1px rgba(255,255,255,.02); } #scheduleModal .smartSendNote::before{ content: "!"; display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 999px; font-size: 11px; font-weight: 800; color: #ff9c9c; background: rgba(255,107,107,.12); border: 1px solid rgba(255,107,107,.22); flex: 0 0 16px; } @media (max-width: 640px){ #scheduleModal .smartSendNote{ margin-top: 8px !important; padding: 5px 8px; border-radius: 9px; font-size: 11px !important; line-height: 1.35; } #scheduleModal .smartSendNote::before{ width: 14px; height: 14px; font-size: 10px; flex-basis: 14px; } } /* موبایل: هدر خریدار جمع‌وجورتر و جلوگیری از فاصله خالی */ #buyerHint:empty{ display:none; } @media (max-width: 640px){ .page--send .invSend--v2 .invHeadCol--buyer .cardHeadRow{ gap: 6px !important; margin-bottom: 2px; } .page--send .invSend--v2 .invHeadCol--buyer #buyerHint{ display: none !important; } .page--send .invSend--v2 .invHeadCol--buyer .buyerRow{ margin-top: 6px !important; gap: 6px !important; } .page--send .invSend--v2 .invHeadCol--buyer .buyerFacts{ margin-top: 8px !important; gap: 6px !important; } .page--send .invSend--v2 .invHeadCol--buyer .fact{ padding: 7px 9px !important; border-radius: 10px !important; } } /* راهنمای مالیات ماده ۱۷ در موبایل: جمع‌وجور و داخل صفحه */ @media (max-width: 640px){ .page--send .lbl__cap--help{ gap: 5px; align-items: center; flex-wrap: wrap; } .page--send .helpDot{ width: 15px; height: 15px; font-size: 9px; flex: 0 0 15px; } .page--send .helpDot[data-tip]::after{ inset-inline-start: 0; inset-inline-end: auto; top: calc(100% + 6px); width: min(92vw, 340px); max-width: calc(100vw - 28px); max-height: 42vh; overflow: auto; white-space: pre-line; font-size: 10.5px; line-height: 1.55; padding: 8px 10px; border-radius: 10px; } .page--send .helpDot[data-tip]::before{ inset-inline-start: 6px; inset-inline-end: auto; } } /* ---------------- Invoice send follow-up tweaks (v168) ---------------- */ /* درخواست جدید: فشرده‌سازی هدر خریدار در موبایل + Tooltip ماده 17 وسط صفحه + فاصله بهتر دکمه حذف پرداخت + بازگردانی ظاهر select روش پرداخت */ /* 1) موبایل: فاصله بین عنوان خریدار و فیلد کد خریدار کمتر شود */ @media (max-width: 640px){ .page--send .invSend--v2 .invHeadCol--buyer .cardHeadRow{ margin: 0 !important; padding: 0 !important; align-items: center !important; gap: 4px !important; min-height: 0 !important; } .page--send .invSend--v2 .invHeadCol--buyer .cardHeadRow h2{ margin: 0 !important; line-height: 1.15 !important; } .page--send .invSend--v2 .invHeadCol--buyer .cardHeadRow + .buyerRow{ margin-top: 4px !important; } .page--send .invSend--v2 .invHeadCol--buyer .buyerRow__code label{ gap: 4px !important; margin: 0 !important; } } /* 2) راهنمای مالیات ماده 17 روی موبایل وسط صفحه نمایش داده شود */ @media (max-width: 640px){ .page--send .helpDot[data-tip]{ position: relative; z-index: 5; } .page--send .helpDot[data-tip]::after{ left: 50% !important; right: auto !important; inset-inline-start: auto !important; inset-inline-end: auto !important; transform: translateX(-50%) !important; width: min(92vw, 360px) !important; max-width: calc(100vw - 20px) !important; z-index: 9999; } .page--send .helpDot[data-tip]::before{ left: 50% !important; right: auto !important; inset-inline-start: auto !important; inset-inline-end: auto !important; transform: translateX(-50%) !important; z-index: 10000; } } /* 3) دکمه حذف پرداخت: از باکس‌ها فاصله بگیرد (به‌خصوص کنار شماره پایانه) */ .page--send.is-type3 #paymentsFields .payrow{ padding-top: 46px !important; padding-inline-start: 14px !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ top: 12px !important; left: 12px !important; z-index: 3; } @media (max-width: 760px){ .page--send.is-type3 #paymentsFields .payrow{ padding-top: 44px !important; padding-inline-start: 12px !important; padding-inline-end: 12px !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ top: 10px !important; left: 10px !important; } } /* 4) روش پرداخت: ظاهر رنگی قبلی برنگردد، فقط خوانایی/برش متن داخل باکس اصلاح شود */ .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"]{ color: inherit !important; -webkit-text-fill-color: currentColor !important; background: inherit !important; background-color: transparent !important; font-weight: inherit !important; text-shadow: none !important; line-height: 1.2 !important; padding-top: 0 !important; padding-bottom: 0 !important; padding-inline-start: 10px !important; padding-inline-end: 28px !important; box-sizing: border-box; } /* ---------------- Invoice send hotfixes (v169) ---------------- */ /* 1) روش پرداخت در تم شب: منوی select و گزینه‌ها تیره بمانند + متن داخل باکس کامل دیده شود */ html[data-theme="dark"] .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"], body.theme-dark .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"]{ color-scheme: dark !important; } html[data-theme="dark"] .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"] option, html[data-theme="dark"] .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"] optgroup, body.theme-dark .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"] option, body.theme-dark .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"] optgroup{ background: #0b1220 !important; color: #e6eefc !important; } .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"]{ line-height: 1.45 !important; height: auto !important; min-height: 40px !important; padding-top: 8px !important; padding-bottom: 8px !important; padding-inline-end: 30px !important; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } @media (max-width: 760px){ .page--send.is-type3 #paymentsFields .payrow select[data-pkey="pmt"]{ min-height: 38px !important; padding-top: 7px !important; padding-bottom: 7px !important; } } /* 2) دکمه حذف پرداخت: فاصله بیشتر از لبه و از فیلد شماره پایانه */ .page--send.is-type3 #paymentsFields .payrow{ padding-top: 54px !important; padding-inline-start: 16px !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ top: 14px !important; left: 14px !important; right: auto !important; width: 32px !important; min-width: 32px !important; height: 32px !important; min-height: 32px !important; } @media (max-width: 760px){ .page--send.is-type3 #paymentsFields .payrow{ padding-top: 52px !important; padding-inline-start: 14px !important; padding-inline-end: 12px !important; } .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ top: 12px !important; left: 12px !important; width: 30px !important; min-width: 30px !important; height: 30px !important; min-height: 30px !important; } } /* 3) موبایل: فاصله بین عنوان خریدار و کد خریدار جمع‌تر شود */ @media (max-width: 640px){ .page--send .invSend--v2 .invHeadCol--buyer{ padding-top: 8px !important; } .page--send .invSend--v2 .invHeadCol--buyer .cardHeadRow{ display: block !important; margin: 0 0 4px !important; padding: 0 !important; min-height: 0 !important; gap: 0 !important; } .page--send .invSend--v2 .invHeadCol--buyer .cardHeadRow h2{ margin: 0 !important; line-height: 1.15 !important; } .page--send .invSend--v2 .invHeadCol--buyer #buyerHint{ display: none !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; } .page--send .invSend--v2 .invHeadCol--buyer .buyerRow{ margin-top: 0 !important; } .page--send .invSend--v2 .invHeadCol--buyer .buyerRow__code label{ gap: 4px !important; margin-top: 0 !important; } } /* 4) Tooltip ماده 17 روی موبایل: وسط صفحه و کاملاً داخل viewport (بدون بریدگی) */ @media (max-width: 640px){ .page--send .helpDot[data-tip]::before{ display: none !important; /* پیکان در حالت fixed لازم نیست */ } .page--send .helpDot[data-tip]::after{ position: fixed !important; inset: auto !important; top: 50% !important; left: 50% !important; right: auto !important; bottom: auto !important; width: min(94vw, 360px) !important; max-width: calc(100vw - 14px) !important; max-height: min(56vh, 360px) !important; overflow: auto !important; overscroll-behavior: contain; border-radius: 12px !important; padding: 10px 12px !important; font-size: 11px !important; line-height: 1.6 !important; white-space: pre-line !important; box-sizing: border-box; z-index: 10050 !important; transform: translate(-50%, calc(-50% + 6px)) !important; } .page--send .helpDot[data-tip]:hover::after, .page--send .helpDot[data-tip]:focus-visible::after, .page--send .helpDot[data-tip]:active::after{ transform: translate(-50%, -50%) !important; } } /* ---------------- Mobile buyer header spacing hotfix (v156) ---------------- */ /* رفع فاصله زیاد بین عنوان «خریدار» و باکس «کد خریدار» در موبایل */ @media (max-width: 640px){ .page--send .invSend--v2 .invHeadCol--buyer{ display:flex !important; flex-direction:column !important; justify-content:flex-start !important; align-items:stretch !important; gap:6px !important; align-content:flex-start !important; min-height:0 !important; height:auto !important; padding-top:8px !important; } .page--send .invSend--v2 .invHeadCol--buyer .cardHeadRow, .page--send .invSend--v2 .invHeadCol--buyer .buyerRow, .page--send .invSend--v2 .invHeadCol--buyer .buyerFacts{ margin-top:0 !important; margin-bottom:0 !important; } .page--send .invSend--v2 .invHeadCol--buyer .cardHeadRow{ display:block !important; min-height:0 !important; line-height:1.15; } .page--send .invSend--v2 .invHeadCol--buyer .cardHeadRow h2{ margin:0 !important; } .page--send .invSend--v2 .invHeadCol--buyer #buyerHint{ display:none !important; } .page--send .invSend--v2 .invHeadCol--buyer .buyerRow{ gap:6px !important; } .page--send .invSend--v2 .invHeadCol--buyer .buyerFacts{ gap:6px !important; } } /* ---------------- Mobile buyer blank-space hotfix (v157) ---------------- */ /* رفع فضای خالی بین عنوان «خریدار» و فیلد «کد خریدار» در موبایل (override نهایی) */ @media (max-width: 640px){ .page--send .invSend--v2 .invHeadCol--buyer{ display:block !important; min-height:0 !important; height:auto !important; padding-top:8px !important; } /* اگر قبلاً flex شده باشد، اجازه نده بین آیتم‌ها فضا پخش شود */ .page--send .invSend--v2 .invHeadCol--buyer > .cardHeadRow, .page--send .invSend--v2 .invHeadCol--buyer > .buyerRow, .page--send .invSend--v2 .invHeadCol--buyer > .buyerFacts{ flex:none !important; align-self:auto !important; } .page--send .invSend--v2 .invHeadCol--buyer > .cardHeadRow{ display:block !important; margin:0 0 4px !important; padding:0 !important; min-height:0 !important; line-height:1.15 !important; } .page--send .invSend--v2 .invHeadCol--buyer > .buyerRow{ margin-top:0 !important; gap:6px !important; } .page--send .invSend--v2 .invHeadCol--buyer > .buyerFacts{ margin-top:8px !important; gap:6px !important; } .page--send .invSend--v2 .invHeadCol--buyer #buyerHint:empty{ display:none !important; } } /* ---------------- Mobile/Tablet buyer gap hard-fix (v158) ---------------- */ /* رفع قطعی فضای خالی بین عنوان خریدار و کد خریدار (تا 980px) */ @media (max-width: 980px){ .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer{ display:grid !important; grid-template-rows:auto auto auto !important; align-content:start !important; align-items:start !important; justify-content:initial !important; row-gap:0 !important; min-height:0 !important; height:auto !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .cardHeadRow{ display:flex !important; align-items:center !important; justify-content:space-between !important; flex-wrap:wrap !important; gap:4px !important; margin:0 0 4px !important; padding:0 !important; min-height:0 !important; height:auto !important; align-self:start !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .cardHeadRow h2{ margin:0 !important; line-height:1.15 !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerRow{ margin:0 !important; align-self:stretch !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerFacts{ margin-top:8px !important; align-self:stretch !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer #buyerHint, .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer #buyerHint:empty{ display:none !important; width:0 !important; height:0 !important; margin:0 !important; padding:0 !important; overflow:hidden !important; } } /* ---------------- Buyer mobile header gap final fix (v159b) ---------------- */ /* رفع فاصله زیاد بین عنوان «خریدار» و باکس «کد خریدار» در موبایل/تبلت */ @media (max-width: 980px){ .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer{ display:flex !important; flex-direction:column !important; justify-content:flex-start !important; align-items:stretch !important; align-content:flex-start !important; gap:0 !important; min-height:0 !important; height:auto !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .cardHeadRow, .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerRow, .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerFacts{ flex:0 0 auto !important; align-self:auto !important; min-height:0 !important; height:auto !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .cardHeadRow{ margin:0 0 4px !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerRow{ margin-top:0 !important; justify-content:flex-start !important; align-items:flex-end !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerRow .buyerRow__code{ min-height:0 !important; height:auto !important; align-items:flex-start !important; } } @media (max-width: 640px){ .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerRow{ flex-direction:column !important; align-items:stretch !important; gap:6px !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerRow .buyerRow__code{ align-items:stretch !important; } } /* ---------------- Buyer mobile column flex-gap fix (v160) ---------------- */ /* وقتی buyerRow در موبایل ستونی می‌شود، flex:1 روی buyerRow__code باعث ایجاد فضای خالی عمودی می‌شد */ @media (max-width: 640px){ .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerRow > .buyerRow__code, .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerRow > .buyerRow__actions{ flex: 0 0 auto !important; min-height: 0 !important; height: auto !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerRow > .buyerRow__code{ width: 100% !important; } .page--send .invSend--v2 .invHeadCol.invHeadCol--buyer > .buyerRow > .buyerRow__actions{ width: 100% !important; margin-top: 0 !important; align-self: stretch !important; } } /* ---------------- UI polish fixes (v169) ---------------- */ /* سایدبار پایین: بازگشت به حالت متن (بدون باکس) */ .sidebar__footerBottom.sidebar__footerBottom--text{ display:flex !important; flex-direction:column; align-items:flex-start; gap:4px; margin-top:8px; } .sidebar__footerBottom.sidebar__footerBottom--text .footerMetaText{ display:block; width:100%; min-height:0; padding:0; border:0; background:transparent; box-shadow:none; border-radius:0; color:var(--muted); font-size:12px; line-height:1.45; text-align:right; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .sidebar__footerBottom.sidebar__footerBottom--text .footerMetaText--user{ color:var(--text); font-weight:700; } html[data-theme="light"] .sidebar__footerBottom.sidebar__footerBottom--text .footerMetaText, body.theme-light .sidebar__footerBottom.sidebar__footerBottom--text .footerMetaText{ color:rgba(15,23,42,.72); } html[data-theme="light"] .sidebar__footerBottom.sidebar__footerBottom--text .footerMetaText--user, body.theme-light .sidebar__footerBottom.sidebar__footerBottom--text .footerMetaText--user{ color:#0f172a; } /* نمای روز: خوانایی اطلاعات پرداخت (نوع ۳) */ html[data-theme="light"] .page--send.is-type3 .invBottomCol--pay, body.theme-light .page--send.is-type3 .invBottomCol--pay{ background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96)) !important; border-color: rgba(var(--accent-rgb), .22) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 8px 20px rgba(2,6,23,.04) !important; } html[data-theme="light"] .page--send.is-type3 .invBottomCol--pay .cardHeadRow h2, body.theme-light .page--send.is-type3 .invBottomCol--pay .cardHeadRow h2, html[data-theme="light"] .page--send.is-type3 .invBottomCol--pay .cardHeadRow .muted, body.theme-light .page--send.is-type3 .invBottomCol--pay .cardHeadRow .muted{ color:#0f172a !important; } html[data-theme="light"] .page--send.is-type3 #paymentsFields > .payrowsHead, body.theme-light .page--send.is-type3 #paymentsFields > .payrowsHead{ background: rgba(15,23,42,.02) !important; border-color: rgba(15,23,42,.10) !important; } html[data-theme="light"] .page--send.is-type3 #paymentsFields > .payrowsHead .muted, body.theme-light .page--send.is-type3 #paymentsFields > .payrowsHead .muted{ color: rgba(15,23,42,.78) !important; } html[data-theme="light"] .page--send.is-type3 #paymentsFields .payrow, body.theme-light .page--send.is-type3 #paymentsFields .payrow{ background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.93)) !important; border-color: rgba(15,23,42,.10) !important; } html[data-theme="light"] .page--send.is-type3 #paymentsFields .payrow label, body.theme-light .page--send.is-type3 #paymentsFields .payrow label{ color: rgba(15,23,42,.82) !important; } html[data-theme="light"] .page--send.is-type3 #paymentsFields .payrow .in, html[data-theme="light"] .page--send.is-type3 #paymentsFields .payrow select, body.theme-light .page--send.is-type3 #paymentsFields .payrow .in, body.theme-light .page--send.is-type3 #paymentsFields .payrow select{ color: #0f172a !important; background: rgba(255,255,255,.98) !important; border-color: rgba(var(--accent-rgb), .28) !important; } html[data-theme="light"] .page--send.is-type3 #paymentsFields .payrow .in::placeholder, body.theme-light .page--send.is-type3 #paymentsFields .payrow .in::placeholder{ color: rgba(15,23,42,.45) !important; } html[data-theme="light"] .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"], body.theme-light .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]{ border-color: rgba(var(--danger-rgb), .24) !important; background: rgba(var(--danger-rgb), .06) !important; color: rgba(var(--danger-rgb), .75) !important; } html[data-theme="light"] .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]:hover, body.theme-light .page--send.is-type3 #paymentsFields .payrow .payrow__close[data-act="delpay"]:hover{ border-color: rgba(var(--danger-rgb), .34) !important; background: rgba(var(--danger-rgb), .10) !important; color: rgba(var(--danger-rgb), .90) !important; } /* نمای روز: دکمه ابطال واضح‌تر */ html[data-theme="light"] .page--send .sendDock__btn--danger, body.theme-light .page--send .sendDock__btn--danger, html[data-theme="light"] .page--send #btnCancelInvoice, body.theme-light .page--send #btnCancelInvoice{ color: #8f1422 !important; border-color: rgba(var(--danger-rgb), .38) !important; background: linear-gradient(180deg, rgba(var(--danger-rgb), .14), rgba(var(--danger-rgb), .08)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 6px 14px rgba(var(--danger-rgb), .08) !important; } html[data-theme="light"] .page--send .sendDock__btn--danger:hover, body.theme-light .page--send .sendDock__btn--danger:hover, html[data-theme="light"] .page--send #btnCancelInvoice:hover, body.theme-light .page--send #btnCancelInvoice:hover{ border-color: rgba(var(--danger-rgb), .52) !important; background: linear-gradient(180deg, rgba(var(--danger-rgb), .20), rgba(var(--danger-rgb), .12)) !important; color: #7a0f1b !important; } /* پیام هشدار ارسال هوشمند: دسکتاپ جمع‌وجورتر، موبایل خواناتر */ #scheduleModal .smartSendNote{ margin-top:8px !important; display:inline-flex !important; align-items:center; gap:5px; width:auto; max-width:min(100%, 360px); padding:4px 8px !important; border-radius:9px !important; font-size:11px !important; font-weight:700 !important; line-height:1.35 !important; color:#e35d5d !important; background:rgba(255,107,107,.07) !important; border:1px solid rgba(255,107,107,.17) !important; } #scheduleModal .smartSendNote::before{ width:13px !important; height:13px !important; flex:0 0 13px !important; font-size:9px !important; color:#ee7e7e !important; background:rgba(255,107,107,.10) !important; border-color:rgba(255,107,107,.18) !important; } @media (max-width: 640px){ #scheduleModal .smartSendNote{ display:flex !important; width:100% !important; max-width:none !important; align-items:flex-start; gap:7px; padding:7px 9px !important; border-radius:10px !important; font-size:11.5px !important; line-height:1.4 !important; } #scheduleModal .smartSendNote::before{ margin-top:1px; width:14px !important; height:14px !important; flex-basis:14px !important; font-size:10px !important; } } /* ---------------- UI polish fixes (v170) ---------------- */ /* دکمه ابطال هم‌اندازه با سایر دکمه‌ها (دسکتاپ) */ .page--send .invBottomCol--totals .sendActions.sendActions--grid #btnCancelInvoice{ grid-column:auto !important; min-height:46px !important; } @media (max-width: 980px){ .page--send .invBottomCol--totals .sendActions.sendActions--grid #btnCancelInvoice{ grid-column:auto !important; } } /* پایین سایدبار: نمایش پلن فعلی و نام کاربری زیر ردیف دکمه‌ها/تایمر */ .sidebar__footerBottom.sidebar__footerBottom--text{ direction:ltr; display:grid !important; grid-template-columns:44px minmax(0,1fr) auto; align-items:start; column-gap:8px; row-gap:2px; margin-top:6px; } .sidebar__footerBottom.sidebar__footerBottom--text #planLabel{ grid-column:2; justify-self:center; max-width:100%; text-align:center; color:var(--muted); font-size:12px; font-weight:600; } .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel{ grid-column:3; justify-self:end; max-width:132px; text-align:right; color:var(--text); font-weight:700; } .sidebar__footerBottom.sidebar__footerBottom--text .footerMetaText{ direction:rtl; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.35; } @media (max-width: 460px){ .sidebar__footerBottom.sidebar__footerBottom--text{ grid-template-columns:minmax(0,1fr); row-gap:4px; } .sidebar__footerBottom.sidebar__footerBottom--text #planLabel, .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel{ grid-column:1; justify-self:start; max-width:100%; text-align:right; } } /* مودال ارسال هوشمند: چینش ثابت و جمع‌وجور */ #scheduleModal .modal__panel{ max-width:min(92vw, 420px); } #scheduleModal .modal__body{ padding-top:12px; } #scheduleModal .scheduleModal__fields{ display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; align-items:end; } #scheduleModal .scheduleModal__field{ min-width:0 !important; } #scheduleModal .scheduleModal__field label{ display:flex; flex-direction:column; gap:6px; } #scheduleModal .scheduleModal__field--date{ grid-column:1; } #scheduleModal .scheduleModal__field--time{ grid-column:2; } #scheduleModal .scheduleModal__actions{ margin-top:12px !important; } #scheduleModal .scheduleModal__actions .btn{ min-height:40px; } #scheduleModal .smartSendNote{ margin-top:8px !important; margin-inline-start:auto; max-width:min(100%, 300px) !important; padding:4px 8px !important; font-size:10.5px !important; } @media (max-width: 640px){ #scheduleModal .modal__panel{ max-width:min(96vw, 440px); } #scheduleModal .scheduleModal__fields{ grid-template-columns:1fr; gap:8px; } #scheduleModal .scheduleModal__field--date, #scheduleModal .scheduleModal__field--time{ grid-column:1; } #scheduleModal .scheduleModal__actions{ display:flex; width:100%; gap:8px; } #scheduleModal .scheduleModal__actions .btn{ flex:1 1 0; min-height:42px; } #scheduleModal .smartSendNote{ width:100% !important; max-width:none !important; margin-inline-start:0; padding:7px 9px !important; font-size:11.5px !important; } } /* ---------------- Performance + footer + schedule modal polish (v171) ---------------- */ /* سایدبار پایین: پلن فعلی و نام کاربری روبه‌رو و خواناتر */ .sidebar__footerBottom.sidebar__footerBottom--text{ direction: rtl !important; display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; align-items: center !important; column-gap: 10px !important; row-gap: 4px !important; margin-top: 6px !important; } .sidebar__footerBottom.sidebar__footerBottom--text #planLabel, .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel{ grid-column: auto !important; justify-self: auto !important; max-width: 100% !important; min-width: 0; display: block; line-height: 1.45; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sidebar__footerBottom.sidebar__footerBottom--text #planLabel{ text-align: right !important; color: var(--muted); font-size: 12px; font-weight: 700; } .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel{ text-align: left !important; direction: ltr; unicode-bidi: plaintext; color: var(--text); font-weight: 700; } /* دکمه «خرید اشتراک» در فوتر سایدبار: خواناتر روی عرض کم */ .footerUserMini{ display: grid !important; grid-template-columns: minmax(0,1fr) 44px; gap: 8px; align-items: stretch; } .footerUserMini #btnFooterPlanBuy{ width: 100% !important; min-width: 0; min-height: 44px; height: auto; padding: 5px 8px !important; border-radius: 14px; font-size: 12.5px; font-weight: 800; line-height: 1.15; text-align: center; white-space: normal; word-break: keep-all; overflow-wrap: anywhere; } .footerUserMini #btnLogout{ width: 44px !important; min-width: 44px !important; height: 44px !important; } @media (min-width: 1180px){ .footerUserMini #btnFooterPlanBuy{ white-space: nowrap; font-size: 13px; padding-inline: 10px !important; } } /* مودال ارسال هوشمند: چینش فیلدها ثابت و هم‌راستا */ #scheduleModal .row.scheduleModal__fields{ display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; gap: 10px !important; align-items: start !important; margin-top: 10px !important; } #scheduleModal .scheduleModal__field{ min-width: 0 !important; width: 100%; } #scheduleModal .scheduleModal__field label{ display: grid !important; gap: 6px !important; align-content: start; margin: 0; } #scheduleModal .scheduleModal__field input.input--sm, #scheduleModal .scheduleModal__field input{ width: 100% !important; min-width: 0 !important; margin: 0; } #scheduleModal .scheduleModal__actions{ display: flex; justify-content: flex-end !important; gap: 8px !important; margin-top: 12px !important; } #scheduleModal .smartSendNote{ margin-top: 8px !important; margin-bottom: 0 !important; } @media (max-width: 640px){ #scheduleModal .row.scheduleModal__fields{ grid-template-columns: 1fr !important; gap: 8px !important; } } /* بهبود روانی اسکرول اقلام زیاد: کاهش هزینه paint در جدول اقلام */ .page--send .tableWrap--lines{ will-change: scroll-position; /* فقط اسکرول افقی را داخل همین باکس نگه دار؛ اسکرول عمودی با چرخ موس به صفحه منتقل شود */ overscroll-behavior-x: contain; overscroll-behavior-y: auto; } .page--send .table--lines tbody .in, .page--send .table--lines tbody .btn, .page--send .table--lines tbody .inAffix{ box-shadow: none !important; filter: none !important; } .page--send .table--lines tbody .btn{ transition: border-color .12s ease, background-color .12s ease, color .12s ease, opacity .12s ease !important; } /* ---------------- v173: footer text color + CSR generator module ---------------- */ /* متن پایین سایدبار هم‌رنگ متن پلن فعلی (تیره/Muted) */ .sidebar__footerBottom.sidebar__footerBottom--text #planLabel, .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel, .sidebar__footerBottom.sidebar__footerBottom--text .footerMetaText{ color: var(--muted) !important; } /* دکمه خرید اشتراک در عرض کم خواناتر */ .footerUserMini #btnFooterPlanBuy{ line-height: 1.05; letter-spacing: 0; font-size: 12px; display: grid; place-items: center; } @media (max-width: 420px){ .footerUserMini #btnFooterPlanBuy{ min-height: 46px; padding-inline: 6px !important; font-size: 11.5px; } } /* صفحه تولید CSR */ .csrGrid{ align-items: start; } .csrCard{ min-width: 0; } .csrForm{ gap: 10px; } .csrForm .field{ min-width: 0; } .csrForm .field > span{ display: inline-flex; align-items: center; gap: 4px; } .csrForm .req{ color: var(--danger, #ff6b6b); font-weight: 800; } .csrHint{ margin-top: 10px; padding: 10px 12px; border-radius: 12px; border: 1px solid color-mix(in oklab, var(--line) 85%, var(--primary) 15%); background: color-mix(in oklab, var(--panel) 92%, var(--primary) 8%); color: var(--muted); line-height: 1.65; font-size: 12.5px; } .csrOutBox{ border: 1px solid var(--line); border-radius: 14px; padding: 10px; margin-top: 10px; background: color-mix(in oklab, var(--panel) 97%, #000 3%); } .csrOutHead{ align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; } .csrOutHead strong{ font-size: 13px; } .csrOutText{ width: 100%; min-height: 118px; resize: vertical; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; direction: ltr; text-align: left; unicode-bidi: plaintext; line-height: 1.4; } #csrSubjectPreview{ font-size: 12px; line-height: 1.55; } @media (max-width: 900px){ .csrGrid{ grid-template-columns: 1fr !important; } } @media (max-width: 640px){ .csrOutHead{ flex-direction: column; align-items: stretch; } .csrOutHead > .row{ justify-content: flex-end; flex-wrap: wrap; } .csrActions{ justify-content: stretch !important; } .csrActions .btn{ flex: 1 1 0; } } .csrHint .csrHintSub{ display:block; margin-top:6px; font-size:12px; } #csr_name_en, #csr_email, #csr_mobile, #csr_subjectType{ direction:ltr; text-align:left; } #csr_c[readonly]{ opacity:.9; cursor:default; } /* ---------------- v179: account card alignment + compact logs ---------------- */ .accountGrid{ align-items:start; } .accountGrid > .accountCard{ min-width:0; } .accountCard h2{ line-height:1.25; } #accUserInfo.accountInfoList > .row{ min-height: 42px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in oklab, var(--panel) 94%, #000 6%); } #accUserInfo.accountInfoList > .row > :last-child{ text-align:left; min-width:0; overflow-wrap:anywhere; } .accountCard--user, .accountCard--plan, .accountCard--logs{ border-color: color-mix(in oklab, var(--line) 88%, var(--accent, #7c5cff) 12%); } .accountLogItem{ border-radius: 12px; } .accountLogItem .accountLogMeta{ border-top: 1px dashed color-mix(in oklab, var(--line) 85%, var(--accent, #7c5cff) 15%); padding-top: 6px; } html[data-theme="light"] #accUserInfo.accountInfoList > .row{ background: color-mix(in oklab, #fff 96%, var(--line) 4%); } @media (max-width: 900px){ #accUserInfo.accountInfoList > .row{ min-height: 40px; padding: 7px 9px; } .accountLogItem .row{ flex-wrap:wrap; } } /* ---------------- v180: account equal cards + bug report button/modal ---------------- */ .accountGrid{ align-items: stretch !important; } .accountGrid > .card{ height: 100%; } .accountGrid > .accountCard{ display:flex; flex-direction:column; } .accountCard--user #accUserInfo{ flex:1 1 auto; } .btn--dangerSoft{ border-color: color-mix(in oklab, var(--danger, #ef4444) 55%, var(--line) 45%) !important; color: color-mix(in oklab, var(--danger, #ef4444) 82%, white 18%) !important; background: color-mix(in oklab, var(--panel) 88%, var(--danger, #ef4444) 12%) !important; } .btn--dangerSoft:hover{ background: color-mix(in oklab, var(--panel) 80%, var(--danger, #ef4444) 20%) !important; border-color: color-mix(in oklab, var(--danger, #ef4444) 70%, var(--line) 30%) !important; } .btn--dangerSoft .btn__ico svg{ width:15px; height:15px; } #accBugModal .modal__panel{ max-width:min(94vw, 620px); } #accBugModal .out{ direction:ltr; text-align:left; } #accBugModal #accBugText{ direction:rtl; text-align:right; } #accBugModal .accBugPreview .out{ font-size:12px; line-height:1.45; } @media (max-width: 640px){ #accBugModal .modal__panel{ max-width:min(96vw, 96vw); } .btn--dangerSoft .btn__text{ display:none; } .btn--dangerSoft{ width:40px; min-width:40px; padding-inline:0 !important; } } /* Login gate */ /* v103: prevent first-load app flash before auth check finishes */ body.auth-pending{overflow:hidden;} body.auth-pending .layout, body.auth-pending .mobMenuBtn, body.auth-pending .sidebarScrim, body.auth-pending .annBell, body.auth-pending .wpAnn, body.auth-pending .modal, body.auth-pending .uploadModal, body.auth-pending #statusBar{visibility:hidden !important;pointer-events:none !important;} body.login-locked{overflow:hidden;} body.login-locked .layout, body.login-locked .mobMenuBtn, body.login-locked .sidebarScrim, body.login-locked .annBell, body.login-locked .wpAnn, body.login-locked .modal:not(#loginGate), body.login-locked .uploadModal, body.login-locked #statusBar{visibility:hidden !important;pointer-events:none !important;} .loginGate{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:18px;} .loginGate__bg{position:absolute;inset:0;background:radial-gradient(1200px 600px at 20% 10%, rgba(37,99,235,.18), transparent 55%), radial-gradient(900px 500px at 90% 80%, rgba(14,165,233,.14), transparent 55%), var(--bg, #0b1220);} .loginGate__card{position:relative;width:min(460px, calc(100vw - 24px));background:var(--card, #111827);border:1px solid var(--line, rgba(255,255,255,.12));border-radius:22px;padding:18px;box-shadow:0 24px 60px rgba(0,0,0,.35);} .loginGate__logoWrap{display:flex;justify-content:center;align-items:center;margin:-2px 0 10px;} .loginGate__logo{display:block;width:min(270px, 82%);height:auto;object-fit:contain;filter:drop-shadow(0 10px 26px rgba(0,0,0,.22));} html[data-theme="light"] .loginGate__logo{filter:drop-shadow(0 8px 20px rgba(15,23,42,.14));} .loginGate__brand{font-weight:900;font-size:20px;margin-bottom:2px;text-align:center;} .loginGate__title{font-weight:900;font-size:18px;margin-bottom:6px;text-align:center;} .loginGate__hint{color:var(--muted, #94a3b8);font-size:13px;line-height:1.8;margin-bottom:12px;text-align:center;} .loginGate__hint b{color:inherit;font-weight:900;} .loginGate__form{display:grid;gap:10px;} .loginGate__mode{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:2px;} .loginGate__modeBtn{appearance:none;border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:12px;padding:10px 8px;font-weight:800;font-size:12px;cursor:pointer;transition:.15s ease;} .loginGate__modeBtn.is-active{border-color:rgba(var(--accent-rgb),.45);background:rgba(var(--accent-rgb),.12);color:var(--accent);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.16);} .loginGate__modeBtn:focus-visible{outline:2px solid rgba(var(--accent-rgb),.35);outline-offset:1px;} #loginPassFields,#loginOtpFields,.loginGate__step{display:grid;gap:10px;} #loginPassFields[hidden],#loginOtpFields[hidden],.loginGate__step[hidden]{display:none!important;} .loginGate__form .btn{width:100%;justify-content:center;} .loginGate__form .row .btn{width:auto;min-width:max-content;} .loginGate__otpCodeRow--3{display:grid;grid-template-columns:minmax(0,1fr) 138px 126px;gap:8px;align-items:end;} .loginGate__otpCodeRow--2{display:grid;grid-template-columns:minmax(0,1fr) 140px;gap:8px;align-items:end;} .loginGate__otpCodeField{min-width:0;max-width:100%;} .loginGate__otpCodeField .input{text-align:center;letter-spacing:.3px;} .loginGate__otpSendSlot{display:grid;min-width:0;} .loginGate__otpSendSlot > .btn, .loginGate__otpSendSlot > .loginGate__otpTimer{grid-area:1/1; width:100%;} .loginGate__otpVerifyInlineBtn{min-width:126px;white-space:nowrap;} .loginGate__otpActionRow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;} .loginGate__otpActionRow .btn{width:auto!important;min-width:132px;white-space:nowrap;} .loginGate__otpTimer--inline{margin:0;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:rgba(148,163,184,.04);min-height:44px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:800;} .loginGate__otpTimer--inline.is-lock{color:#2563eb;border-color:rgba(var(--accent-rgb),.22);background:rgba(var(--accent-rgb),.06);} .loginGate__otpTimer--compact{font-size:14px;line-height:1;white-space:nowrap;padding:10px 8px;} .loginGate__otpDigits{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;direction:ltr;} .loginGate__otpDigit.input{min-height:48px;text-align:center;font-weight:900;font-size:20px;padding-inline:0;letter-spacing:0;direction:ltr;} .loginGate__otpTimer--step{margin-top:-2px;padding:8px 10px;border:1px solid rgba(var(--accent-rgb),.18);border-radius:12px;background:rgba(var(--accent-rgb),.06);text-align:center;font-weight:800;color:#2563eb;line-height:1.7;} .loginGate__otpTimer--step.is-lock{color:#2563eb;} .loginGate__otpCodeRow--startOnly{display:block;} .loginGate__otpCodeRow--startOnly .loginGate__otpStartBtn{width:100% !important;min-width:0 !important;} .loginGate__otpStartBtn{width:100% !important;display:flex;min-height:52px;font-size:16px;font-weight:800;} #loginOtpStep1 #loginSendOtpBtn,#loginOtpStep1 #loginOtpTimer{display:none !important;} #loginOtpStep2 .loginGate__otpTimer--step{margin-top:6px;padding:0;border:none !important;background:transparent !important;box-shadow:none !important;min-height:0;color:#d97706;text-align:center;font-weight:900;line-height:1.8;} #loginOtpStep2 .loginGate__otpTimer--step.is-lock{color:#d97706;} html[data-theme='light'] .loginGate__otpTimer--inline{background:rgba(37,99,235,.04);} @media (max-width:520px){.loginGate__otpCodeRow--3,.loginGate__otpCodeRow--2{grid-template-columns:1fr;}.loginGate__otpVerifyInlineBtn,.loginGate__otpSendSlot{width:100%;}.loginGate__otpActionRow{grid-template-columns:1fr;}.loginGate__otpActionRow .btn{width:100%!important;min-width:0;}.loginGate__otpDigits{gap:6px;}.loginGate__otpDigit.input{font-size:18px;min-height:44px;}} .loginGate__links{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:2px;flex-wrap:wrap;} .loginGate__link{color:var(--link, #60a5fa);text-decoration:none;font-weight:800;font-size:12px;} .loginGate__link:hover{text-decoration:underline;} .loginGate__sep{color:var(--muted, #94a3b8);font-size:12px;} .loginGate__card .input{width:100%;} .loginGate__panel[hidden]{display:none!important;} .loginGate__note{font-size:12px;line-height:1.8;color:var(--muted, #94a3b8);text-align:center;margin-top:2px;} .loginGate__note code{background:rgba(148,163,184,.16);border:1px solid rgba(148,163,184,.22);padding:1px 6px;border-radius:8px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:inherit;} .loginGate__form .btn + .btn{margin-top:4px;} .loginGate__captcha{display:grid;gap:8px;padding:10px;border:1px dashed var(--border);border-radius:12px;background:rgba(148,163,184,.05);margin-top:2px;} .loginGate__captchaHead{display:none!important;} .loginGate__captchaLabel{display:none!important;} .loginGate__captchaRefresh{display:none!important;} .loginGate__captchaRefresh span{display:none!important;} .loginGate__captchaBody{display:grid;grid-template-columns:minmax(140px,auto) 1fr;gap:8px;align-items:center;} .loginGate__captchaQuestion{ appearance:none;-webkit-appearance:none;border:none;outline:none; min-height:48px;display:flex;align-items:center;justify-content:center; padding:0 12px;border-radius:12px;border:1px solid rgba(var(--accent-rgb),.24); background:rgba(var(--accent-rgb),.08);font-weight:900;font-size:17px;letter-spacing:.35px; color:var(--text);white-space:nowrap;cursor:pointer;user-select:none; width:100%;font-family:inherit;line-height:1;transition:.12s ease; } .loginGate__captchaQuestion::after{content:'↻';font-size:14px;opacity:.65;margin-inline-start:8px;} .loginGate__captchaQuestion:hover{background:rgba(var(--accent-rgb),.11);border-color:rgba(var(--accent-rgb),.3);} .loginGate__captchaQuestion:focus-visible{box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15);} .loginGate__captchaField{margin:0;min-width:0;} .loginGate__captchaField > span{display:none;} .loginGate__captchaField .input{text-align:center;font-weight:800;letter-spacing:.2px;min-height:48px;} .loginGate__otpTimer{font-size:12px;color:var(--muted,#94a3b8);padding:2px 2px 0;line-height:1.8;} .loginGate__otpTimer.is-lock{color:#d97706;} .loginGate__otpTimer.loginGate__otpTimer--inline.is-lock{color:#2563eb;border-color:rgba(var(--accent-rgb),.22);background:rgba(var(--accent-rgb),.06);} .loginGate__otpTimer--compact{font-size:14px;line-height:1;white-space:nowrap;padding:10px 8px;} html[data-theme='light'] .loginGate__captcha{background:rgba(15,23,42,.025);} html[data-theme='light'] .loginGate__captchaQuestion{background:rgba(37,99,235,.05);border-color:rgba(37,99,235,.18);} @media (max-width: 520px){ .loginGate__captchaBody{grid-template-columns:1fr;} .loginGate__captchaQuestion{justify-content:center;padding:10px 12px;min-height:44px;} } .loginGate__form .formmsg{padding:9px 10px;border-radius:10px;border:1px solid var(--border);font-size:12px;line-height:1.7;} .loginGate__form .formmsg--ok{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.28);color:#22c55e;} .loginGate__form .formmsg--err{background:rgba(239,68,68,.10);border-color:rgba(239,68,68,.24);color:#ef4444;} .loginGate__form .formmsg--info{background:rgba(96,165,250,.10);border-color:rgba(96,165,250,.24);color:#93c5fd;} html[data-theme='light'] .loginGate__form .formmsg--ok{color:#15803d;background:rgba(22,163,74,.08);} html[data-theme='light'] .loginGate__form .formmsg--err{color:#b91c1c;background:rgba(220,38,38,.06);} html[data-theme='light'] .loginGate__form .formmsg--info{color:#1d4ed8;background:rgba(37,99,235,.06);} html[data-theme='light'] .loginGate__card{background:rgba(255,255,255,.86);backdrop-filter:blur(10px);border-color:rgba(148,163,184,.28);box-shadow:0 24px 56px rgba(15,23,42,.12);} html[data-theme='light'] .loginGate__bg{background:radial-gradient(900px 520px at 12% 8%, rgba(99,102,241,.18), transparent 60%), radial-gradient(860px 520px at 88% 16%, rgba(59,130,246,.16), transparent 62%), radial-gradient(800px 500px at 84% 88%, rgba(16,185,129,.11), transparent 58%), linear-gradient(135deg, #edf3ff 0%, #e9f7ff 42%, #eefaf4 100%);} /* v34: compact customer/item actions + narrower customer list + better invoice preview */ .table .opActions--mini{gap:4px;justify-content:center;} .table .opActions--mini .btn--iconOnly{ width:28px; min-width:28px; height:28px; padding:0; background:transparent !important; border-color:transparent !important; box-shadow:none !important; color:var(--muted); border-radius:0 !important; } .table .opActions--mini .btn--iconOnly:hover{ background:rgba(var(--accent-rgb),.08) !important; border-color:transparent !important; color:var(--accent); } .table .opActions--mini .btn--danger.btn--iconOnly{color:#ef4444;} .table .opActions--mini .btn--danger.btn--iconOnly:hover{background:rgba(239,68,68,.08) !important;color:#dc2626;} .table .opActions--mini .btn--iconOnly .btn__ico svg{width:15px;height:15px;} .table--customers .custCol--ops{min-width:74px;text-align:center;} .table--customers thead .custCol--ops{padding-inline:10px;} @media (min-width: 981px){ .grid2--customers{grid-template-columns:minmax(0, 1.08fr) minmax(320px, .92fr);} .card--customersList .row > .form:first-child{flex:0 1 240px !important;max-width:240px;} } .invPrevPanel{width:min(1180px, calc(100vw - 24px));} .invPrevToolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px;} .invPrevPager{display:flex;align-items:center;gap:8px;flex-wrap:wrap;} .invPrevSummary{display:flex;align-items:center;gap:8px;flex-wrap:wrap;} .invPrevStat{display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--border);border-radius:12px;background:rgba(148,163,184,.05);font-size:12px;} .invPrevStat strong{font-size:14px;color:var(--text);} .invPrevTableWrap{max-height:58vh;overflow:auto;border:1px solid var(--border);border-radius:16px;} .invPrevTable{margin:0;} .invPrevTable thead th{position:sticky;top:0;z-index:1;background:var(--panel);box-shadow:0 1px 0 var(--border);} .invPrevTable td{vertical-align:top;} .invPrevTable .in.in--sm{min-width:96px;} .invPrevErrCell{min-width:220px;white-space:pre-wrap;line-height:1.8;} .invPrevRow--err td{background:rgba(255,73,73,.07);} @media (max-width: 720px){ .invPrevToolbar,.invPrevActions{align-items:stretch;} .invPrevPager,.invPrevSummary{width:100%;} .invPrevPager .btn{flex:1 1 auto;} } /* ---------------- Waybill (pattern 8) layout (v157) ---------------- */ .waybillPanel{ width:100%; } .waybillPanel .waybillStack{ display:flex; flex-direction:column; gap:12px; } /* card look (reuse existing card styles) */ .waybillCard{ padding:12px; } .waybillCardHead{ display:flex; align-items:center; justify-content:space-between; gap:10px; } .waybillCardTitle{ font-weight:800; } .waybillCardActions{ display:flex; align-items:center; gap:8px; } /* service editor grid */ .waybillServiceGrid{ display:grid; grid-template-columns: repeat(12, minmax(0,1fr)); gap:10px; margin-top:10px; } .waybillServiceGrid .wb-col-6{ grid-column: span 6; } .waybillServiceGrid .wb-col-4{ grid-column: span 4; } /* shipped goods list */ .sgBlock .sgList{ display:grid; gap:8px; margin-top:10px; } .sgRow{ display:grid; grid-template-columns: 1.2fr 2fr auto; gap:8px; align-items:end; } .waybillPanel .sgRow label{ display:flex; flex-direction:column; gap:6px; width:100%; } .waybillPanel .sgRow input{ width:100%; box-sizing:border-box; } /* دکمه حذف کالای حمل‌شده: ارتفاع/ابعاد بزرگ‌تر برای لمس راحت */ .sgDelBtn{ min-width:40px; width:40px; height:40px; padding:0; font-size:22px; line-height:40px; } .sgDelBtn.btn--sm{ height:40px; } /* service table inside waybill panel */ .waybillPanel .tableWrap--lines{ margin-top:10px; overflow:auto; } /* waybill services: unit + qty are always fixed, so hide those columns to keep it compact */ .waybillPanel .table--lines th:nth-child(4), .waybillPanel .table--lines td:nth-child(4), .waybillPanel .table--lines th:nth-child(5), .waybillPanel .table--lines td:nth-child(5){ display:none; } @media (max-width: 640px){ .waybillServiceGrid .wb-col-6{ grid-column: span 12; } .waybillServiceGrid .wb-col-4{ grid-column: span 12; } .sgRow{ grid-template-columns: 1fr; align-items:stretch; } .sgRow > button{ justify-self:flex-start; } } /* ---------------- v175: tidy sidebar footer clock layout ---------------- */ /* تاریخ/ساعت عرض کامل فوتر را می‌گیرد؛ دکمه‌ها زیر آن در ردیف‌های منظم می‌مانند. */ .sidebar__footer .footerControls__top{ display:grid !important; direction:ltr; grid-template-columns:44px minmax(0,1fr) minmax(0,1fr) !important; grid-template-areas: "clock clock clock" "timer timer theme" "logout buy buy" !important; gap:8px !important; align-items:stretch !important; justify-content:stretch !important; } .sidebar__footer .footerActionsMini, .sidebar__footer .footerMetaMini, .sidebar__footer .footerUserMini{ display:contents !important; } .sidebar__footer .clockTicker--ui{ grid-area:clock !important; width:100% !important; max-width:none !important; height:48px !important; min-height:48px !important; padding:0 10px !important; } .sidebar__footer .clockTicker--ui .clockTicker__slide{ height:48px !important; min-height:48px !important; padding:0 8px !important; text-align:center !important; line-height:1.25 !important; } .sidebar__footer .clockTicker--ui .clockTicker__slide--jalali, .sidebar__footer .clockTicker--ui .clockTicker__slide--greg{ white-space:normal !important; overflow:visible !important; text-overflow:clip !important; font-size:11.5px !important; line-height:1.25 !important; } .sidebar__footer .clockTicker--ui .clockTicker__slide--time{ font-size:21px !important; } .sidebar__footer #btnThemeToggle{ grid-area:theme !important; width:100% !important; min-width:0 !important; height:44px !important; direction:rtl; } .sidebar__footer #sessionTimer{ grid-area:timer !important; width:100% !important; min-width:0 !important; height:44px !important; direction:ltr; } .sidebar__footer #btnFooterPlanBuy{ grid-area:buy !important; width:100% !important; min-width:0 !important; min-height:44px !important; height:44px !important; padding:0 10px !important; direction:rtl; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; } .sidebar__footer #btnLogout{ grid-area:logout !important; width:44px !important; min-width:44px !important; height:44px !important; padding:0 !important; } @media (max-width:360px){ .sidebar__footer .footerControls__top{ grid-template-columns:44px minmax(0,1fr) !important; grid-template-areas: "clock clock" "theme timer" "logout buy" !important; } .sidebar__footer .clockTicker--ui .clockTicker__slide--jalali, .sidebar__footer .clockTicker--ui .clockTicker__slide--greg{ font-size:10.8px !important; } } /* ---------------- v176: timer chip matches sidebar buttons + location selects ---------------- */ .sidebar__footer #sessionTimer.timerChip{ border-radius:14px !important; border:1px solid rgba(var(--accent-rgb),.26) !important; background:rgba(255,255,255,.03) !important; color:#9cc0ff !important; box-shadow:none !important; font-weight:800 !important; cursor:default !important; } .sidebar__footer #sessionTimer.timerChip .btn__ico, .sidebar__footer #sessionTimer.timerChip .btn__text{ color:inherit !important; } html[data-theme="light"] .sidebar__footer #sessionTimer.timerChip, body.theme-light .sidebar__footer #sessionTimer.timerChip{ background:rgba(255,255,255,.86) !important; color:#0b5cff !important; border-color:rgba(11,92,255,.32) !important; box-shadow:0 8px 16px rgba(2,6,23,.05) !important; } html[data-theme="dark"] .sidebar__footer #sessionTimer.timerChip{ background:rgba(255,255,255,.03) !important; color:#9cc0ff !important; border-color:rgba(var(--accent-rgb),.26) !important; box-shadow:none !important; } #p_province, #p_city, #cust_province, #cust_city{ width:100%; } /* ---------------- v177: compact footer + side-by-side print asset previews + faster SelectX ---------------- */ .sidebar__footer .footerControls__top{ gap:6px !important; } .sidebar__footer .clockTicker--ui{ height:42px !important; min-height:42px !important; border-radius:13px !important; padding:0 8px !important; } .sidebar__footer .clockTicker--ui .clockTicker__slide{ height:42px !important; min-height:42px !important; padding:0 6px !important; } .sidebar__footer .clockTicker--ui .clockTicker__slide--jalali, .sidebar__footer .clockTicker--ui .clockTicker__slide--greg{ font-size:11px !important; line-height:1.18 !important; } .sidebar__footer .clockTicker--ui .clockTicker__slide--time{ font-size:20px !important; } .sidebar__footer #btnThemeToggle, .sidebar__footer #sessionTimer, .sidebar__footer .timerChip, .sidebar__footer #btnFooterPlanBuy{ height:40px !important; min-height:40px !important; border-radius:13px !important; padding-block:0 !important; } .sidebar__footer #btnLogout, .sidebar__footer .btn--icon{ width:40px !important; min-width:40px !important; height:40px !important; min-height:40px !important; border-radius:13px !important; } .sidebar__footerBottom{ margin-top:6px !important; gap:6px !important; } .printActions--split .printPreviews, .printPreviews.is-show{ display:grid !important; grid-template-columns:repeat(2, minmax(0, 1fr)); align-items:center !important; gap:10px !important; width:100% !important; max-width:none !important; } .printActions--split .printPreviews .muted.small{ grid-column:1 / -1; display:block; } .printActions--split #p_logoPreview, .printActions--split #p_signPreview{ width:100%; max-width:160px; height:76px; max-height:76px; object-fit:contain; } .printActions--split #p_logoPreview{justify-self:end;} .printActions--split #p_signPreview{justify-self:start;} @media (max-width:980px){ .printActions--split .printPreviews{ flex:1 1 100% !important; grid-template-columns:repeat(2, minmax(0, 1fr)) !important; } .printActions--split .printPreviews .muted.small{display:block !important;} .printActions--split .imgPreview{max-width:100%;max-height:76px;} } .selectx-hint{ justify-content:center; text-align:center; color:var(--muted); font-size:11.5px; cursor:default !important; } /* ---------------- v178: customer buyer type labels + legal form alignment ---------------- */ .customerForm > label{ min-width:0; } .customerForm #cust_branchRow, .customerForm #cust_caseRow{ grid-column:span 6; } .customerForm.customerForm--legal #cust_regRow, .customerForm.customerForm--legal #cust_branchRow, .customerForm.customerForm--legal #cust_caseRow{ grid-column:span 4; } .customerForm select#cust_buyerType, .customerForm .selectx[data-for="cust_buyerType"] .selectx__button{ letter-spacing:0; } @media (max-width:980px){ .customerForm #cust_branchRow, .customerForm #cust_caseRow{ grid-column:span 6 !important; } .customerForm.customerForm--legal #cust_regRow, .customerForm.customerForm--legal #cust_branchRow{ grid-column:span 6 !important; } .customerForm.customerForm--legal #cust_caseRow{ grid-column:span 12 !important; } } /* ---------------- v181: compact companies table + auto-code hints ---------------- */ #companies .table th, #companies .table td{ vertical-align:middle; } @media (min-width: 641px){ #companies .opsRow{ display:grid !important; grid-template-columns:repeat(2, minmax(92px, 1fr)); gap:6px !important; align-items:center !important; justify-content:center !important; } #companies .opsRow .btn{ width:100% !important; min-height:34px; padding:0 10px; border-radius:12px; } #companies .table th, #companies .table td{ padding-top:8px; padding-bottom:8px; } } @media (max-width: 640px){ #companies .companyCard__actions{ display:grid; grid-template-columns:1fr 1fr; } #companies .companyCard__actions .btn{ width:100%; } } /* ---------------- v181: print asset refresh + slightly lower sidebar footer ---------------- */ .sidebar__footer{ transform:translateY(5px); } /* ---------------- v181: redesigned send queue page ---------------- */ .jobsSummary{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:12px 0 14px; } .jobMetric{ position:relative; overflow:hidden; min-height:86px; padding:12px 14px; border:1px solid var(--border); border-radius:18px; background:linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.025)); box-shadow:0 12px 30px rgba(0,0,0,.14); } .jobMetric::before{ content:""; position:absolute; inset-inline-start:0; top:0; width:4px; height:100%; background:rgba(var(--accent-rgb),.85); } .jobMetric span{display:block;color:var(--muted);font-size:12px;margin-bottom:4px} .jobMetric b{display:block;font-size:24px;line-height:1.1;color:var(--text);font-weight:950} .jobMetric small{display:block;color:var(--muted2);font-size:11px;margin-top:5px} .jobMetric--ok::before{background:rgba(34,197,94,.9)} .jobMetric--wait::before{background:rgba(245,158,11,.95)} .jobMetric--err::before{background:rgba(var(--danger-rgb),.95)} .jobCards{ display:flex; flex-direction:column; gap:12px; } .jobCard{ position:relative; overflow:hidden; padding:14px; border:1px solid var(--border); border-radius:20px; background: radial-gradient(720px 180px at 95% 0%, rgba(var(--accent-rgb),.10), transparent 42%), linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.025)); box-shadow:0 14px 40px rgba(0,0,0,.16); } .jobCard::before{ content:""; position:absolute; inset-inline-start:0; top:0; width:5px; height:100%; background:rgba(var(--accent-rgb),.8); } .jobCard.is-ok::before,.jobCard.is-sent::before{background:rgba(34,197,94,.95)} .jobCard.is-failed::before{background:rgba(var(--danger-rgb),.95)} .jobCard.is-processing::before{background:rgba(59,130,246,.95)} .jobCard.is-pending::before{background:rgba(245,158,11,.95)} .jobCard__top{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding-inline-start:2px; } .jobCard__eyebrow{color:var(--muted);font-size:12px;margin-bottom:4px} .jobCard__title{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:18px;font-weight:950;color:var(--text)} .jobCard__id{font-weight:800;color:var(--muted)} .jobCard__statusStack{display:flex;gap:6px;align-items:flex-end;justify-content:flex-start;flex-wrap:wrap;min-width:160px} .jobPill{ display:inline-flex; align-items:center; justify-content:center; min-height:28px; padding:5px 10px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.055); color:var(--text); font-size:12px; font-weight:850; white-space:nowrap; } .jobPill.is-ok,.jobPill.is-sent{color:#22c55e;border-color:rgba(34,197,94,.45);background:rgba(34,197,94,.12)} .jobPill.is-failed{color:#ff8b92;border-color:rgba(var(--danger-rgb),.50);background:rgba(var(--danger-rgb),.12)} .jobPill.is-processing{color:#93c5fd;border-color:rgba(59,130,246,.45);background:rgba(59,130,246,.12)} .jobPill.is-pending{color:#fbbf24;border-color:rgba(245,158,11,.46);background:rgba(245,158,11,.12)} .jobPill--remote{opacity:.92} .jobCard__meta{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:13px; } .jobMeta{ min-width:0; padding:10px 11px; border:1px solid rgba(255,255,255,.075); border-radius:14px; background:rgba(0,0,0,.12); } .jobMeta span{display:block;color:var(--muted2);font-size:11px;margin-bottom:4px} .jobMeta b{display:block;color:var(--text);font-size:12px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .jobMeta--mono b{direction:ltr;text-align:left;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;unicode-bidi:plaintext} .jobCard__error{ margin-top:12px; padding:10px 12px; border-radius:14px; border:1px solid rgba(var(--danger-rgb),.24); background:rgba(var(--danger-rgb),.08); } .jobCard__error span{display:block;color:#ffb4b9;font-size:12px;font-weight:900;margin-bottom:4px} .jobCard__error p{margin:0;color:var(--text);font-size:12px;line-height:1.8} .jobCard__okHint{ margin-top:12px; padding:9px 12px; border-radius:14px; border:1px solid rgba(34,197,94,.20); background:rgba(34,197,94,.07); color:var(--muted); font-size:12px; } .jobCard__actions{ display:flex; justify-content:flex-end; align-items:center; gap:8px; flex-wrap:wrap; margin-top:12px; } .jobCard__actions .btn{min-width:96px} .jobEmpty{ display:flex; gap:12px; align-items:center; padding:18px; margin-top:12px; border:1px dashed var(--border); border-radius:20px; background:rgba(255,255,255,.035); } .jobEmpty__icon .btn__ico{width:34px;height:34px;color:var(--muted)} .jobEmpty b{display:block;color:var(--text);font-size:15px;margin-bottom:4px} .jobEmpty p{margin:0;color:var(--muted);font-size:12px;line-height:1.8} html[data-theme="light"] .jobMetric, body.theme-light .jobMetric, html[data-theme="light"] .jobCard, body.theme-light .jobCard{ background:linear-gradient(180deg, #fff, rgba(248,250,252,.92)); box-shadow:0 12px 32px rgba(15,23,42,.07); } html[data-theme="light"] .jobMeta, body.theme-light .jobMeta{ background:rgba(15,23,42,.025); border-color:rgba(15,23,42,.08); } html[data-theme="light"] .jobCard__error, body.theme-light .jobCard__error{background:rgba(var(--danger-rgb),.07)} html[data-theme="light"] .jobCard__okHint, body.theme-light .jobCard__okHint{background:rgba(34,197,94,.07)} @media (max-width: 1120px){ .jobsSummary{grid-template-columns:repeat(2,minmax(0,1fr))} .jobCard__meta{grid-template-columns:repeat(2,minmax(0,1fr))} } @media (max-width: 640px){ .jobsSummary{grid-template-columns:1fr} .jobCard{padding:12px} .jobCard__top{flex-direction:column;align-items:stretch} .jobCard__statusStack{min-width:0;justify-content:flex-start} .jobCard__meta{grid-template-columns:1fr} .jobCard__actions{justify-content:stretch} .jobCard__actions .btn{flex:1 1 120px;min-width:0} } /* ---------------- v182: compact send queue for large invoice volume ---------------- */ .jobsSummary--compact{ grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:12px; } .jobsSummary--compact .jobMetric{ min-height:64px; padding:10px 12px; } .jobsSummary--compact .jobMetric b{font-size:20px} .jobListCompact{ display:grid; gap:8px; } .jobRow{ position:relative; overflow:hidden; border:1px solid var(--border); border-radius:18px; background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02)); box-shadow:0 10px 26px rgba(0,0,0,.12); } .jobRow__stripe{ position:absolute; inset:0 auto 0 0; width:4px; background:rgba(148,163,184,.65); } .jobRow.is-ok .jobRow__stripe,.jobRow.is-sent .jobRow__stripe{background:rgba(34,197,94,.95)} .jobRow.is-failed .jobRow__stripe{background:rgba(var(--danger-rgb),.95)} .jobRow.is-processing .jobRow__stripe{background:rgba(59,130,246,.95)} .jobRow.is-pending .jobRow__stripe{background:rgba(245,158,11,.95)} .jobRow__main{ display:grid; grid-template-columns:minmax(250px,1fr) minmax(220px,1.4fr) auto; align-items:center; gap:10px; padding:10px 14px 10px 12px; } .jobRow__primary{ display:flex; align-items:center; gap:10px; min-width:0; } .jobRow__invoice{ display:flex; align-items:center; gap:8px; min-width:0; } .jobRow__invoice b{ color:var(--text); font-size:15px; font-weight:950; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .jobRow__op{ color:var(--muted); font-size:12px; font-weight:850; background:rgba(255,255,255,.055); border:1px solid var(--border); border-radius:999px; padding:3px 8px; white-space:nowrap; } .jobRow__id{font-size:11px;color:var(--muted);font-weight:800} .jobRow__status{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; min-width:0; } .jobRow__brief{ display:flex; align-items:center; gap:10px; min-width:0; color:var(--muted); font-size:12px; line-height:1.6; } .jobRow__brief > span{ white-space:nowrap; } .jobRow__brief b{color:var(--text);font-weight:850} .jobRow__err{ color:#ffb4b9; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1 1 auto; } .jobRow__ok{color:#86efac} .jobRow__actions{ display:flex; align-items:center; justify-content:flex-end; gap:6px; flex-wrap:nowrap; } .jobRow__actions .btn{min-width:0;white-space:nowrap;padding-inline:10px} .jobAdvanced{ border-top:1px solid rgba(255,255,255,.07); background:rgba(0,0,0,.10); } .jobAdvanced summary{ cursor:pointer; user-select:none; list-style:none; padding:8px 14px; color:var(--muted); font-weight:900; font-size:12px; } .jobAdvanced summary::-webkit-details-marker{display:none} .jobAdvanced summary::before{ content:'+'; display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; margin-inline-end:6px; border-radius:999px; border:1px solid var(--border); color:var(--text); } .jobAdvanced[open] summary::before{content:'−'} .jobAdvanced__grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:0 14px 12px; } .jobAdvanced__cell{ min-width:0; border:1px solid rgba(255,255,255,.07); border-radius:12px; background:rgba(255,255,255,.035); padding:8px 10px; } .jobAdvanced__cell span{ display:block; color:var(--muted2); font-size:11px; margin-bottom:4px; } .jobAdvanced__cell b{ display:block; color:var(--text); font-size:12px; font-weight:850; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .jobAdvanced__cell--mono b{ direction:ltr; text-align:left; font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; unicode-bidi:plaintext; } .jobAdvanced__error{ margin:0 14px 12px; border:1px solid rgba(var(--danger-rgb),.22); border-radius:12px; background:rgba(var(--danger-rgb),.08); padding:10px 12px; } .jobAdvanced__error span{ display:block; color:#ffb4b9; font-size:12px; font-weight:900; margin-bottom:4px; } .jobAdvanced__error p{ margin:0; color:var(--text); font-size:12px; line-height:1.8; } html[data-theme="light"] .jobRow, body.theme-light .jobRow{ background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(248,250,252,.92)); box-shadow:0 10px 24px rgba(15,23,42,.08); } html[data-theme="light"] .jobAdvanced, body.theme-light .jobAdvanced{background:rgba(15,23,42,.025)} html[data-theme="light"] .jobAdvanced__cell, body.theme-light .jobAdvanced__cell{background:rgba(15,23,42,.025);border-color:rgba(15,23,42,.08)} @media (max-width:1100px){ .jobRow__main{grid-template-columns:1fr;align-items:stretch} .jobRow__actions{justify-content:flex-start;flex-wrap:wrap} .jobAdvanced__grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media (max-width:760px){ .jobsSummary--compact{grid-template-columns:repeat(2,minmax(0,1fr))} .jobRow__primary{flex-direction:column;align-items:flex-start} .jobRow__brief{flex-wrap:wrap} .jobRow__brief > span{white-space:normal} .jobRow__actions .btn{flex:1 1 110px} .jobAdvanced__grid{grid-template-columns:1fr} } /* ---------------- v183: global queue metrics + compact invoice facts ---------------- */ .jobsSummary--compact .jobMetric{ font:inherit; text-align:start; color:inherit; cursor:pointer; appearance:none; -webkit-appearance:none; transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease; } .jobsSummary--compact .jobMetric:hover{ transform:translateY(-1px); border-color:rgba(var(--accent-rgb),.42); box-shadow:0 14px 34px rgba(0,0,0,.18); } .jobsSummary--compact .jobMetric.is-active{ border-color:rgba(var(--accent-rgb),.72); background:linear-gradient(180deg, rgba(var(--accent-rgb),.18), rgba(var(--accent-rgb),.055)); box-shadow:0 0 0 2px rgba(var(--accent-rgb),.10), 0 16px 36px rgba(0,0,0,.18); } .jobsSummary--compact .jobMetric.is-active small{ color:rgba(var(--accent-rgb),.95); font-weight:850; } .jobRow__main{ grid-template-columns:minmax(240px,.9fr) minmax(360px,1.8fr) auto; } .jobRow__brief > span b[title]{ max-width:240px; display:inline-block; vertical-align:bottom; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } html[data-theme="light"] .jobsSummary--compact .jobMetric.is-active, body.theme-light .jobsSummary--compact .jobMetric.is-active{ background:linear-gradient(180deg, rgba(var(--accent-rgb),.12), rgba(var(--accent-rgb),.035)); } @media (max-width:1100px){ .jobRow__main{grid-template-columns:1fr;} .jobRow__brief > span b[title]{max-width:100%;} } /* ---------------- v184: compact row-based send queue ---------------- */ .jobBulkBar{ display:flex; align-items:center; justify-content:flex-start; gap:8px; flex-wrap:wrap; margin:8px 0 10px; padding:8px 10px; border:1px solid rgba(var(--border-rgb),.75); background:rgba(15,23,42,.20); border-radius:16px; } .jobSelectAll{ display:inline-flex; align-items:center; gap:7px; color:var(--muted); font-size:12px; font-weight:850; cursor:pointer; user-select:none; } .jobBulkBar__count{ color:var(--muted); font-size:12px; margin-inline-start:auto; } .jobBulkBar__count b{color:var(--text);font-weight:950} .jobQueueTableWrap{border-radius:18px;overflow:auto;max-height:min(66vh,760px)} .jobQueueTable{min-width:1180px;font-size:12px} .jobQueueTable th, .jobQueueTable td{padding:8px 9px;vertical-align:middle} .jobQueueTable thead th{ position:sticky; top:0; z-index:2; background:rgba(15,23,42,.96); backdrop-filter:blur(10px); } .jobTableRow{border-inline-start:3px solid transparent} .jobTableRow.is-ok,.jobTableRow.is-sent{border-inline-start-color:rgba(34,197,94,.95)} .jobTableRow.is-failed{border-inline-start-color:rgba(var(--danger-rgb),.95)} .jobTableRow.is-processing{border-inline-start-color:rgba(59,130,246,.95)} .jobTableRow.is-pending{border-inline-start-color:rgba(245,158,11,.95)} .jobTableRow:hover{background:rgba(148,163,184,.075)} .jobCellInvoice{white-space:nowrap;min-width:112px} .jobCellInvoice > div{display:flex;align-items:center;gap:6px;margin-bottom:2px} .jobCellInvoice b{font-size:13px;font-weight:950;color:var(--text)} .jobCellInvoice small{display:block;color:var(--muted2);font-size:10px;direction:ltr;text-align:right} .jobCellTitle{min-width:165px;max-width:240px;font-weight:850;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .jobCellBuyer{min-width:150px;max-width:230px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .jobCellAmount{min-width:95px;font-weight:900;color:var(--text);white-space:nowrap} .jobCellErr{min-width:190px;max-width:310px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .jobTableActions{min-width:260px} .jobActionGroup{display:flex;align-items:center;gap:5px;justify-content:flex-start;flex-wrap:nowrap;white-space:nowrap} .jobActionGroup .btn{min-width:0;padding:6px 8px} .jobActionGroup .btn--iconOnly{width:30px;height:30px;padding:0;display:inline-flex;align-items:center;justify-content:center} .jobActionGroup .btn.is-active{border-color:rgba(var(--primary-rgb),.65);background:rgba(var(--primary-rgb),.16);color:var(--primary-200)} .jobAdvancedRow > td{padding:0 8px 8px !important;background:rgba(15,23,42,.16)} .jobAdvanced--table{margin:0;border-radius:14px;border:1px solid rgba(var(--border-rgb),.65);background:rgba(15,23,42,.22);padding:10px} .jobAdvancedRow[hidden]{display:none!important} html[data-theme="light"] .jobBulkBar, body.theme-light .jobBulkBar, html[data-theme="light"] .jobAdvancedRow > td, body.theme-light .jobAdvancedRow > td, html[data-theme="light"] .jobAdvanced--table, body.theme-light .jobAdvanced--table{background:rgba(15,23,42,.035)} html[data-theme="light"] .jobQueueTable thead th, body.theme-light .jobQueueTable thead th{background:rgba(248,250,252,.96)} @media (max-width:980px){ .jobQueueTableWrap{max-height:none} .jobQueueTable{min-width:980px} .jobBulkBar__count{margin-inline-start:0} } /* ---------------- v185: queue full redesign + compact advanced toggle ---------------- */ .jobBulkBar--redesign{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border:1px solid rgba(var(--border-rgb),.68); border-radius:16px; background:linear-gradient(180deg,rgba(15,23,42,.52),rgba(15,23,42,.28)); box-shadow:0 12px 30px rgba(0,0,0,.10); } .jobBulkBar__main,.jobBulkBar__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .jobBulkBar--redesign .btn{min-height:32px;padding-block:6px} .jobQueueShell{ margin-top:10px; border:1px solid rgba(var(--border-rgb),.70); border-radius:18px; overflow:hidden; background:rgba(15,23,42,.22); box-shadow:0 18px 45px rgba(0,0,0,.12); } .jobQueueHead, .jobQueueLine{ display:grid; grid-template-columns:34px 34px minmax(220px,1.35fr) minmax(170px,.85fr) minmax(230px,1.05fr) minmax(220px,1fr) minmax(250px,.95fr); align-items:center; gap:10px; } .jobQueueHead{ position:sticky; top:0; z-index:2; padding:9px 12px; color:var(--muted2); font-size:11px; font-weight:900; background:rgba(15,23,42,.96); border-bottom:1px solid rgba(var(--border-rgb),.70); backdrop-filter:blur(12px); } .jobQueueRows{max-height:min(70vh,820px);overflow:auto} .jobQueueItem{ position:relative; border-bottom:1px solid rgba(var(--border-rgb),.52); background:linear-gradient(90deg,rgba(148,163,184,.035),transparent 42%); } .jobQueueItem:last-child{border-bottom:0} .jobQueueItem::before{ content:''; position:absolute; inset-block:0; inset-inline-start:0; width:3px; background:rgba(148,163,184,.42); } .jobQueueItem.is-ok::before,.jobQueueItem.is-sent::before{background:rgba(34,197,94,.95)} .jobQueueItem.is-failed::before{background:rgba(var(--danger-rgb),.95)} .jobQueueItem.is-processing::before{background:rgba(59,130,246,.95)} .jobQueueItem.is-pending::before{background:rgba(245,158,11,.95)} .jobQueueItem:hover{background:rgba(148,163,184,.075)} .jobQueueLine{padding:9px 12px;min-height:58px} .jobQueueCheck{display:flex;align-items:center;justify-content:center} .jobMoreBtn{ width:26px; height:26px; border-radius:9px; border:1px solid rgba(var(--border-rgb),.75); color:var(--muted); background:rgba(148,163,184,.08); display:inline-flex; align-items:center; justify-content:center; font-size:18px; font-weight:900; line-height:1; cursor:pointer; transition:.18s ease; } .jobMoreBtn:hover:not(:disabled){color:var(--text);border-color:rgba(var(--primary-rgb),.55);background:rgba(var(--primary-rgb),.13)} .jobMoreBtn.is-active{color:var(--primary-200);border-color:rgba(var(--primary-rgb),.70);background:rgba(var(--primary-rgb),.18)} .jobMoreBtn.is-active{font-size:0} .jobMoreBtn.is-active::after{content:'−';font-size:20px;font-weight:950;line-height:1} .jobMoreBtn:disabled{opacity:.35;cursor:not-allowed} .jobMainInfo{min-width:0} .jobMainInfo__top{display:flex;align-items:center;gap:6px;min-width:0;margin-bottom:4px} .jobInvoiceNo{font-size:14px;font-weight:950;color:var(--text);letter-spacing:.1px;white-space:nowrap} .jobQueueId{direction:ltr;color:var(--muted2);font-size:11px;white-space:nowrap} .jobMainInfo__title{color:var(--muted);font-size:12px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%} .jobBuyerAmount{min-width:0;display:flex;flex-direction:column;gap:4px} .jobBuyerAmount b{color:var(--text);font-size:12px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .jobBuyerAmount span{color:var(--primary-200);font-size:12px;font-weight:950;white-space:nowrap} .jobStatuses{display:flex;align-items:center;gap:5px;flex-wrap:wrap;min-width:0} .jobPill--soft{ color:var(--muted); background:rgba(148,163,184,.10); border-color:rgba(var(--border-rgb),.62); } .jobTryBadge{ display:inline-flex; align-items:center; justify-content:center; min-height:24px; padding:3px 8px; border-radius:999px; color:var(--muted); background:rgba(148,163,184,.10); border:1px solid rgba(var(--border-rgb),.55); font-size:11px; font-weight:900; white-space:nowrap; } .jobErrCompact{min-width:0;color:var(--muted);font-size:12px;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .jobErrCompact .jobRow__ok{color:rgba(34,197,94,.9);font-weight:900} .jobRowActions{display:flex;align-items:center;gap:5px;justify-content:flex-start;white-space:nowrap;overflow:hidden} .jobRowActions .btn{min-width:0;padding:6px 8px;min-height:30px} .jobRowActions .btn--iconOnly{width:30px;height:30px;padding:0;display:inline-flex;align-items:center;justify-content:center} .jobAdvancedRowPanel{padding:0 46px 10px 12px;background:rgba(15,23,42,.16)} .jobAdvancedRowPanel[hidden]{display:none!important} .jobAdvanced--inline{margin:0;border-radius:14px;border:1px solid rgba(var(--border-rgb),.65);background:rgba(15,23,42,.24);padding:10px} html[data-theme="light"] .jobBulkBar--redesign, body.theme-light .jobBulkBar--redesign, html[data-theme="light"] .jobQueueShell, body.theme-light .jobQueueShell, html[data-theme="light"] .jobAdvancedRowPanel, body.theme-light .jobAdvancedRowPanel, html[data-theme="light"] .jobAdvanced--inline, body.theme-light .jobAdvanced--inline{background:rgba(15,23,42,.035)} html[data-theme="light"] .jobQueueHead, body.theme-light .jobQueueHead{background:rgba(248,250,252,.96)} html[data-theme="light"] .jobQueueItem, body.theme-light .jobQueueItem{background:rgba(255,255,255,.55)} html[data-theme="light"] .jobQueueItem:hover, body.theme-light .jobQueueItem:hover{background:rgba(15,23,42,.035)} @media (max-width:1180px){ .jobQueueHead{display:none} .jobQueueRows{max-height:none} .jobQueueLine{grid-template-columns:34px 34px minmax(180px,1fr) minmax(150px,.9fr);gap:8px;align-items:start} .jobStatuses,.jobErrCompact,.jobRowActions{grid-column:3 / -1} .jobRowActions{overflow:visible;flex-wrap:wrap} .jobAdvancedRowPanel{padding-inline-start:46px} } @media (max-width:720px){ .jobBulkBar--redesign{align-items:stretch;flex-direction:column} .jobBulkBar__actions .btn{flex:1 1 auto} .jobQueueLine{grid-template-columns:30px 30px minmax(0,1fr);padding:10px;min-height:0} .jobBuyerAmount,.jobStatuses,.jobErrCompact,.jobRowActions{grid-column:3 / -1} .jobBuyerAmount{margin-top:2px} .jobAdvancedRowPanel{padding:0 10px 10px} .jobAdvanced__grid{grid-template-columns:1fr} } /* ---------------- v186: queue list inspired by invoice table + smaller metrics ---------------- */ .jobsSummary--compact{ gap:8px; margin-bottom:8px; } .jobsSummary--compact .jobMetric{ min-height:48px; padding:7px 10px; border-radius:16px; } .jobsSummary--compact .jobMetric span{ font-size:11px; line-height:1.2; } .jobsSummary--compact .jobMetric b{ font-size:16px; line-height:1.15; margin-top:2px; } .jobsSummary--compact .jobMetric small{ font-size:10px; margin-top:2px; opacity:.8; } .jobBulkBar--redesign{ padding:7px 9px; margin:6px 0 8px; border-radius:14px; box-shadow:none; } .jobBulkBar--redesign .btn{ min-height:28px; padding-block:5px; } .jobQueueListWrap{ border-radius:18px; overflow:auto; max-height:min(70vh,820px); border:1px solid rgba(var(--border-rgb),.68); background:rgba(15,23,42,.16); } .jobQueueListTable{ min-width:1180px; font-size:12px; } .jobQueueListTable th, .jobQueueListTable td{ padding:7px 8px; vertical-align:middle; } .jobQueueListTable thead th{ position:sticky; top:0; z-index:3; background:rgba(15,23,42,.96); backdrop-filter:blur(10px); color:var(--muted2); font-size:11px; font-weight:900; white-space:nowrap; } .jobQueueTableRow{ border-inline-start:3px solid transparent; } .jobQueueTableRow:hover{ background:rgba(148,163,184,.075); } .jobQueueTableRow.is-ok, .jobQueueTableRow.is-sent{border-inline-start-color:rgba(34,197,94,.95)} .jobQueueTableRow.is-failed{border-inline-start-color:rgba(var(--danger-rgb),.95)} .jobQueueTableRow.is-processing{border-inline-start-color:rgba(59,130,246,.95)} .jobQueueTableRow.is-pending{border-inline-start-color:rgba(245,158,11,.95)} .jobQInvCell{ min-width:96px; white-space:nowrap; } .jobQInvCell > div{ display:flex; align-items:center; gap:6px; } .jobQInvCell b{ color:var(--text); font-size:13px; font-weight:950; } .jobQInvCell span{ display:inline-flex; align-items:center; min-height:19px; padding:2px 7px; border-radius:999px; color:var(--muted); background:rgba(148,163,184,.10); border:1px solid rgba(var(--border-rgb),.56); font-size:10px; font-weight:900; } .jobQInvCell small{ display:block; direction:ltr; text-align:right; color:var(--muted2); font-size:10px; margin-top:2px; } .jobQTitleCell{ min-width:170px; max-width:260px; font-weight:850; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .jobQBuyerCell{ min-width:145px; max-width:225px; color:var(--muted); white-space:normal; overflow:hidden; } .jobQBuyerCell .jobQBuyerPattern{ display:block; color:var(--muted2); font-size:9px; line-height:1.25; margin-bottom:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .jobQBuyerCell .jobQBuyerName{ display:block; color:var(--text); font-size:11px; font-weight:750; line-height:1.35; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .jobQAmountCell{ min-width:92px; color:var(--text); font-weight:900; white-space:nowrap; } .jobQStatusCell, .jobQRemoteCell{ min-width:118px; white-space:nowrap; } .jobQStatusCell small, .jobQRemoteCell small{ display:block; color:var(--muted2); font-size:10px; margin-top:3px; } .jobQErrCell{ min-width:132px; max-width:190px; color:var(--muted); font-size:10.5px; line-height:1.5; white-space:normal; overflow:hidden; } .jobErrMoreLink{ display:inline-flex; align-items:center; justify-content:center; margin-inline-start:4px; padding:0; border:0; background:transparent; color:var(--primary); font-size:10px; font-weight:700; cursor:pointer; } .jobErrMoreLink:hover{ text-decoration:underline; } .jobQActionsCell{ min-width:236px; } .jobRowActions--table{ display:flex; align-items:center; gap:5px; justify-content:flex-start; overflow:visible; flex-wrap:nowrap; } .jobRowActions--table .btn{ min-width:0; min-height:28px; padding:5px 7px; } .jobRowActions--table .btn--iconOnly{ width:28px; height:28px; padding:0; display:inline-flex; align-items:center; justify-content:center; } .jobMoreBtn--tiny{ width:24px; height:24px; border-radius:8px; font-size:16px; } .jobMoreBtn--tiny.is-active::after{ font-size:18px; } .jobAdvancedTableRow > td{ padding:0 8px 8px !important; background:rgba(15,23,42,.18); } .jobAdvancedTableRow[hidden]{display:none!important} .jobAdvanced--invoiceList{ margin:0; border-radius:14px; border:1px solid rgba(var(--border-rgb),.65); background:rgba(15,23,42,.24); padding:10px; } html[data-theme="light"] .jobQueueListWrap, body.theme-light .jobQueueListWrap, html[data-theme="light"] .jobAdvancedTableRow > td, body.theme-light .jobAdvancedTableRow > td, html[data-theme="light"] .jobAdvanced--invoiceList, body.theme-light .jobAdvanced--invoiceList{ background:rgba(15,23,42,.035); } html[data-theme="light"] .jobQueueListTable thead th, body.theme-light .jobQueueListTable thead th{ background:rgba(248,250,252,.96); } @media (max-width:980px){ .jobsSummary--compact{grid-template-columns:repeat(2,minmax(0,1fr));} .jobQueueListWrap{max-height:none;} .jobQueueListTable{min-width:1080px;} } @media (max-width:640px){ .jobsSummary--compact .jobMetric{min-height:44px;padding:6px 8px;} .jobsSummary--compact .jobMetric b{font-size:15px;} } /* ---------------- v187: compact send queue row actions + sent date ---------------- */ .jobsSummary--compact{ gap:6px; margin-bottom:6px; } .jobsSummary--compact .jobMetric{ min-height:40px; padding:5px 8px; border-radius:14px; } .jobsSummary--compact .jobMetric span{font-size:10px;margin-bottom:1px;} .jobsSummary--compact .jobMetric b{font-size:14px;line-height:1.05;margin-top:0;} .jobsSummary--compact .jobMetric small{font-size:9px;margin-top:1px;} .jobBulkBar--redesign{padding:6px 8px;margin:5px 0 7px;} .jobBulkBar--redesign .btn{min-height:26px;padding:4px 7px;font-size:11px;} .jobQueueListTable{min-width:1240px;font-size:11.5px;} .jobQueueListTable th, .jobQueueListTable td{padding:6px 7px;} .jobQTitleCell{min-width:160px;max-width:240px;} .jobQBuyerCell{min-width:138px;max-width:215px;} .jobQAmountCell{min-width:84px;} .jobQTimeCell{ min-width:132px; max-width:170px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .jobQTimeCell b{ display:block; color:var(--text); font-size:11px; font-weight:850; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .jobQTimeCell small{ display:block; margin-top:2px; color:var(--muted2); font-size:9.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .jobQStatusCell,.jobQRemoteCell{min-width:108px;} .jobQErrCell{min-width:125px;max-width:175px;} .jobQActionsCell{min-width:126px;} .jobRowActions--table{gap:4px;justify-content:center;} .jobRowActions--table .btn, .jobRowActions--table .btn--iconOnly{ width:25px; height:25px; min-width:25px; min-height:25px; padding:0; border-radius:8px; } .jobRowActions--table .btn .btn__ico{width:14px;height:14px;} .jobMoreBtn--tiny{width:22px;height:22px;border-radius:7px;font-size:15px;} @media (max-width: 860px){ .jobQueueListTable{min-width:1120px;} .jobsSummary--compact{grid-template-columns:repeat(2,minmax(0,1fr));} } /* ---------------- v188: send queue filters + compact invoice-like actions ---------------- */ section[data-page="jobs"] .inv-toolbar2 .field.invtf{ margin:0; } section[data-page="jobs"] .inv-toolbar2__row--top .invtf{min-width:160px;flex:0 0 auto;} section[data-page="jobs"] .inv-toolbar2__row--top .invtf--search{min-width:260px;flex:1 1 320px;} section[data-page="jobs"] .inv-toolbar2__row--bottom .invtf--date{min-width:170px;flex:0 0 auto;} section[data-page="jobs"] .inv-toolbar2 label{ display:flex; flex-direction:column; gap:6px; white-space:nowrap; font-size:11px; padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important; } section[data-page="jobs"] .inv-toolbar2 input.input--sm, section[data-page="jobs"] .inv-toolbar2 select.input--sm{ height:36px; min-height:36px; padding:7px 10px; border-radius:10px; font-size:12px; line-height:1.2; box-sizing:border-box; } section[data-page="jobs"] .inv-toolbar2 .inv-dates{ gap:10px; align-items:flex-end; } .jobQActionsCell{min-width:96px!important;width:96px;} .jobRowActions--table{ gap:3px!important; justify-content:center!important; } .jobRowActions--table .btn, .jobRowActions--table .btn--iconOnly{ width:24px!important; height:24px!important; min-width:24px!important; min-height:24px!important; padding:0!important; border-radius:7px!important; box-shadow:none!important; } .jobRowActions--table .btn__ico, .jobRowActions--table .btn .btn__ico{ width:13px!important; height:13px!important; } .jobRowActions--table .btn__txt{display:none!important;} .jobQueueListTable{min-width:1180px;} .jobQErrCell{max-width:170px;} @media (max-width:860px){ section[data-page="jobs"] .inv-toolbar2__row--top .invtf, section[data-page="jobs"] .inv-toolbar2__row--top .invtf--search, section[data-page="jobs"] .inv-toolbar2__row--bottom .invtf--date{min-width:0;flex:1 1 100%;} } /* ---------------- v189: invoice-like queue filters/actions polish ---------------- */ /* جستجو در فهرست فاکتورها و صف ارسال دیگر کشیده و متفاوت نیست */ .inv-toolbar2__row--top .invtf--search{ min-width:220px!important; flex:0 0 240px!important; } .inv-toolbar2__row--bottom .invtf--date{ min-width:170px!important; flex:0 0 170px!important; } .inv-toolbar2 .invtf--search input.input--sm, .inv-toolbar2 .invtf--date input.input--sm{ width:100%; height:36px; min-height:36px; padding:7px 10px; border-radius:10px; font-size:12px; line-height:1.2; box-sizing:border-box; background:var(--input-bg, rgba(15,23,42,.36)); border:1px solid var(--border); } /* دکمه‌های عملیات صف ارسال مثل فهرست فاکتورها قاب مشخص داشته باشند */ .jobRowActions--table .btn, .jobRowActions--table .btn--iconOnly{ border:1px solid var(--border)!important; background:rgba(15,23,42,.30)!important; color:var(--text)!important; } .jobRowActions--table .btn:not(:disabled):hover, .jobRowActions--table .btn--iconOnly:not(:disabled):hover{ background:rgba(var(--primary-rgb),.16)!important; border-color:rgba(var(--accent-rgb),.45)!important; transform:translateY(-1px); } .jobRowActions--table .btn:disabled, .jobRowActions--table .btn--iconOnly:disabled{ opacity:.42; background:rgba(148,163,184,.08)!important; } html[data-theme="light"] .jobRowActions--table .btn, body.theme-light .jobRowActions--table .btn, html[data-theme="light"] .jobRowActions--table .btn--iconOnly, body.theme-light .jobRowActions--table .btn--iconOnly{ background:rgba(255,255,255,.72)!important; border-color:rgba(15,23,42,.14)!important; } /* زمان قبل از عنوان قرار گرفته؛ کمی جمع‌وجورتر شود */ .jobQTimeCell{min-width:122px;max-width:150px;} .jobQTitleCell{min-width:180px;max-width:260px;} .jobQRemoteCell .jobPill--remote{max-width:130px;overflow:hidden;text-overflow:ellipsis;} .jobRemoteManualSelect{ display:inline-flex; width:auto; min-width:108px; max-width:140px; min-height:28px; margin:0; padding:5px 24px 5px 10px; border-radius:999px; font-size:12px; font-weight:850; outline:none; cursor:pointer; text-align:center; text-overflow:ellipsis; } .jobRemoteManualSelect:focus{ border-color:rgba(var(--accent-rgb),.72); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.12); } .jobRemoteManualSelect:disabled{opacity:.62;cursor:wait;} .jobRemoteManualSelect option{ color:#0f172a; background:#fff; } @media (max-width:860px){ .inv-toolbar2__row--top .invtf--search, .inv-toolbar2__row--bottom .invtf--date{ min-width:0!important; flex:1 1 100%!important; } } /* ---------------- v279: purchase actions in one row + treasury module ---------------- */ .purchaseActionDock{ grid-template-columns:repeat(4,minmax(0,1fr)); } .purchaseActionDock .sendDock__group{ display:contents; } .treasuryPage{ width:100%; min-width:0; } .treasuryHero, .treasuryCard__head, .treasuryAccountToolbar, .treasuryActions, .treasuryPager{ display:flex; align-items:center; justify-content:space-between; gap:12px; } .treasuryHero{ margin-bottom:16px; } .treasuryHero h1, .treasuryCard__head h2{ margin:0; } .treasuryHero p, .treasuryCard__head p{ margin:5px 0 0; color:var(--muted); font-size:13px; } .treasuryStats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:14px; } .treasuryStats article{ display:grid; gap:6px; min-width:0; padding:14px 16px; border:1px solid var(--line); border-radius:16px; background:rgba(255,255,255,.018); } .treasuryStats span{ color:var(--muted); font-size:12px; font-weight:750; } .treasuryStats strong{ overflow:hidden; font-size:18px; font-weight:900; font-variant-numeric:tabular-nums; text-overflow:ellipsis; white-space:nowrap; } .treasuryTabs{ display:flex; align-items:flex-end; gap:22px; min-width:0; margin-bottom:16px; padding-inline:4px; border-bottom:1px solid var(--line); overflow-x:auto; } .treasuryTab{ flex:0 0 auto; min-height:42px; padding:0 2px 10px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--muted); font:inherit; font-size:13px; font-weight:800; cursor:pointer; } .treasuryTab.is-active{ border-bottom-color:var(--accent); color:var(--text); } .treasuryPanel{ min-width:0; } .treasuryCard{ min-width:0; margin-bottom:14px; padding:18px; } .treasuryCard__head{ margin-bottom:16px; padding-bottom:14px; border-bottom:1px solid var(--line); } .treasuryForm{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; } .treasuryForm > label, .treasuryChequeFields > label, .treasuryFilters > label{ display:grid; align-content:start; gap:7px; min-width:0; color:var(--muted); font-size:12px; font-weight:800; } .treasuryForm input, .treasuryForm select, .treasuryFilters input, .treasuryFilters select{ width:100%; min-width:0; min-height:48px; } .treasuryForm__span2{ grid-column:span 2; } .treasuryForm__span3{ grid-column:1 / -1; } .treasuryTransactionEditor .treasuryForm{ grid-template-columns:repeat(4,minmax(0,1fr)); } .treasuryTransactionEditor .treasuryField--date{ order:1; } .treasuryTransactionEditor .treasuryField--account{ order:2; grid-column:span 2; } .treasuryTransactionEditor .treasuryField--reference{ order:3; margin-inline-start:10px; } .treasuryTransactionEditor .treasuryField--counterMode{ order:4; } .treasuryTransactionEditor .treasuryField--customer{ order:5; } .treasuryTransactionEditor .treasuryField--amount{ order:6; } .treasuryTransactionEditor .treasuryField--method{ order:7; } .treasuryTransactionEditor .treasuryForm__span3{ order:20; } .treasuryChequeFields{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:14px; border:1px solid rgba(var(--accent-rgb),.18); border-radius:14px; background:rgba(var(--accent-rgb),.045); } .treasuryActions{ justify-content:flex-start; padding-top:2px; } .treasuryActions .btn{ min-width:140px; } .treasuryFilters{ display:grid; grid-template-columns:minmax(220px,1.5fr) repeat(2,minmax(150px,.7fr)) auto auto; align-items:end; gap:10px; margin-bottom:16px; } .treasuryListState{ min-width:0; color:var(--muted); } .treasuryTableWrap{ width:100%; overflow:auto; } .treasuryTable{ width:100%; border-collapse:collapse; white-space:nowrap; } .treasuryTable th, .treasuryTable td{ padding:12px 10px; border-bottom:1px solid var(--line); text-align:right; font-size:12px; } .treasuryTable th{ color:var(--muted); font-weight:800; } .treasuryTable td{ color:var(--text); } .treasuryTable__actions{ display:flex; align-items:center; gap:6px; } .treasuryBadge{ display:inline-flex; align-items:center; min-height:26px; padding:3px 9px; border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:11px; font-weight:850; } .treasuryBadge--receipt, .treasuryBadge--posted{ border-color:rgba(34,197,94,.25); background:rgba(34,197,94,.08); color:#65d98a; } .treasuryBadge--payment, .treasuryBadge--cancelled{ border-color:rgba(244,63,94,.25); background:rgba(244,63,94,.08); color:#fb7185; } .treasuryBadge--draft{ border-color:rgba(245,158,11,.25); background:rgba(245,158,11,.08); color:#fbbf24; } .treasuryAmount--receipt{ color:#65d98a; } .treasuryAmount--payment{ color:#fb7185; } .treasuryPager{ justify-content:center; margin-top:14px; } .treasuryAccountToolbar{ justify-content:flex-end; } .treasuryCheck{ display:inline-flex !important; align-items:center !important; gap:8px !important; min-height:42px; color:var(--text) !important; font-size:12px !important; cursor:pointer; } .treasuryCheck input{ width:18px !important; min-height:18px !important; height:18px; } .treasuryEmpty{ padding:28px 14px; color:var(--muted); text-align:center; } :root[data-theme="light"] .treasuryStats article, html.theme-light .treasuryStats article, body.theme-light .treasuryStats article{ background:rgba(255,255,255,.72); } :root[data-theme="light"] .treasuryBadge--receipt, :root[data-theme="light"] .treasuryBadge--posted, html.theme-light .treasuryBadge--receipt, html.theme-light .treasuryBadge--posted, body.theme-light .treasuryBadge--receipt, body.theme-light .treasuryBadge--posted{ color:#15803d; } :root[data-theme="light"] .treasuryBadge--payment, :root[data-theme="light"] .treasuryBadge--cancelled, html.theme-light .treasuryBadge--payment, html.theme-light .treasuryBadge--cancelled, body.theme-light .treasuryBadge--payment, body.theme-light .treasuryBadge--cancelled{ color:#be123c; } :root[data-theme="light"] .treasuryBadge--draft, html.theme-light .treasuryBadge--draft, body.theme-light .treasuryBadge--draft{ color:#a16207; } @media (max-width:1100px){ .purchaseActionDock{ grid-template-columns:repeat(2,minmax(0,1fr)); } .treasuryStats{ grid-template-columns:repeat(2,minmax(0,1fr)); } .treasuryFilters{ grid-template-columns:repeat(3,minmax(0,1fr)); } .treasuryFilters > button{ width:100%; } } @media (max-width:760px){ .treasuryHero, .treasuryCard__head{ align-items:flex-start; } .treasuryForm, .treasuryChequeFields{ grid-template-columns:1fr; } .treasuryForm__span2, .treasuryForm__span3, .treasuryChequeFields{ grid-column:auto; } .treasuryFilters{ grid-template-columns:1fr 1fr; } .treasuryFilters > label:first-child{ grid-column:1 / -1; } } @media (max-width:480px){ .purchaseActionDock, .treasuryStats, .treasuryFilters{ grid-template-columns:1fr; } .treasuryFilters > label:first-child{ grid-column:auto; } .treasuryActions{ display:grid; grid-template-columns:1fr; width:100%; } .treasuryActions .btn{ width:100%; } } /* v277: purchase item picker and shared sales register/list tabs. */ .inventoryPurchaseItemPick{ width:100%; min-width:0; } .inventoryPurchaseItemPick > input{ width:100%; min-width:0; padding-inline-end:70px; cursor:default; } .inventoryPurchaseItemPick > .inAffix__btn{ min-width:54px; } .salesModuleHead{ margin-bottom:10px; } .salesModuleTabs{ margin-bottom:14px; } section[data-page="invoices"] > .salesModuleTabs + .card{ margin-top:0; } .purchaseActionDock{ width:100%; margin-top:16px; padding-top:10px; border-top:1px dashed rgba(148,163,184,.16); display:grid; gap:8px; } .purchaseActionDock .sendDock__group{ display:grid; gap:8px; } .purchaseActionDock .sendDock__group--primary, .purchaseActionDock .sendDock__group--secondary{ grid-template-columns:repeat(2,minmax(0,1fr)); } .purchaseActionDock .sendDock__group--primary:has(> #btnPurchasePost[hidden]){ grid-template-columns:1fr; } .purchaseActionDock .sendDock__btn{ display:inline-flex; align-items:center; justify-content:center; width:100%; min-height:38px; height:38px; padding:0 10px; gap:6px; border-radius:12px; font-size:12px; font-weight:700; box-shadow:none; } .purchaseActionDock .sendDock__btn--primary{ min-height:40px; height:40px; box-shadow:inset 0 1px 0 rgba(255,255,255,.10); } .purchaseActionDock .sendDock__ic{ display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; flex:0 0 18px; } .purchaseActionDock .sendDock__ic svg{ display:block; width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } .purchaseActionDock .sendDock__tx{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .purchaseActionDock .sendDock__group--secondary .sendDock__btn{ background:linear-gradient(180deg,rgba(255,255,255,.022),rgba(255,255,255,.01)); border-color:rgba(148,163,184,.16); } .purchaseActionDock .sendDock__group--secondary .sendDock__btn:hover{ border-color:rgba(148,163,184,.28); } @media (max-width:760px){ .purchaseActionDock .sendDock__group--primary, .purchaseActionDock .sendDock__group--secondary{ grid-template-columns:1fr; } .purchaseActionDock .sendDock__btn, .purchaseActionDock .sendDock__btn--primary{ justify-content:flex-start; min-height:38px; height:38px; padding-inline:12px; border-radius:11px; } } /* ---------------- v190: harmonize invoice/jobs filter inputs + invoice-style queue action buttons ---------------- */ /* فیلدهای جستجو و تاریخ در فهرست فاکتورها و صف ارسال مثل سایر فیلترها قاب یکسان بگیرند */ .inv-toolbar2 .field.invtf > label > input.input--sm, .inv-toolbar2 .field.invtf > label > select.input--sm{ width:100% !important; height:52px !important; min-height:52px !important; padding:0 14px !important; border-radius:16px !important; border:1px solid var(--border) !important; background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)) !important; color:var(--text) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.055) !important; font-size:12.5px !important; line-height:1.2 !important; box-sizing:border-box !important; } .inv-toolbar2 .field.invtf > label > input.input--sm::placeholder{color:var(--muted2);opacity:.9;} .inv-toolbar2 .field.invtf > label > input.input--sm:hover, .inv-toolbar2 .field.invtf > label > select.input--sm:hover{ border-color:rgba(148,163,184,.36) !important; } .inv-toolbar2 .field.invtf > label > input.input--sm:focus, .inv-toolbar2 .field.invtf > label > select.input--sm:focus{ border-color:rgba(var(--accent-rgb),.58) !important; box-shadow:0 0 0 3px rgba(var(--accent-rgb),.14), inset 0 1px 0 rgba(255,255,255,.06) !important; } html[data-theme="light"] .inv-toolbar2 .field.invtf > label > input.input--sm, body.theme-light .inv-toolbar2 .field.invtf > label > input.input--sm, html[data-theme="light"] .inv-toolbar2 .field.invtf > label > select.input--sm, body.theme-light .inv-toolbar2 .field.invtf > label > select.input--sm{ background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(248,250,252,.74)) !important; border-color:rgba(15,23,42,.14) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.95) !important; } /* عرض جستجو دیگر با ظاهر متفاوت تحمیل نشود؛ فقط کمی جا بیشتر از فیلترهای معمولی بگیرد */ .inv-toolbar2__row--top .invtf--search{ flex:1 1 260px !important; min-width:240px !important; max-width:none !important; } .inv-toolbar2__row--bottom .invtf--date{ flex:0 0 190px !important; min-width:190px !important; } @media (max-width:860px){ .inv-toolbar2__row--top .invtf--search, .inv-toolbar2__row--bottom .invtf--date{ flex:1 1 100% !important; min-width:0 !important; } } /* دکمه‌های عملیات صف ارسال دقیقاً شبیه عملیات فهرست فاکتورها: مربعی، مرزبندی‌شده و بدون متن */ .jobQActionsCell{min-width:122px !important;width:122px !important;} .jobRowActions--table{ gap:5px !important; justify-content:center !important; overflow:visible !important; } .jobRowActions--table .btn, .jobRowActions--table .btn--iconOnly{ flex:0 0 auto !important; min-width:34px !important; width:34px !important; min-height:34px !important; height:34px !important; padding:0 !important; border-radius:0 !important; border:1px solid var(--border) !important; background:transparent !important; color:#9ec5ff !important; box-shadow:none !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; } .jobRowActions--table .btn .btn__ico, .jobRowActions--table .btn__ico{ width:16px !important; height:16px !important; margin:0 !important; } .jobRowActions--table .btn .btn__ico svg, .jobRowActions--table .btn__ico svg{ width:16px !important; height:16px !important; } .jobRowActions--table .btn__txt{display:none !important;} .jobRowActions--table .btn:not(:disabled):hover, .jobRowActions--table .btn--iconOnly:not(:disabled):hover{ background:rgba(var(--accent-rgb),.08) !important; border-color:rgba(var(--accent-rgb),.35) !important; color:var(--accent) !important; transform:none !important; } .jobRowActions--table .btn:disabled, .jobRowActions--table .btn--iconOnly:disabled{ opacity:.38 !important; color:var(--muted2) !important; background:transparent !important; } html[data-theme="light"] .jobRowActions--table .btn, body.theme-light .jobRowActions--table .btn, html[data-theme="light"] .jobRowActions--table .btn--iconOnly, body.theme-light .jobRowActions--table .btn--iconOnly{ background:transparent !important; border-color:rgba(15,23,42,.16) !important; color:#2563eb !important; } /* ---------------- v191: exact queue filter border alignment + invoice-inspired queue row actions ---------------- */ /* ورودی‌های جستجو/تاریخ و SelectX داخل فیلترهای فهرست فاکتور و صف ارسال، یک قاب کاملاً یکسان دارند. */ .inv-toolbar2 .field.invtf > label > input.input--sm, .inv-toolbar2 .field.invtf > label > .selectx > .selectx-btn{ width:100% !important; height:52px !important; min-height:52px !important; border:1px solid var(--border) !important; border-radius:16px !important; background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.055) !important; color:var(--text) !important; box-sizing:border-box !important; font-size:12.5px !important; line-height:1.2 !important; } .inv-toolbar2 .field.invtf > label > input.input--sm{ padding:0 14px !important; text-align:right !important; direction:rtl !important; } .inv-toolbar2 .field.invtf > label > .selectx{ width:100% !important; height:52px !important; min-height:52px !important; } .inv-toolbar2 .field.invtf > label > .selectx > .selectx-btn{ padding:0 14px !important; text-align:right !important; direction:rtl !important; } .inv-toolbar2 .field.invtf > label > .selectx > .selectx-btn .selectx-label{ flex:1 1 auto !important; text-align:center !important; } .inv-toolbar2 .field.invtf > label > .selectx > .selectx-btn .selectx-caret{ width:16px !important; height:16px !important; flex:0 0 16px !important; } .inv-toolbar2 .field.invtf > label > input.input--sm:hover, .inv-toolbar2 .field.invtf > label > .selectx > .selectx-btn:hover{ border-color:rgba(148,163,184,.36) !important; } .inv-toolbar2 .field.invtf > label > input.input--sm:focus, .inv-toolbar2 .field.invtf > label > .selectx > .selectx-btn:focus{ border-color:rgba(var(--accent-rgb),.58) !important; box-shadow:0 0 0 3px rgba(var(--accent-rgb),.14), inset 0 1px 0 rgba(255,255,255,.06) !important; outline:0 !important; } html[data-theme="light"] .inv-toolbar2 .field.invtf > label > input.input--sm, body.theme-light .inv-toolbar2 .field.invtf > label > input.input--sm, html[data-theme="light"] .inv-toolbar2 .field.invtf > label > .selectx > .selectx-btn, body.theme-light .inv-toolbar2 .field.invtf > label > .selectx > .selectx-btn{ background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(248,250,252,.74)) !important; border-color:rgba(15,23,42,.14) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.95) !important; } /* عملیات صف ارسال: همان زبان بصری فهرست فاکتورها؛ مربع‌های 34px با حاشیه، آیکن بدون متن و بدون دکمه + جداگانه. */ .jobQActionsCell{min-width:154px !important;width:154px !important;text-align:center !important;} .jobRowActions--table{ display:flex !important; flex-direction:row !important; align-items:center !important; justify-content:center !important; gap:5px !important; flex-wrap:nowrap !important; overflow:visible !important; } .jobRowActions--table .jobActionBtn, .jobRowActions--table .btn.jobActionBtn, .jobRowActions--table .btn--iconOnly.jobActionBtn{ flex:0 0 34px !important; width:34px !important; min-width:34px !important; height:34px !important; min-height:34px !important; padding:0 !important; border-radius:0 !important; border:1px solid var(--border) !important; background:transparent !important; color:#9ec5ff !important; box-shadow:none !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; } .jobRowActions--table .jobActionBtn .btn__ico, .jobRowActions--table .jobActionBtn .btn__ico svg{ width:16px !important; height:16px !important; margin:0 !important; } .jobRowActions--table .jobActionBtn .btn__text, .jobRowActions--table .jobActionBtn .btn__txt{display:none !important;} .jobRowActions--table .jobActionBtn:not(:disabled):hover{ background:rgba(var(--accent-rgb),.08) !important; border-color:rgba(var(--accent-rgb),.35) !important; color:var(--accent) !important; transform:none !important; } .jobRowActions--table .jobActionBtn:disabled{ opacity:.38 !important; color:var(--muted2) !important; background:transparent !important; } html[data-theme="light"] .jobRowActions--table .jobActionBtn, body.theme-light .jobRowActions--table .jobActionBtn{ background:transparent !important; border-color:rgba(15,23,42,.16) !important; color:#2563eb !important; } /* v31: copyable reference number in send queue invoice details */ .jobAdvanced__copy{ width:100%; min-width:0; display:flex; align-items:center; justify-content:space-between; gap:6px; border:0; background:transparent; padding:0; margin:0; color:var(--text); cursor:pointer; text-align:inherit; font:inherit; } .jobAdvanced__copy b{flex:1;min-width:0;} .jobAdvanced__copy em{ flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; color:var(--accent); opacity:.9; font-style:normal; } .jobAdvanced__copy em svg{width:15px;height:15px;display:block;} .jobAdvanced__copy:hover b{text-decoration:underline;} /* v33 - ارسال هوشمند: تقویم نمایشی شمسی و عرض هماهنگ */ #scheduleModal .scheduleModal__panel{ width: min(96vw, 560px) !important; max-width: min(96vw, 560px) !important; } #scheduleModal .scheduleModal__body{ display: grid; gap: 12px; padding-top: 12px !important; } #scheduleModal .smartSendNote.smartSendNote--top{ order: 0; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 9px 11px !important; font-size: 12px !important; line-height: 1.9 !important; text-align: right; } #scheduleModal .scheduleModal__hint{ margin: 0 !important; line-height: 1.8; } #scheduleModal .scheduleCalendarBox{ width: 100%; margin: 0 !important; } #scheduleModal .jalaliScheduleCalendar{ width: 100%; max-height: 310px; overflow: auto; padding: 8px; border: 1px solid var(--border, rgba(148,163,184,.22)); border-radius: 16px; background: var(--panel-2, rgba(15,23,42,.28)); } #scheduleModal .schCalMonth + .schCalMonth{ margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border, rgba(148,163,184,.18)); } #scheduleModal .schCalMonth__title{ margin-bottom: 8px; color: var(--text, #e5e7eb); font-size: 12.5px; font-weight: 900; } #scheduleModal .schCalGrid{ display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; } #scheduleModal .schCalDay{ min-width: 0; min-height: 48px; padding: 5px 3px; border: 1px solid var(--border, rgba(148,163,184,.22)); border-radius: 13px; background: rgba(15, 23, 42, .42); color: var(--text, #e5e7eb); cursor: pointer; display: grid; place-items: center; gap: 1px; transition: transform .12s ease, border-color .12s ease, background .12s ease; } #scheduleModal .schCalDay:hover{ transform: translateY(-1px); border-color: rgba(147, 197, 253, .55); background: rgba(30, 41, 59, .72); } #scheduleModal .schCalDay span{ font-size: 10px; color: var(--muted, #94a3b8); line-height: 1.1; } #scheduleModal .schCalDay b{ font-size: 14px; line-height: 1.1; font-weight: 900; } #scheduleModal .schCalDay.is-today{ border-style: dashed; } #scheduleModal .schCalDay.is-selected{ border-color: rgba(96, 165, 250, .85); background: rgba(37, 99, 235, .25); box-shadow: 0 0 0 2px rgba(96, 165, 250, .14) inset; } #scheduleModal .scheduleModal__summary{ margin-top: 8px !important; min-height: 18px; line-height: 1.7; } #scheduleModal .row.scheduleModal__fields{ display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 10px !important; align-items: start !important; margin: 0 !important; width: 100%; } #scheduleModal .scheduleModal__field{ min-width: 0 !important; width: 100%; } #scheduleModal .scheduleModal__field label{ display: grid !important; gap: 6px !important; margin: 0; } #scheduleModal .scheduleModal__field input.input--sm, #scheduleModal .scheduleModal__field input{ width: 100% !important; min-width: 0 !important; margin: 0 !important; } #scheduleModal #schErr{ margin-top: 0 !important; } #scheduleModal .scheduleModal__actions{ display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px !important; justify-content: stretch !important; margin-top: 0 !important; width: 100%; } #scheduleModal .scheduleModal__actions .btn{ width: 100%; min-height: 42px; } @media (max-width: 640px){ #scheduleModal .scheduleModal__panel{ width: min(96vw, 440px) !important; max-width: min(96vw, 440px) !important; } #scheduleModal .jalaliScheduleCalendar{ max-height: 300px; padding: 7px; } #scheduleModal .schCalGrid{ gap: 5px; } #scheduleModal .schCalDay{ min-height: 44px; border-radius: 12px; } #scheduleModal .schCalDay span{ font-size: 9.5px; } #scheduleModal .row.scheduleModal__fields, #scheduleModal .scheduleModal__actions{ grid-template-columns: 1fr !important; } } /* v33 - نمایش خواناتر نوع ارسال هوشمند در صف */ .jobQueueListTable .jobQInvCell{min-width:130px;} .jobQueueListTable .jobQInvCell span{white-space:nowrap;} .jobQueueListTable .jobQTimeCell{min-width:150px;max-width:190px;} .invSubjectCell span{ display:block; font-weight:900; color:var(--muted); white-space:nowrap; } .invSubjectCell small{ display:inline-flex; align-items:center; max-width:92px; margin-top:3px; padding:1px 7px; border-radius:999px; border:1px solid rgba(var(--border-rgb),.50); background:rgba(148,163,184,.08); color:var(--muted2); font-size:10px; font-weight:850; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } /* v34 - بازنگری نوار بالای فهرست فاکتورها/صف ارسال + زمان‌بندی هوشمند ایران */ section[data-page="invoices"] .card > .inv-toolbar2, section[data-page="jobs"] .card > .inv-toolbar2{ margin-bottom:12px; padding:12px; border:1px solid rgba(148,163,184,.18); border-radius:22px; background:linear-gradient(180deg, rgba(15,23,42,.34), rgba(15,23,42,.18)); box-shadow:inset 0 1px 0 rgba(255,255,255,.045); } html[data-theme="light"] section[data-page="invoices"] .card > .inv-toolbar2, body.theme-light section[data-page="invoices"] .card > .inv-toolbar2, html[data-theme="light"] section[data-page="jobs"] .card > .inv-toolbar2, body.theme-light section[data-page="jobs"] .card > .inv-toolbar2{ background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(248,250,252,.58)); border-color:rgba(15,23,42,.10); box-shadow:inset 0 1px 0 rgba(255,255,255,.9); } section[data-page="invoices"] .inv-toolbar2__row, section[data-page="jobs"] .inv-toolbar2__row{ width:100%; gap:12px !important; } section[data-page="invoices"] .inv-toolbar2__row--top, section[data-page="jobs"] .inv-toolbar2__row--top{ display:grid !important; align-items:end !important; border-bottom:1px solid rgba(148,163,184,.12) !important; padding-bottom:12px !important; } section[data-page="invoices"] .inv-toolbar2__row--top{ grid-template-columns:minmax(320px,1.35fr) minmax(150px,.7fr) minmax(180px,.75fr) minmax(110px,.45fr); } section[data-page="jobs"] .inv-toolbar2__row--top{ grid-template-columns:minmax(360px,1.55fr) repeat(4, minmax(145px,.72fr)); } section[data-page="invoices"] .inv-toolbar2__row--top .field.invtf, section[data-page="jobs"] .inv-toolbar2__row--top .field.invtf, section[data-page="invoices"] .inv-toolbar2__row--top .invtf--search, section[data-page="jobs"] .inv-toolbar2__row--top .invtf--search{ min-width:0 !important; max-width:none !important; width:100% !important; flex:none !important; } section[data-page="invoices"] .inv-toolbar2__row--bottom, section[data-page="jobs"] .inv-toolbar2__row--bottom{ display:grid !important; grid-template-columns:minmax(0,1fr) auto; align-items:end !important; gap:12px !important; justify-content:stretch !important; } section[data-page="invoices"] .inv-dates, section[data-page="jobs"] .inv-dates{ justify-content:flex-start; gap:12px !important; } section[data-page="invoices"] .inv-toolbar2__row--bottom .invtf--date, section[data-page="jobs"] .inv-toolbar2__row--bottom .invtf--date{ flex:0 1 190px !important; min-width:190px !important; max-width:210px !important; } section[data-page="invoices"] .inv-actions, section[data-page="jobs"] .inv-actions{ align-self:end; justify-content:flex-end; gap:8px !important; } section[data-page="invoices"] .inv-actions .btn, section[data-page="jobs"] .inv-actions .btn{ min-height:40px; padding-inline:14px; border-radius:14px; } @media (max-width:1120px){ section[data-page="invoices"] .inv-toolbar2__row--top, section[data-page="jobs"] .inv-toolbar2__row--top{ grid-template-columns:repeat(2,minmax(0,1fr)); } section[data-page="invoices"] .inv-toolbar2__row--top .invtf--search, section[data-page="jobs"] .inv-toolbar2__row--top .invtf--search{ grid-column:1 / -1; } } @media (max-width:720px){ section[data-page="invoices"] .card > .inv-toolbar2, section[data-page="jobs"] .card > .inv-toolbar2{padding:10px;border-radius:18px;} section[data-page="invoices"] .inv-toolbar2__row--top, section[data-page="jobs"] .inv-toolbar2__row--top, section[data-page="invoices"] .inv-toolbar2__row--bottom, section[data-page="jobs"] .inv-toolbar2__row--bottom{ grid-template-columns:1fr !important; } section[data-page="invoices"] .inv-toolbar2__row--bottom .invtf--date, section[data-page="jobs"] .inv-toolbar2__row--bottom .invtf--date{ min-width:0 !important; max-width:none !important; flex:1 1 100% !important; } section[data-page="invoices"] .inv-actions, section[data-page="jobs"] .inv-actions{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; direction:rtl; } section[data-page="invoices"] .inv-actions .btn, section[data-page="jobs"] .inv-actions .btn{width:100%;} } #scheduleModal .schCalMonth__title{ display:flex; align-items:center; justify-content:space-between; gap:8px; } #scheduleModal .schCalMonth__title em{ display:inline-flex; align-items:center; justify-content:center; min-height:22px; padding:2px 9px; border-radius:999px; border:1px solid rgba(var(--accent-rgb),.28); background:rgba(var(--accent-rgb),.10); color:var(--accent); font-style:normal; font-size:11px; font-weight:900; white-space:nowrap; } #scheduleModal #schTime{ text-align:center !important; direction:ltr !important; font-weight:850; letter-spacing:.4px; } #scheduleModal .scheduleModal__timeHint{ color:var(--muted); font-size:11px; line-height:1.7; text-align:right; } /* v35 - desktop sidebar collapse + three-state theme */ .sidebarCollapseBtn .ico--sidebar-collapse{transition:transform .18s ease} html.sidebar-collapsed .sidebarCollapseBtn .ico--sidebar-collapse, body.sidebar-collapsed .sidebarCollapseBtn .ico--sidebar-collapse{transform:scaleX(-1)} @media (min-width: 981px){ html.sidebar-collapsed .layout, body.sidebar-collapsed .layout{ grid-template-columns:78px 1fr; } html.sidebar-collapsed .sidebar, body.sidebar-collapsed .sidebar{ padding:14px 10px; gap:12px; } html.sidebar-collapsed .brandRow, body.sidebar-collapsed .brandRow{ flex-direction:column; justify-content:flex-start; align-items:center; gap:10px; } html.sidebar-collapsed .brand, body.sidebar-collapsed .brand, html.sidebar-collapsed .nav__label, body.sidebar-collapsed .nav__label, html.sidebar-collapsed .navGroup__chev, body.sidebar-collapsed .navGroup__chev, html.sidebar-collapsed .sidebar__footer, body.sidebar-collapsed .sidebar__footer{ display:none !important; } html.sidebar-collapsed .brandActions, body.sidebar-collapsed .brandActions{ width:100%; flex-direction:column; justify-content:center; align-items:center; gap:8px; } html.sidebar-collapsed .topIconBtn, body.sidebar-collapsed .topIconBtn{ width:48px; height:48px; flex:0 0 48px; border:1px solid var(--border) !important; background:rgba(255,255,255,.03) !important; } html[data-theme="light"].sidebar-collapsed .topIconBtn, body.theme-light.sidebar-collapsed .topIconBtn{ background:rgba(11,92,255,.05) !important; border-color:rgba(11,92,255,.12) !important; color:var(--accent); } html.sidebar-collapsed .nav, body.sidebar-collapsed .nav{ align-items:center; gap:8px; padding-bottom:0; } html.sidebar-collapsed .navGroup, body.sidebar-collapsed .navGroup{ align-items:center; width:100%; } html.sidebar-collapsed .navTree, body.sidebar-collapsed .navTree{ display:none !important; } html.sidebar-collapsed .nav__item, html.sidebar-collapsed .navGroup__btn, body.sidebar-collapsed .nav__item, body.sidebar-collapsed .navGroup__btn{ width:52px; height:48px; min-height:48px; padding:0; justify-content:center; text-align:center; border-radius:16px; } html.sidebar-collapsed .nav__content, body.sidebar-collapsed .nav__content{ justify-content:center; gap:0; } html.sidebar-collapsed .nav__ico, body.sidebar-collapsed .nav__ico{ width:20px; height:20px; flex-basis:20px; } html.sidebar-collapsed .nav__item::before, body.sidebar-collapsed .nav__item::before{ left:50%; top:auto; bottom:5px; transform:translateX(-50%); width:5px; height:5px; } html.sidebar-collapsed .main, body.sidebar-collapsed .main{ padding-inline:18px; } } @media (max-width: 980px){ #btnSidebarCollapse{display:none !important} } /* v36 - system theme reliability + full-width pages when sidebar is collapsed */ @media (min-width: 981px){ html.sidebar-collapsed .layout, body.sidebar-collapsed .layout{ grid-template-columns:78px minmax(0, 1fr); width:100%; } html.sidebar-collapsed .main, body.sidebar-collapsed .main{ width:100%; min-width:0; padding-inline:12px; } html.sidebar-collapsed .page, body.sidebar-collapsed .page{ width:100%; max-width:none !important; margin-inline:0 !important; } html.sidebar-collapsed .page.page--send, body.sidebar-collapsed .page.page--send, html.sidebar-collapsed .invSend, body.sidebar-collapsed .invSend, html.sidebar-collapsed .invSend--v1, body.sidebar-collapsed .invSend--v1, html.sidebar-collapsed .invSend--v2, body.sidebar-collapsed .invSend--v2{ width:100%; max-width:none !important; margin-inline:0 !important; } } #btnThemeToggle .btn__text{ white-space:nowrap; } /* ---------------- v201: local super admin panel ---------------- */ .adminNotice{ border-color: color-mix(in oklab, var(--line) 82%, var(--accent, #7c5cff) 18%); } .adminMiniGrid{ display:grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap:10px; } .adminMiniStat{ border:1px solid var(--line); background: color-mix(in oklab, var(--panel) 92%, #000 8%); border-radius:14px; padding:10px 12px; min-width:0; } .adminMiniStat span{ display:block; color:var(--muted); font-size:12px; margin-bottom:4px; } .adminMiniStat strong{ display:block; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .adminCard{ min-width:0; } .adminInlineSelect{ width:auto; min-width:150px; height:36px; border-radius:12px; padding:0 10px; } .adminList{ display:grid; gap:8px; } .adminListItem{ border:1px solid var(--line); border-radius:14px; padding:10px 12px; background: color-mix(in oklab, var(--panel) 94%, #000 6%); display:grid; gap:6px; min-width:0; } .adminListItem > span, .adminListItem small{ color:var(--muted); line-height:1.7; } .adminKV{ display:grid; gap:7px; } .adminKV > div{ display:flex; justify-content:space-between; gap:10px; border:1px dashed var(--line); border-radius:12px; padding:8px 10px; } .adminKV span{ color:var(--muted); } .adminKV strong{ text-align:left; } .adminPerfLog{ border:1px dashed var(--line); border-radius:14px; padding:10px 12px; color:var(--muted); font-size:12px; line-height:1.8; max-height:150px; overflow:auto; } .adminReplyBox{ border:1px dashed var(--line); border-radius:13px; padding:8px; display:grid; gap:7px; background:rgba(255,255,255,.025); } .adminReplyLabel{ color:var(--muted); font-size:11px; font-weight:800; } .adminReplyInput{ width:100%; min-height:54px; resize:vertical; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.04); color:var(--text); padding:8px 10px; line-height:1.7; outline:none; } .adminReplyInput:focus{ outline:2px solid rgba(59,130,246,.26); outline-offset:2px; } .adminReplyMeta{ color:var(--muted); } .adminPager{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); } .adminPager__info, .adminPager__page{ color:var(--muted); font-size:12px; white-space:nowrap; } html[data-theme="light"] .adminMiniStat, html[data-theme="light"] .adminListItem{ background: color-mix(in oklab, #fff 96%, var(--line) 4%); } html[data-theme="light"] .adminReplyBox{ background: color-mix(in oklab, #fff 97%, var(--line) 3%); } @media (max-width: 1050px){ .adminMiniGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 640px){ .adminMiniGrid{ grid-template-columns: 1fr; } .adminInlineSelect{ width:100%; } } /* ---------------- v203: dashboard support chat box ---------------- */ .supportChat{ position:fixed; left:24px; bottom:18px; z-index:70; width:min(340px, calc(100vw - 48px)); border:1px solid var(--border); border-radius:18px; background: color-mix(in oklab, var(--panel) 88%, #000 12%); box-shadow:var(--shadow); overflow:hidden; backdrop-filter: blur(8px); } .supportChat__head{ min-height:42px; padding:8px 10px; display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid var(--border); } .supportChat__title{ display:flex; align-items:center; gap:7px; font-weight:900; font-size:12px; min-width:0; } .supportChat__dot{ width:9px; height:9px; border-radius:999px; background:rgba(34,197,94,.95); box-shadow:0 0 0 4px rgba(34,197,94,.12); } .supportChat__min{ width:28px; height:28px; border-radius:10px; border:1px solid var(--border); background:transparent; color:var(--text); cursor:pointer; font-weight:900; } .supportChat__min:hover{ background:rgba(255,255,255,.07); } .supportChat__body{ padding:10px; display:grid; gap:8px; } .supportChat__messages{ max-height:180px; overflow:auto; display:grid; gap:7px; padding-inline-end:2px; } .supportChatMsg{ border:1px solid var(--border); border-radius:14px; padding:8px 10px; background:rgba(255,255,255,.04); display:grid; gap:4px; } .supportChatMsg--user{ background: color-mix(in oklab, var(--panel) 80%, var(--accent, #7c5cff) 20%); } .supportChatMsg--system{ background:rgba(34,197,94,.10); } .supportChatMsg__text{ font-size:12px; line-height:1.7; white-space:pre-wrap; word-break:break-word; } .supportChatMsg__time{ font-size:11px; color:var(--muted); text-align:left; } .supportChat__form{ display:grid; grid-template-columns:1fr auto; gap:8px; align-items:end; } .supportChat__form textarea{ min-height:42px; max-height:92px; resize:vertical; border:1px solid var(--border); border-radius:13px; background:rgba(255,255,255,.04); color:var(--text); padding:8px 10px; line-height:1.7; font-size:12px; outline:none; } .supportChat__form textarea:focus{ outline:2px solid rgba(59,130,246,.28); outline-offset:2px; } .supportChat__hint{ color:var(--muted); font-size:11px; line-height:1.6; } .supportChat__form button[disabled], .supportChat__form textarea[disabled]{ opacity:.62; cursor:not-allowed; } .supportChat.has-support-reply .supportChat__dot{ background:rgba(239,68,68,.98); box-shadow:0 0 0 4px rgba(239,68,68,.16), 0 0 14px rgba(239,68,68,.45); animation:supportChatBlink .85s ease-in-out infinite; } @keyframes supportChatBlink{ 0%,100%{ opacity:1; transform:scale(1); } 50%{ opacity:.35; transform:scale(.72); } } .supportChat[data-collapsed="1"] .supportChat__body{ display:none; } .supportChat[data-collapsed="1"] .supportChat__head{ border-bottom:0; } body.login-locked .supportChat{ visibility:hidden !important; pointer-events:none !important; } html[data-theme="light"] .supportChat{ background: color-mix(in oklab, #fff 95%, var(--line) 5%); } html[data-theme="light"] .supportChatMsg{ background: color-mix(in oklab, #fff 94%, var(--line) 6%); } html[data-theme="light"] .supportChatMsg--user{ background: color-mix(in oklab, #fff 86%, var(--accent, #2563eb) 14%); } @media (max-width: 760px){ .supportChat{ left:12px; right:12px; bottom:12px; width:auto; } .supportChat__messages{ max-height:140px; } } /* ---------------- v206: admin panel tabs + cleaner admin dashboard ---------------- */ .adminTabs{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin:14px 0; padding:8px; border:1px solid var(--line); border-radius:18px; background: color-mix(in oklab, var(--panel) 92%, #000 8%); } .adminTab{ appearance:none; border:1px solid transparent; background:transparent; color:var(--muted); border-radius:14px; padding:9px 14px; cursor:pointer; font-weight:900; font-size:13px; transition:background .16s ease, color .16s ease, border-color .16s ease, transform .16s ease; } .adminTab:hover{ color:var(--text); background:rgba(255,255,255,.06); } .adminTab.is-active{ color:var(--text); border-color: color-mix(in oklab, var(--accent, #7c5cff) 50%, var(--line) 50%); background: color-mix(in oklab, var(--panel) 76%, var(--accent, #7c5cff) 24%); box-shadow:0 10px 24px rgba(0,0,0,.12); } .adminTabPanel{ animation:adminPanelIn .18s ease both; } @keyframes adminPanelIn{ from{ opacity:0; transform:translateY(4px); } to{ opacity:1; transform:translateY(0); } } .adminGuideGrid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; margin-top:14px; } .adminGuideCard{ text-align:right; border:1px solid var(--line); border-radius:16px; padding:12px; background:color-mix(in oklab, var(--panel) 94%, #000 6%); color:var(--text); cursor:pointer; display:grid; gap:5px; min-height:78px; } .adminGuideCard:hover{ border-color: color-mix(in oklab, var(--accent, #7c5cff) 45%, var(--line) 55%); background:color-mix(in oklab, var(--panel) 82%, var(--accent, #7c5cff) 18%); } .adminGuideCard span{ color:var(--muted); font-size:12px; line-height:1.7; } .adminSteps{ display:grid; gap:10px; margin-top:10px; } .adminSteps > div{ display:flex; gap:10px; align-items:flex-start; border:1px dashed var(--line); border-radius:14px; padding:10px 12px; } .adminSteps b{ width:24px; height:24px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; background:color-mix(in oklab, var(--accent, #7c5cff) 22%, transparent); color:var(--text); flex:0 0 auto; } .adminSteps span{ color:var(--muted); line-height:1.7; } html[data-theme="light"] .adminTabs, html[data-theme="light"] .adminGuideCard{ background: color-mix(in oklab, #fff 96%, var(--line) 4%); } @media (max-width: 760px){ .adminTabs{ overflow:auto; flex-wrap:nowrap; padding:6px; } .adminTab{ white-space:nowrap; flex:0 0 auto; } .adminGuideGrid{ grid-template-columns:1fr; } } /* ---------------- v207: plan page polish + gift badge + monitor counters ---------------- */ .navGiftBadge{ display:inline-flex; align-items:center; justify-content:center; width:19px; height:19px; flex:0 0 19px; border-radius:999px; background:rgba(239,68,68,.96); color:#fff; font-size:11px; line-height:1; box-shadow:0 0 0 3px rgba(239,68,68,.16), 0 8px 16px rgba(239,68,68,.20); } .footerLinkChip--gift{ gap:6px; position:relative; } .footerGiftBadge{ display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:999px; background:rgba(239,68,68,.96); color:#fff; font-size:11px; box-shadow:0 0 0 3px rgba(239,68,68,.14); } html.sidebar-collapsed .navGiftBadge, body.sidebar-collapsed .navGiftBadge{ position:absolute; top:6px; left:6px; width:16px; height:16px; font-size:9px; } .planHero{ display:grid; grid-template-columns:minmax(0, 1.35fr) minmax(260px, .65fr); gap:16px; align-items:stretch; margin-bottom:16px; } .planHero__text, .planHero__meta{ border:1px solid var(--line); border-radius:24px; background: radial-gradient(circle at top right, color-mix(in oklab, var(--accent, #7c5cff) 28%, transparent) 0, transparent 42%), color-mix(in oklab, var(--panel) 90%, #000 10%); box-shadow:var(--shadow); } .planHero__text{ padding:22px; min-height:168px; display:flex; flex-direction:column; justify-content:center; gap:10px; } .planHero__text h1{ margin:0; font-size:clamp(24px, 3vw, 36px); } .planHero__text p{ margin:0; color:var(--muted); line-height:1.9; max-width:720px; } .planHero__badge, .planDiscountPill{ display:inline-flex; align-items:center; gap:6px; width:max-content; border:1px solid rgba(239,68,68,.35); background:rgba(239,68,68,.12); color:color-mix(in oklab, #ef4444 86%, #fff 14%); border-radius:999px; padding:6px 10px; font-size:12px; font-weight:900; } .planHero__meta{ padding:14px; display:grid; gap:10px; } .planHero__meta > div{ border:1px solid color-mix(in oklab, var(--line) 82%, var(--accent, #7c5cff) 18%); border-radius:18px; padding:12px; background:rgba(255,255,255,.035); display:grid; gap:4px; } .planHero__meta strong{ font-size:16px; } .planHero__meta span{ color:var(--muted); font-size:12px; line-height:1.7; } .planLayout{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(310px, 360px); gap:16px; align-items:start; } .planMain{ display:grid; gap:16px; min-width:0; } .planCatalogCard, .planHelpCard, .planCheckoutCard{ border-color:color-mix(in oklab, var(--line) 86%, var(--accent, #7c5cff) 14%); } .planSectionHead{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; } .planSectionHead h2, .planCheckoutCard h2, .planHelpCard h2{ margin:0; } .planSectionHead p{ margin:6px 0 0; color:var(--muted); line-height:1.8; } .planStepBar{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; margin-bottom:12px; } .planStepBar > div{ border:1px dashed var(--line); border-radius:16px; padding:10px; display:flex; align-items:center; gap:9px; min-width:0; } .planStepBar b{ width:24px; height:24px; flex:0 0 24px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; background:color-mix(in oklab, var(--accent, #7c5cff) 22%, transparent); } .planStepBar span{ color:var(--muted); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .planCatalog{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px; } .planCard{ position:relative; border:1px solid var(--line); border-radius:20px; padding:14px; background:color-mix(in oklab, var(--panel) 93%, #000 7%); display:flex; flex-direction:column; gap:12px; min-width:0; min-height:245px; transition:transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease; } .planCard:hover{ transform:translateY(-2px); border-color:color-mix(in oklab, var(--accent, #7c5cff) 42%, var(--line) 58%); box-shadow:0 14px 30px rgba(0,0,0,.14); } .planCard.is-selected{ border-color:color-mix(in oklab, var(--accent, #7c5cff) 70%, var(--line) 30%); background:color-mix(in oklab, var(--panel) 80%, var(--accent, #7c5cff) 20%); } .planCard.is-popular{ box-shadow:0 16px 36px rgba(0,0,0,.14); } .planCard__ribbon{ position:absolute; top:10px; left:10px; border-radius:999px; background:rgba(239,68,68,.95); color:#fff; padding:4px 9px; font-size:11px; font-weight:900; } .planCard__top{ display:grid; gap:12px; padding-top:4px; } .planCard__title{ font-size:18px; font-weight:1000; } .planCard__period, .planCard__price span{ color:var(--muted); font-size:12px; margin-top:4px; } .planCard__price strong{ display:block; font-size:20px; line-height:1.35; } .planCard__features{ display:grid; gap:8px; margin-top:auto; } .planCard__features > div{ display:flex; align-items:center; gap:8px; color:var(--muted); font-size:12px; line-height:1.7; } .planFeatureDot{ width:8px; height:8px; border-radius:999px; background:color-mix(in oklab, var(--accent, #7c5cff) 75%, #fff 25%); box-shadow:0 0 0 3px color-mix(in oklab, var(--accent, #7c5cff) 16%, transparent); flex:0 0 8px; } .planCard__actions{ display:grid; grid-template-columns:1fr; gap:8px; margin-top:4px; } .planCheckoutCard{ position:sticky; top:16px; display:grid; gap:12px; } .planCheckoutCard__head{ display:flex; align-items:center; justify-content:space-between; gap:10px; } .planCurrentBox{ display:grid; gap:10px; } .planSelectedBox{ border:1px solid color-mix(in oklab, var(--accent, #7c5cff) 45%, var(--line) 55%); background:color-mix(in oklab, var(--panel) 84%, var(--accent, #7c5cff) 16%); border-radius:18px; padding:12px; display:grid; gap:4px; } .planSelectedBox span, .planSelectedBox div{ color:var(--muted); font-size:12px; line-height:1.7; } .planSelectedBox strong{ font-size:18px; } .planSelectedBox--empty{ border-style:dashed; background:rgba(255,255,255,.025); } .planCurrentRows, .planLimitGrid{ display:grid; gap:8px; } .planCurrentRows > div, .planLimitGrid > div{ border:1px dashed var(--line); border-radius:14px; padding:9px 10px; display:flex; align-items:center; justify-content:space-between; gap:10px; } .planCurrentRows span, .planLimitGrid span{ color:var(--muted); font-size:12px; } .planCurrentRows strong, .planLimitGrid strong{ text-align:left; overflow-wrap:anywhere; } .planLimitGrid{ grid-template-columns:repeat(2, minmax(0, 1fr)); } .planNoteField{ margin:0; } .planCheckoutActions{ display:grid; gap:8px; } #accPlanInlineMsg{ margin-top:0 !important; min-height:22px; line-height:1.7; } .planHelpGrid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; margin-top:12px; } .planHelpGrid > div{ border:1px dashed var(--line); border-radius:16px; padding:12px; display:grid; gap:5px; } .planHelpGrid span{ color:var(--muted); line-height:1.8; font-size:12px; } html[data-theme="light"] .planHero__text, html[data-theme="light"] .planHero__meta, html[data-theme="light"] .planCard{ background:color-mix(in oklab, #fff 96%, var(--line) 4%); } html[data-theme="light"] .planSelectedBox--empty{ background:color-mix(in oklab, #fff 97%, var(--line) 3%); } @media (max-width: 1180px){ .planCatalog{ grid-template-columns:repeat(2, minmax(0, 1fr)); } .planLayout{ grid-template-columns:minmax(0, 1fr) minmax(280px, 330px); } } @media (max-width: 920px){ .planHero, .planLayout{ grid-template-columns:1fr; } .planCheckoutCard{ position:relative; top:auto; } .planHero__text{ min-height:auto; } } @media (max-width: 700px){ .planCatalog, .planStepBar, .planHelpGrid{ grid-template-columns:1fr; } .planLimitGrid{ grid-template-columns:1fr; } .planHero__text{ padding:16px; border-radius:20px; } .planHero__meta{ border-radius:20px; } } /* ---------------- v208: purchase gift icon position + invoice toggle cleanup ---------------- */ .giftIconSvg{ width:12px; height:12px; display:block; stroke-width:2.25; } .nav__item--gift{ overflow:visible; } .nav__item--gift .nav__content{ padding-inline-end:10px; } .navGiftBadge{ position:absolute; top:-6px; right:10px; left:auto; z-index:2; display:inline-flex; align-items:center; justify-content:center; width:21px; height:21px; flex:0 0 21px; border-radius:999px; background:rgba(239,68,68,.98); color:#fff; box-shadow:0 0 0 3px rgba(239,68,68,.16), 0 8px 16px rgba(239,68,68,.20); pointer-events:none; } .footerLinkChip--gift{ gap:6px; position:relative; overflow:visible; } .footerGiftBadge{ position:absolute; top:-8px; right:10px; left:auto; z-index:3; display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:999px; background:rgba(239,68,68,.98); color:#fff; box-shadow:0 0 0 3px rgba(239,68,68,.14), 0 10px 20px rgba(239,68,68,.22); pointer-events:none; } .planHero--single{ grid-template-columns:1fr; } .planHero--single .planHero__text{ min-height:142px; } .planHero__badge .giftIconSvg, .planDiscountPill .giftIconSvg{ width:14px; height:14px; } .planInvoiceToggle{ display:flex; align-items:center; gap:10px; border:1px solid color-mix(in oklab, var(--line) 80%, var(--accent, #7c5cff) 20%); border-radius:16px; padding:11px 12px; cursor:pointer; background:rgba(255,255,255,.03); user-select:none; } .planInvoiceToggle input{ position:absolute; opacity:0; pointer-events:none; } .planInvoiceToggle__ui{ width:44px; height:24px; border-radius:999px; background:rgba(148,163,184,.28); border:1px solid rgba(148,163,184,.32); position:relative; flex:0 0 44px; transition:background .16s ease, border-color .16s ease; } .planInvoiceToggle__ui::before{ content:""; position:absolute; top:3px; right:3px; width:16px; height:16px; border-radius:999px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.22); transition:transform .16s ease; } .planInvoiceToggle input:checked + .planInvoiceToggle__ui{ background:color-mix(in oklab, var(--accent, #7c5cff) 72%, #10b981 28%); border-color:color-mix(in oklab, var(--accent, #7c5cff) 76%, #fff 24%); } .planInvoiceToggle input:checked + .planInvoiceToggle__ui::before{ transform:translateX(-20px); } .planInvoiceToggle__text{ display:grid; gap:3px; min-width:0; } .planInvoiceToggle__text strong{ font-size:13px; } .planInvoiceToggle__text small{ color:var(--muted); line-height:1.7; } html.sidebar-collapsed .navGiftBadge, body.sidebar-collapsed .navGiftBadge{ top:-6px; right:4px; left:auto; width:18px; height:18px; } html.sidebar-collapsed .navGiftBadge .giftIconSvg, body.sidebar-collapsed .navGiftBadge .giftIconSvg{ width:10px; height:10px; } @media (max-width: 920px){ .planHero--single .planHero__text{ min-height:auto; } } /* ---------------- v209: plan editor + gift badge inside button ---------------- */ .nav__item--gift{ overflow:hidden; } .navGiftBadge{ top:7px; right:14px; width:18px; height:18px; flex-basis:18px; box-shadow:0 0 0 2px rgba(239,68,68,.16), 0 8px 14px rgba(239,68,68,.18); } .navGiftBadge .giftIconSvg{ width:10px; height:10px; } .nav__item--gift .nav__content{ padding-inline-end:26px; } .footerGiftBadge{ top:5px; right:8px; width:18px; height:18px; box-shadow:0 0 0 2px rgba(239,68,68,.14), 0 8px 16px rgba(239,68,68,.18); } .footerGiftBadge .giftIconSvg{ width:10px; height:10px; } .footerLinkChip--gift{ padding-inline-end:30px; } html.sidebar-collapsed .navGiftBadge, body.sidebar-collapsed .navGiftBadge{ top:6px; right:6px; width:16px; height:16px; } .planCard__price del{ display:block; color:var(--muted); font-size:12px; line-height:1.5; opacity:.82; } .adminPlanEditorCard .field input, .adminPlanEditorCard .field textarea{ width:100%; } .adminPlanToggles{ display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:10px; } .adminPlanToggles label{ display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); background:rgba(255,255,255,.03); border-radius:999px; padding:8px 11px; color:var(--muted); font-size:12px; cursor:pointer; user-select:none; } .adminPlanToggles input{ accent-color:var(--accent, #7c5cff); } .adminPlanItem small{ color:var(--muted); } .adminKV--compact{ grid-template-columns:repeat(2, minmax(0,1fr)); } @media (max-width: 700px){ .adminKV--compact{ grid-template-columns:1fr; } .navGiftBadge{ right:10px; } } /* ---------------- v210: purchase page compact header + plan border + submenu gift cleanup ---------------- */ .nav__item[data-nav="acc-plan"] .navGiftBadge{ display:none !important; } .nav__item[data-nav="acc-plan"] .nav__content{ padding-inline-end:0 !important; } .planHero{ margin-bottom:12px; } .planHero--single .planHero__text, .planHero__text{ min-height:96px !important; padding:14px 18px !important; gap:7px !important; } .planHero__text h1{ font-size:clamp(20px, 2.2vw, 28px) !important; } .planHero__text p{ font-size:13px !important; line-height:1.75 !important; } .planHero__badge{ padding:4px 8px !important; font-size:11px !important; } .planCatalog{ gap:14px !important; } .planCard{ border:2px solid color-mix(in oklab, var(--line) 76%, var(--accent, #7c5cff) 24%) !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 10px 24px rgba(0,0,0,.10); min-height:225px; } .planCard:hover{ border-color:color-mix(in oklab, var(--accent, #7c5cff) 62%, var(--line) 38%) !important; } .planCard.is-selected{ border-color:color-mix(in oklab, var(--accent, #7c5cff) 82%, #fff 18%) !important; box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--accent, #7c5cff) 34%, transparent), 0 16px 34px rgba(0,0,0,.15); } .planCard__actions .btn{ width:100%; } .footerLinkChip--gift{ overflow:visible !important; } .footerGiftBadge{ top:3px !important; right:7px !important; width:17px !important; height:17px !important; } .footerGiftBadge .giftIconSvg{ width:9px !important; height:9px !important; } /* ---------------- v211: discount code checkout + admin coupon builder ---------------- */ .planCheckoutCard__head--stacked{ align-items:stretch; gap:10px; } .planCouponBox{ width:100%; border:1px solid color-mix(in srgb, var(--line) 72%, var(--accent) 28%); background:color-mix(in srgb, var(--card) 92%, var(--accent) 8%); border-radius:18px; padding:10px; box-shadow:inset 0 1px 0 rgba(255,255,255,.05); } .planCouponBox > span{ display:block; font-size:12px; font-weight:900; color:var(--text); margin-bottom:7px; } .planCouponRow{ display:flex; gap:8px; align-items:center; } .planCouponRow input{ flex:1; min-width:0; height:38px; border:1px solid var(--line); border-radius:13px; background:var(--bg-soft, var(--card)); color:var(--text); padding:0 10px; font-weight:800; text-transform:uppercase; } .planCouponRow .btn{height:38px;white-space:nowrap;} .planCouponMsg{ display:block; min-height:18px; margin-top:6px; font-size:11px; color:var(--muted); } .planCouponMsg.is-ok{color:var(--ok);font-weight:800;} .planCouponMsg.is-err{color:var(--err);font-weight:800;} .planCouponApplied{ display:inline-flex; align-items:center; gap:6px; margin-top:8px; padding:5px 8px; border-radius:999px; background:color-mix(in srgb, var(--ok) 12%, transparent); color:var(--ok); font-weight:900; } .adminCouponCard .field input[dir="ltr"]{ text-transform:uppercase; font-weight:900; letter-spacing:.04em; } .adminCouponItem strong[dir="ltr"]{ letter-spacing:.05em; } @media (max-width: 720px){ .planCouponRow{flex-direction:column;align-items:stretch;} .planCouponRow .btn{width:100%;} } /* ---------------- v212: sandbox payment + official invoice fields + stronger plan borders ---------------- */ .planCard{ border:2px solid color-mix(in srgb, var(--line) 52%, var(--accent) 48%) !important; background:linear-gradient(180deg, color-mix(in srgb, var(--card) 94%, #fff 6%), color-mix(in srgb, var(--bg-soft, var(--card)) 92%, var(--accent) 8%)) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.07), 0 14px 32px rgba(0,0,0,.18) !important; } html[data-theme="dark"] .planCard{ border-color:color-mix(in srgb, var(--accent) 58%, #ffffff 18%) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.10), 0 16px 36px rgba(0,0,0,.30), 0 0 0 1px rgba(255,255,255,.04) !important; } .planCard.is-selected{ border-color:color-mix(in srgb, var(--accent) 82%, #fff 18%) !important; box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--accent) 42%, transparent), 0 18px 42px rgba(0,0,0,.24) !important; } .planInvoiceFields{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; border:1px solid color-mix(in srgb, var(--line) 70%, var(--accent) 30%); border-radius:18px; padding:12px; background:color-mix(in srgb, var(--card) 90%, var(--accent) 10%); } .planInvoiceFields[hidden]{display:none !important;} .planInvoiceFields .field{margin:0;} .planInvoiceFields__wide{grid-column:1 / -1;} .planPaymentMsg{min-height:22px;line-height:1.8;} .planPaymentMsg.is-ok{color:var(--ok);font-weight:900;} .planPaymentMsg.is-err{color:var(--err);font-weight:900;} @media (max-width: 720px){ .planInvoiceFields{grid-template-columns:1fr;} } /* ---------------- v213: current plan hero + stronger dark borders + payment success ---------------- */ .planHero--current{ margin-bottom:14px !important; } .planHero__text--current{ min-height:auto !important; padding:16px !important; } .planCurrentHero{ display:grid; gap:14px; } .planCurrentHero__loading, .planCurrentHero__empty{ border:1px dashed color-mix(in srgb, var(--line) 72%, var(--accent) 28%); border-radius:18px; padding:14px; background:color-mix(in srgb, var(--card) 88%, var(--accent) 12%); } .planCurrentHero__empty span, .planCurrentHero__eyebrow{ display:inline-flex; width:max-content; font-size:12px; font-weight:1000; color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, transparent); border:1px solid color-mix(in srgb, var(--accent) 30%, transparent); border-radius:999px; padding:5px 9px; margin-bottom:8px; } .planCurrentHero__empty h1, .planCurrentHero__head h1{ margin:0; font-size:clamp(20px, 2.4vw, 30px); } .planCurrentHero__empty p, .planCurrentHero__head p{ margin:6px 0 0; color:var(--muted); line-height:1.8; font-size:13px; } .planCurrentHero__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; } .planCurrentHero__status{ white-space:nowrap; border-radius:999px; padding:7px 12px; font-size:12px; border:1px solid currentColor; } .planCurrentHero__status.is-ok{ color:var(--ok); background:color-mix(in srgb, var(--ok) 12%, transparent); } .planCurrentHero__status.is-err{ color:var(--err); background:color-mix(in srgb, var(--err) 12%, transparent); } .planCurrentHero__metrics{ display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:10px; } .planCurrentHero__metrics > div{ border:1px solid color-mix(in srgb, var(--line) 66%, var(--accent) 34%); background:color-mix(in srgb, var(--card) 90%, var(--accent) 10%); border-radius:18px; padding:12px; display:grid; gap:4px; min-width:0; } .planCurrentHero__metrics span, .planCurrentHero__metrics small, .planCurrentHero__features > span{ color:var(--muted); font-size:12px; line-height:1.7; } .planCurrentHero__metrics strong{ font-size:16px; overflow-wrap:anywhere; } .planCurrentHero__features{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; } .planCurrentHero__features b{ display:inline-flex; border:1px solid var(--line); background:rgba(255,255,255,.04); border-radius:999px; padding:6px 10px; font-size:12px; color:var(--text); } .planCard{ border:3px solid color-mix(in srgb, var(--accent) 54%, var(--line) 46%) !important; outline:1px solid color-mix(in srgb, #fff 12%, transparent); background:linear-gradient(180deg, color-mix(in srgb, var(--card) 88%, #fff 12%), color-mix(in srgb, var(--bg-soft, var(--card)) 82%, var(--accent) 18%)) !important; } html[data-theme="dark"] .planCard{ border-color:color-mix(in srgb, var(--accent) 68%, #fff 32%) !important; outline:1px solid rgba(255,255,255,.16) !important; background:linear-gradient(180deg, color-mix(in srgb, var(--card) 76%, #fff 10%), color-mix(in srgb, var(--panel) 72%, var(--accent) 28%)) !important; box-shadow:inset 0 0 0 2px rgba(255,255,255,.08), 0 18px 44px rgba(0,0,0,.34) !important; } html[data-theme="dark"] .planCard.is-selected{ border-color:color-mix(in srgb, var(--accent) 78%, #fff 22%) !important; outline:2px solid color-mix(in srgb, var(--accent) 36%, transparent) !important; } .planPaymentMsg--successBox{ display:flex; align-items:center; gap:8px; border:1px solid color-mix(in srgb, var(--ok) 42%, transparent); background:color-mix(in srgb, var(--ok) 12%, transparent); border-radius:16px; padding:10px 12px; color:var(--ok) !important; font-weight:1000; } .planPaymentSuccessIcon{ display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; flex:0 0 24px; border-radius:999px; background:var(--ok); color:#fff; font-weight:1000; line-height:1; } .planPaymentMsg--successBox b{ font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; letter-spacing:.02em; } .planPaymentMsg--successModal{ font-size:15px !important; padding:14px 16px !important; justify-content:flex-start; } @media (max-width: 980px){ .planCurrentHero__metrics{grid-template-columns:repeat(2, minmax(0, 1fr));} } @media (max-width: 620px){ .planCurrentHero__head{display:grid;} .planCurrentHero__metrics{grid-template-columns:1fr;} } /* ---------------- v214: checkout summary cleanup + final amount emphasis ---------------- */ .planCurrentRows > div.is-final{ border-style:solid; border-color:color-mix(in srgb, var(--ok) 48%, var(--line) 52%); background:color-mix(in srgb, var(--ok) 10%, transparent); padding:12px 12px; } .planCurrentRows > div.is-final span{ font-size:13px; font-weight:900; color:var(--text); } .planCurrentRows > div.is-final strong{ font-size:24px; font-weight:1000; color:var(--ok); } .planCard{ border-color:color-mix(in srgb, var(--accent) 68%, var(--text) 20%) !important; } html[data-theme="dark"] .planCard{ border-color:color-mix(in srgb, var(--accent) 72%, #ffffff 28%) !important; } /* ---------------- v55: admin subscription sales stats ---------------- */ .adminSalesSummary{ margin-bottom:10px; } .adminSalesSummary > div:first-child strong{ font-size:18px; color:var(--text); } .adminPlanSalesList{ display:grid; gap:8px; } .adminPlanSaleRow{ display:grid; grid-template-columns:1fr auto auto; gap:10px; align-items:center; border:1px solid var(--line); border-radius:14px; padding:10px 12px; background:color-mix(in oklab, var(--panel) 92%, #000 8%); } .adminPlanSaleRow span{ font-weight:800; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .adminPlanSaleRow strong{ white-space:nowrap; } .adminPlanSaleRow small{ color:var(--muted); white-space:nowrap; } @media (max-width: 700px){ .adminPlanSaleRow{ grid-template-columns:1fr; align-items:start; } } /* ---------------- v57: prettier payment success popup + correction queue title ---------------- */ #msgModal .planPaymentSuccessModal{ display:grid !important; grid-template-columns:auto 1fr; align-items:center; gap:14px; padding:18px !important; border-radius:22px !important; border:1px solid color-mix(in srgb, var(--ok) 46%, var(--line) 54%) !important; background: radial-gradient(circle at 12% 10%, color-mix(in srgb, var(--ok) 22%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--ok) 13%, var(--card) 87%), color-mix(in srgb, var(--panel) 92%, var(--ok) 8%)) !important; color:var(--text) !important; box-shadow:0 22px 60px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.08); } .planPaymentSuccessModal__icon{ width:54px; height:54px; border-radius:18px; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, color-mix(in srgb, var(--ok) 96%, #fff 4%), color-mix(in srgb, var(--ok) 72%, #111 28%)); color:#fff; font-size:30px; font-weight:1000; box-shadow:0 16px 34px color-mix(in srgb, var(--ok) 28%, transparent); } .planPaymentSuccessModal__body{ display:grid; gap:6px; min-width:0; } .planPaymentSuccessModal__body strong{ font-size:18px; font-weight:1000; color:var(--text); } .planPaymentSuccessModal__body > span{ color:var(--muted); font-size:13px; line-height:1.8; } .planPaymentSuccessModal__ref{ margin-top:4px; display:flex; align-items:center; justify-content:space-between; gap:10px; border:1px dashed color-mix(in srgb, var(--ok) 45%, var(--line) 55%); border-radius:16px; padding:8px 10px; background:color-mix(in srgb, var(--ok) 8%, transparent); } .planPaymentSuccessModal__ref small{ color:var(--muted); font-weight:800; } .planPaymentSuccessModal__ref b{ color:var(--ok); font-size:15px; letter-spacing:.02em; } @media (max-width: 560px){ #msgModal .planPaymentSuccessModal{grid-template-columns:1fr;text-align:center;justify-items:center;} .planPaymentSuccessModal__ref{width:100%;} } /* ---------------- v59: richer payment success popup ---------------- */ #msgModal .planPaymentSuccessModal--pretty{ position:relative; overflow:hidden; grid-template-columns:auto 1fr; padding:22px !important; gap:16px; border-radius:26px !important; border:1px solid color-mix(in srgb, var(--ok) 52%, var(--line) 48%) !important; background: radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--ok) 28%, transparent), transparent 34%), radial-gradient(circle at 8% 100%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 36%), linear-gradient(135deg, color-mix(in srgb, var(--card) 86%, var(--ok) 14%), color-mix(in srgb, var(--panel) 92%, var(--ok) 8%)) !important; box-shadow:0 26px 80px rgba(0,0,0,.24), inset 0 0 0 1px rgba(255,255,255,.10); } .planPaymentSuccessModal--pretty .planPaymentSuccessModal__halo{ position:absolute; inset:auto -42px -56px auto; width:170px; height:170px; border-radius:999px; background:color-mix(in srgb, var(--ok) 12%, transparent); filter:blur(2px); pointer-events:none; } .planPaymentSuccessModal--pretty .planPaymentSuccessModal__icon{ width:64px; height:64px; border-radius:22px; color:#fff; background:linear-gradient(145deg, color-mix(in srgb, var(--ok) 96%, #fff 4%), color-mix(in srgb, var(--ok) 62%, #111 38%)); box-shadow:0 18px 38px color-mix(in srgb, var(--ok) 32%, transparent), inset 0 0 0 1px rgba(255,255,255,.25); } .planPaymentSuccessModal--pretty .planPaymentSuccessModal__icon svg{ width:34px; height:34px; } .planPaymentSuccessModal__eyebrow{ color:var(--ok); font-weight:1000; letter-spacing:-.01em; } .planPaymentSuccessModal--pretty .planPaymentSuccessModal__body strong{ font-size:20px; } .planPaymentSuccessModal--pretty .planPaymentSuccessModal__ref{ margin-top:8px; background:color-mix(in srgb, var(--ok) 10%, var(--card) 90%); border-style:solid; } @media (max-width:560px){ #msgModal .planPaymentSuccessModal--pretty{grid-template-columns:1fr;justify-items:center;text-align:center;} } /* v71 - وضعیت‌ها جمع‌وجور، تغییر دستی سامانه بدون دستکاری وضعیت صف، و نمایش ساده الگو */ .jobQueueListTable .jobQStatusCell, .jobQueueListTable .jobQRemoteCell{ min-width:92px!important; width:92px!important; } .jobQueueListTable .jobQStatusCell .jobPill, .jobQueueListTable .jobQRemoteCell .jobRemoteManualSelect{ width:92px!important; min-width:92px!important; max-width:92px!important; height:28px!important; min-height:28px!important; padding-top:3px!important; padding-bottom:3px!important; border-radius:999px!important; font-size:11.5px!important; line-height:1.15!important; box-sizing:border-box!important; } .jobQueueListTable .jobQStatusCell .jobPill{ padding-inline:8px!important; } .jobQueueListTable .jobQRemoteCell .jobRemoteManualSelect{ padding-inline-start:18px!important; padding-inline-end:8px!important; appearance:auto; } .jobQueueListTable .jobQStatusCell small, .jobQueueListTable .jobQRemoteCell small{ font-size:9.5px!important; margin-top:2px!important; } .invSubjectCell small{ display:block!important; max-width:110px!important; margin-top:2px!important; padding:0!important; border:0!important; border-radius:0!important; background:transparent!important; color:var(--muted2)!important; font-size:10px!important; font-weight:750!important; line-height:1.25!important; } /* v72 - وضعیت سامانه فقط ردیف صف را تغییر بدهد، انتظار استعلام زرد باشد، متن کپسول کامل دیده شود */ .jobQueueListTable .jobQStatusCell, .jobQueueListTable .jobQRemoteCell{ min-width:132px!important; width:132px!important; } .jobQueueListTable .jobQStatusCell .jobPill, .jobQueueListTable .jobQRemoteCell .jobRemoteManualSelect{ width:132px!important; min-width:132px!important; max-width:132px!important; height:28px!important; min-height:28px!important; padding-top:3px!important; padding-bottom:3px!important; border-radius:999px!important; font-size:11px!important; line-height:1.15!important; box-sizing:border-box!important; white-space:nowrap!important; overflow:visible!important; text-overflow:clip!important; } .jobQueueListTable .jobQStatusCell .jobPill{ padding-inline:10px!important; } .jobQueueListTable .jobQRemoteCell .jobRemoteManualSelect{ padding-inline-start:20px!important; padding-inline-end:20px!important; text-align:center!important; text-align-last:center!important; direction:rtl!important; } .jobQRemoteCell .jobPill--remote{ max-width:none!important; overflow:visible!important; text-overflow:clip!important; } .jobPill.is-pending, .jobRemoteManualSelect.is-pending{ color:#fbbf24!important; border-color:rgba(245,158,11,.52)!important; background:rgba(245,158,11,.14)!important; } .jobRemoteManualSelect.is-pending:focus{ box-shadow:0 0 0 3px rgba(245,158,11,.14)!important; } /* v74 - نوع الگو وسط زیر موضوع بماند، اما متن موضوع با ستون‌های کناری هم‌ردیف شود */ .invSubjectCell{ text-align:center!important; vertical-align:top!important; padding-top:8px!important; line-height:1.2!important; } .invSubjectCell span{ display:block!important; width:100%!important; text-align:center!important; margin-inline:auto!important; line-height:1.2!important; } .invSubjectCell small{ display:block!important; width:100%!important; max-width:none!important; text-align:center!important; margin-inline:auto!important; margin-top:2px!important; padding:0!important; border:0!important; background:transparent!important; } /* Immutable fields while editing a sent invoice correction */ .page--send.is-sent-correction-lock .immutableFieldWrap, .page--send.is-sent-correction-lock .immutableField{ opacity:.55; filter:grayscale(.25); } .page--send.is-sent-correction-lock .immutableFieldWrap input, .page--send.is-sent-correction-lock .immutableFieldWrap select, .page--send.is-sent-correction-lock .immutableFieldWrap textarea, .page--send.is-sent-correction-lock .immutableFieldWrap button, .page--send.is-sent-correction-lock .immutableField{ cursor:not-allowed !important; } .page--send.is-sent-correction-lock input.immutableField, .page--send.is-sent-correction-lock textarea.immutableField, .page--send.is-sent-correction-lock .immutableFieldWrap input, .page--send.is-sent-correction-lock .selectx.immutableFieldWrap .selectx-btn{ background:rgba(148,163,184,.10) !important; border-color:rgba(148,163,184,.22) !important; } .page--send.is-sent-correction-lock #buyerBox.immutableFieldWrap{ border-color:rgba(148,163,184,.20); } .page--send.is-sent-correction-lock .selectx.immutableFieldWrap .selectx-btn{ opacity:1; } /* Bulk action bars: keep selection actions visible and dim them until rows are selected. */ .bulkActions .bulkSelectionLabel.is-muted, .bulkActions .bulkSelectionCount.is-muted, #invoiceTable .bulkSelectionLabel.is-muted, #invoiceTable .bulkSelectionCount.is-muted{ opacity:.48; } .bulkActions .btn:disabled, #invoiceTable .btn:disabled{ filter:saturate(.72); } /* ---------------- v100: smart send compact + support button ---------------- */ .btn--supportGreen{ background:linear-gradient(135deg,#16a34a,#22c55e)!important; border-color:rgba(34,197,94,.75)!important; color:#fff!important; box-shadow:0 10px 22px rgba(34,197,94,.18); } .btn--supportGreen:hover{filter:brightness(1.04);} #scheduleModal .scheduleModal__body{padding-top:10px!important;} #scheduleModal .scheduleCalendarBox{margin-top:0!important;} #scheduleModal .scheduleModal__summary{font-size:11px;margin-top:6px;} #scheduleModal .schCalMonth__title{padding:5px 8px;} #scheduleModal .schCalGrid{gap:5px;} #scheduleModal .schCalDay{min-height:42px;padding:5px 4px;} #scheduleModal .row.scheduleModal__fields{margin-top:8px!important;gap:8px!important;} #scheduleModal .scheduleModal__actions{margin-top:10px!important;} /* ---------------- v101: feedback support placement + report icon polish ---------------- */ .feedbackHeaderActions .btn{min-height:34px;} .feedbackHeaderActions .btn--supportGreen{padding-inline:12px;} .helpBtn .btn__ico svg{width:18px;height:18px;} /* v273: official invoice requests admin table */ .adminOfficialInvoiceTable{ min-width:1080px; } .adminOfficialInvoiceTable .mono{ direction:ltr; unicode-bidi:plaintext; font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; } .adminOfficialInvoiceAddress{ max-width:260px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } /* ---------------- v103: support icon + footer identity + better dashboard + long item titles ---------------- */ .sidebar__footerBottom.sidebar__footerBottom--text{ display:flex !important; flex-direction:row-reverse !important; align-items:center !important; justify-content:space-between !important; gap:12px !important; } .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel, .sidebar__footerBottom.sidebar__footerBottom--text #planLabel{ flex:1 1 0 !important; min-width:0 !important; display:block !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; line-height:1.45 !important; } .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel{ order:1; text-align:right !important; direction:rtl !important; unicode-bidi:plaintext !important; color:var(--text) !important; font-weight:800 !important; } .sidebar__footerBottom.sidebar__footerBottom--text #planLabel{ order:2; text-align:left !important; direction:rtl !important; unicode-bidi:plaintext !important; color:var(--muted) !important; font-weight:700 !important; } .page--send .lineTitlePick{ min-width:240px !important; } .page--send .table--lines input[data-f="sstt"]{ min-width:240px !important; width:300px !important; } .page--send .lineTitlePick > .in, .page--send .inAffix--line > .in{ padding-left:84px !important; padding-right:12px !important; text-align:right !important; direction:rtl !important; unicode-bidi:plaintext !important; } .page--send .lineTitlePick > .inAffix__btn{ min-width:52px; padding-inline:8px !important; } @media (max-width: 1280px){ .page--send .table--lines input[data-f="sstt"]{ width:260px !important; } } .dashHeroHead{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:14px; padding:16px 18px; border:1px solid rgba(148,163,184,.14); border-radius:18px; background:linear-gradient(135deg, rgba(15,23,42,.95), rgba(12,29,67,.88)); box-shadow:0 16px 40px rgba(2,6,23,.18); } .dashHeroHead h1{ margin:0; } .dashHeroLead{ margin:8px 0 0; color:var(--muted); font-size:13px; line-height:1.8; } .dashGrid{ gap:18px !important; align-items:stretch; } .dashCard{ padding:18px !important; border-radius:20px !important; border:1px solid rgba(148,163,184,.14) !important; background: radial-gradient(circle at top right, rgba(var(--accent-rgb),.11), transparent 34%), linear-gradient(180deg, rgba(15,23,42,.98), rgba(11,18,36,.98)) !important; box-shadow:0 18px 42px rgba(2,6,23,.18) !important; } .dashCardHead{ align-items:flex-start !important; gap:12px; margin-bottom:14px; } .dashCardHead h2{ margin:0; font-size:20px; } .dashStats{ gap:12px !important; } .dashStats .statBox{ border-radius:18px; padding:16px 14px; border:1px solid rgba(148,163,184,.14); background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02)); box-shadow:inset 0 1px 0 rgba(255,255,255,.04); } .dashStats .statBox__label{ font-size:12px; color:var(--muted); } .dashStats .statBox__value{ margin-top:8px; font-size:22px; font-weight:900; letter-spacing:-.02em; } .dashChartBox, .dashCard .chartBox{ margin-top:14px; padding:14px; border-radius:18px; border:1px solid rgba(148,163,184,.12); background:rgba(255,255,255,.02); } .dashCard .chartBox__title{ margin:0 0 12px; font-size:14px; } .topItems{ display:grid; gap:10px; } .topItem{ display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; padding:12px 14px; border-radius:16px; border:1px solid rgba(148,163,184,.12); background:rgba(255,255,255,.028); } .topItem__name{ font-weight:800; line-height:1.7; overflow-wrap:anywhere; } .topItem__meta{ margin-top:3px; color:var(--muted); font-size:12px; overflow-wrap:anywhere; } .topItem__val{ color:var(--accent); font-weight:900; white-space:nowrap; } .eventList{ display:grid; gap:10px; } .eventItem{ padding:14px 14px 12px; border-radius:16px; border:1px solid rgba(148,163,184,.12); background:rgba(255,255,255,.024); transition:transform .15s ease, border-color .15s ease, background-color .15s ease; } .eventItem:hover{ transform:translateY(-1px); border-color:rgba(var(--accent-rgb),.28); background:rgba(255,255,255,.04); } .eventItem__title{ font-weight:800; margin-bottom:4px; } .eventItem__msg{ color:var(--muted); line-height:1.75; } .eventItem__meta{ margin-top:8px; font-size:12px; color:var(--muted); } .dashCounters{ gap:8px !important; flex-wrap:wrap; } .dashQuick{ margin-top:14px; gap:10px !important; flex-wrap:wrap; } .dashQuick .btn{ flex:1 1 140px; min-height:42px; border-radius:14px; font-weight:800; } @media (max-width: 980px){ .dashHeroHead{ padding:14px; border-radius:16px; } .dashCard{ padding:14px !important; border-radius:18px !important; } .dashStats .statBox__value{ font-size:19px; } } /* ---------------- v104: lightweight dashboard redesign + support icon polish ---------------- */ .helpBtn .btn__ico svg, #btnAccSupportOpen .btn__ico svg, #btnAccFeedbackSupportOpen .btn__ico svg{ stroke-width:2.1; } #btnAccSupportOpen .btn__ico, #btnAccFeedbackSupportOpen .btn__ico{ color:inherit; } .dashboardPro{ --dash-soft: rgba(255,255,255,.045); --dash-softer: rgba(255,255,255,.026); --dash-line: rgba(148,163,184,.15); } .dashProHero{ position:relative; overflow:hidden; display:flex; align-items:stretch; justify-content:space-between; gap:18px; min-height:142px; margin-bottom:16px; padding:22px; border-radius:26px; border:1px solid var(--dash-line); background: radial-gradient(circle at 15% 15%, rgba(34,197,94,.18), transparent 34%), radial-gradient(circle at 92% 22%, rgba(var(--accent-rgb),.24), transparent 36%), linear-gradient(135deg, rgba(15,23,42,.96), rgba(8,13,26,.96)); box-shadow:0 20px 48px rgba(2,6,23,.20); } .dashProHero__bg{ position:absolute; inset:auto -60px -130px auto; width:270px; height:270px; border-radius:999px; border:42px solid rgba(255,255,255,.045); pointer-events:none; } .dashProHero__main, .dashProHero__actions{position:relative;z-index:1;} .dashProHero__main{max-width:720px;} .dashProHero__eyebrow{ display:inline-flex; align-items:center; gap:7px; margin-bottom:10px; padding:5px 10px; border-radius:999px; color:rgba(255,255,255,.82); background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.09); font-size:12px; font-weight:800; } .dashProHero h1{ margin:0; font-size:clamp(24px, 3.4vw, 38px); letter-spacing:-.04em; } .dashboardPro .dashHeroLead{ max-width:680px; margin:10px 0 0; color:rgba(255,255,255,.70); font-size:14px; line-height:1.9; } .dashHeroIdentity{ display:flex; flex-wrap:wrap; gap:12px; margin-top:16px; } .dashHeroIdentity__item{ min-width:180px; display:flex; flex-direction:column; gap:4px; padding:12px 14px; border-radius:18px; border:1px solid rgba(255,255,255,.11); background:rgba(255,255,255,.08); backdrop-filter:blur(8px); } .dashHeroIdentity__item span{ color:rgba(255,255,255,.72); font-size:12px; font-weight:700; } .dashHeroIdentity__item strong{ color:#fff; font-size:15px; font-weight:900; line-height:1.6; } .dashProHero__actions{ display:flex; align-items:flex-start; justify-content:flex-end; gap:10px; flex-wrap:wrap; min-width:220px; } .dashProHero__actions .btn{ min-height:38px; border-radius:14px; font-weight:900; } .dashProStats{ display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px; margin-bottom:16px; } .dashMetric{ min-width:0; display:grid; grid-template-columns:auto minmax(0, 1fr); align-items:start; gap:12px; padding:16px; border-radius:22px; border:1px solid var(--dash-line); background:linear-gradient(180deg, var(--dash-soft), var(--dash-softer)); box-shadow:0 14px 36px rgba(2,6,23,.13), inset 0 1px 0 rgba(255,255,255,.04); } .dashMetric__icon{ width:42px; height:42px; display:grid; place-items:center; border-radius:16px; color:var(--accent); background:rgba(var(--accent-rgb),.13); border:1px solid rgba(var(--accent-rgb),.18); } .dashMetric__icon svg{width:21px;height:21px;} .dashMetric--vat .dashMetric__icon{ color:#22c55e; background:rgba(34,197,94,.12); border-color:rgba(34,197,94,.18); } .dashMetric--count .dashMetric__icon{ color:#a78bfa; background:rgba(167,139,250,.12); border-color:rgba(167,139,250,.18); } .dashMetric--total .dashMetric__icon{ color:#f59e0b; background:rgba(245,158,11,.12); border-color:rgba(245,158,11,.18); } .dashboardPro .statBox__label{ color:var(--muted); font-size:12px; font-weight:800; } .dashboardPro .statBox__value{ margin-top:6px; font-size:clamp(19px, 2.1vw, 25px); font-weight:950; letter-spacing:-.035em; overflow-wrap:anywhere; } .dashMetric__hint{ min-height:18px; margin-top:5px; color:var(--muted2); font-size:11.5px; line-height:1.6; } .dashProLayout{ display:grid; grid-template-columns:minmax(0, 1.45fr) minmax(300px, .65fr); gap:16px; align-items:start; } .dashPanel{ min-width:0; border-radius:24px; border:1px solid var(--dash-line); background: radial-gradient(circle at top right, rgba(var(--accent-rgb),.055), transparent 36%), linear-gradient(180deg, var(--dash-soft), var(--dash-softer)); box-shadow:0 16px 42px rgba(2,6,23,.14), inset 0 1px 0 rgba(255,255,255,.035); padding:16px; } .dashPanel--chart, .dashPanel--top{grid-column:1;} .dashPanel--queue, .dashPanel--events{grid-column:2;} .dashPanel__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; } .dashPanel__head h2{ margin:0; font-size:18px; letter-spacing:-.02em; } .dashPanel__head p{ margin:5px 0 0; color:var(--muted); font-size:12px; line-height:1.7; } .dashPanel__head--compact{margin-bottom:10px;} .dashCanvasWrap{ position:relative; min-height:270px; padding:6px 2px 0; } .dashCanvasWrap canvas{ width:100%; height:270px; display:block; } .dashQueueCards{ display:grid; gap:10px; } .dashQueueCard{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border-radius:18px; background:rgba(255,255,255,.035); border:1px solid rgba(148,163,184,.13); } .dashQueueCard span{ color:var(--muted); font-size:12px; font-weight:800; } .dashQueueCard strong{ font-size:22px; line-height:1; font-weight:950; } .dashQueueCard--warn{ background:rgba(var(--danger-rgb),.08); border-color:rgba(var(--danger-rgb),.16); } .dashQueueCard--warn strong{color:var(--danger);} .dashQuick--stack{ display:grid !important; grid-template-columns:1fr 1fr; margin-top:12px !important; gap:10px !important; } .dashQuick--stack .btn{ min-height:40px; border-radius:15px; } .topItems--pro{display:grid;gap:10px;} .dashboardPro .topItem{ min-width:0; display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:12px; align-items:center; padding:12px 13px; border-radius:18px; border:1px solid rgba(148,163,184,.13); background:rgba(255,255,255,.032); } .dashboardPro .topItem__name{ font-weight:900; line-height:1.65; overflow-wrap:anywhere; } .dashboardPro .topItem__meta{ margin-top:4px; color:var(--muted); font-size:12px; line-height:1.6; overflow-wrap:anywhere; } .dashboardPro .topItem__val{ color:var(--accent2); font-weight:950; white-space:nowrap; } .eventList--pro{ display:grid; gap:10px; max-height:390px; overflow:auto; padding-left:2px; } .dashboardPro .eventItem{ padding:12px 13px; border-radius:18px; border:1px solid rgba(148,163,184,.13); border-right-width:4px; background:rgba(255,255,255,.032); box-shadow:none; transition:transform .14s ease, border-color .14s ease, background-color .14s ease; } .dashboardPro .eventItem:hover{ transform:translateY(-1px); border-color:rgba(var(--accent-rgb),.26); background:rgba(255,255,255,.05); } .dashboardPro .eventItem__title{ margin-bottom:4px; font-weight:900; } .dashboardPro .eventItem__msg{ color:var(--muted); line-height:1.75; } .dashboardPro .eventItem__meta{ margin-top:7px; color:var(--muted2); font-size:12px; } .dashboardPro .muted.small{ padding:12px; border-radius:16px; border:1px dashed rgba(148,163,184,.18); background:rgba(255,255,255,.025); } html[data-theme="light"] .dashboardPro, body.theme-light .dashboardPro{ --dash-soft: rgba(255,255,255,.96); --dash-softer: rgba(255,255,255,.82); --dash-line: rgba(15,23,42,.10); } html[data-theme="light"] .dashProHero, body.theme-light .dashProHero{ background: radial-gradient(circle at 15% 15%, rgba(34,197,94,.12), transparent 35%), radial-gradient(circle at 92% 22%, rgba(var(--accent-rgb),.16), transparent 37%), linear-gradient(135deg, #ffffff, #eef4ff); box-shadow:0 18px 42px rgba(2,6,23,.08); } html[data-theme="light"] .dashProHero__eyebrow, body.theme-light .dashProHero__eyebrow{ color:rgba(15,23,42,.70); background:rgba(11,92,255,.08); border-color:rgba(11,92,255,.12); } html[data-theme="light"] .dashboardPro .dashHeroLead, body.theme-light .dashboardPro .dashHeroLead{ color:var(--muted); } html[data-theme="light"] .dashHeroIdentity__item, body.theme-light .dashHeroIdentity__item{ background:rgba(255,255,255,.72); border-color:rgba(15,23,42,.08); } html[data-theme="light"] .dashHeroIdentity__item span, body.theme-light .dashHeroIdentity__item span{ color:rgba(15,23,42,.58); } html[data-theme="light"] .dashHeroIdentity__item strong, body.theme-light .dashHeroIdentity__item strong{ color:#0f172a; } html[data-theme="light"] .dashMetric, body.theme-light .dashMetric, html[data-theme="light"] .dashPanel, body.theme-light .dashPanel{ box-shadow:0 14px 34px rgba(2,6,23,.07), inset 0 1px 0 rgba(255,255,255,.9); } html[data-theme="light"] .dashQueueCard, body.theme-light .dashQueueCard, html[data-theme="light"] .dashboardPro .topItem, body.theme-light .dashboardPro .topItem, html[data-theme="light"] .dashboardPro .eventItem, body.theme-light .dashboardPro .eventItem{ background:rgba(2,6,23,.025); border-color:rgba(15,23,42,.08); } @media (max-width: 1180px){ .dashProStats{grid-template-columns:repeat(2, minmax(0, 1fr));} .dashProLayout{grid-template-columns:1fr;} .dashPanel--chart, .dashPanel--top, .dashPanel--queue, .dashPanel--events{grid-column:auto;} } @media (max-width: 720px){ .dashProHero{ flex-direction:column; padding:16px; border-radius:22px; } .dashProHero__actions{ min-width:0; justify-content:stretch; } .dashProHero__actions .btn{flex:1 1 130px;} .dashProStats{grid-template-columns:1fr;} .dashMetric{padding:14px;border-radius:20px;} .dashPanel{padding:14px;border-radius:20px;} .dashCanvasWrap{min-height:230px;} .dashCanvasWrap canvas{height:230px;} } /* Password reveal inside login/register forms */ .passwordRevealField{position:relative;display:flex;align-items:center;width:100%;} .passwordRevealField .input{width:100%;padding-left:44px;} .passwordRevealBtn{position:absolute;left:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:0;border-radius:12px;background:color-mix(in srgb,var(--card) 72%,var(--muted) 10%);color:var(--muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,color .15s ease,transform .15s ease;} .passwordRevealBtn svg{width:18px;height:18px;} .passwordRevealBtn:hover,.passwordRevealBtn.is-active{color:var(--text);background:color-mix(in srgb,var(--primary) 14%,var(--card));} .passwordRevealBtn.is-active::after{content:"";position:absolute;width:21px;height:2px;border-radius:999px;background:currentColor;transform:rotate(-42deg);box-shadow:0 0 0 1px color-mix(in srgb,var(--card) 80%,transparent);} .passwordRevealBtn:active{transform:translateY(-50%) scale(.96);} .planPaymentDebugCard{ margin-top:12px; padding:12px; border:1px solid var(--border); border-radius:16px; background:rgba(15,23,42,.03); } .planPaymentLogBox{ display:flex; flex-direction:column; gap:8px; max-height:260px; overflow:auto; direction:ltr; text-align:left; font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace; font-size:11px; } .planPaymentLogItem{ border:1px solid var(--border); border-radius:12px; padding:8px; background:var(--card); white-space:pre-wrap; word-break:break-word; } .planPaymentLogItem b{ display:block; margin-bottom:4px; direction:rtl; text-align:right; font-family:inherit; } .planFreeBadge{ display:inline-flex; align-items:center; justify-content:center; padding:4px 9px; border-radius:999px; background:rgba(34,197,94,.12); color:#15803d; font-size:12px; font-weight:800; } .planCard.is-active-plan { border-color: rgba(34, 197, 94, .55); box-shadow: 0 18px 48px rgba(34, 197, 94, .10); } .planCard__ribbon--active { background: linear-gradient(135deg, #16a34a, #22c55e) !important; color: #fff !important; } .planCard.is-active-plan .planCard__actions .btn:disabled { opacity: 1; cursor: default; background: rgba(34,197,94,.10); border-color: rgba(34,197,94,.35); color: #15803d; } /* ---------------- v119: support chat + account footer cleanup ---------------- */ .supportChat{ width:min(380px, calc(100vw - 48px)); } .supportChat__head{ cursor:pointer; } .supportChat__body{ padding:12px; gap:10px; } .supportChat__messages{ max-height:260px; min-height:205px; } .supportChat__form textarea{ min-height:64px; max-height:132px; } .supportChat[data-collapsed="1"] .supportChat__messages{ min-height:0; } @media (max-width: 760px){ .supportChat__messages{ max-height:220px; min-height:175px; } } .accountInfoList{ margin-top:12px; display:grid; grid-template-columns:1fr; gap:8px; } .accountInfoItem{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 11px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.03); min-width:0; } .accountInfoItem > span:last-child, .accountInfoItem > strong:last-child{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; direction:ltr; unicode-bidi:plaintext; text-align:left; } .accountInfoItem .muted{ flex:0 0 auto; } .sidebar__footerBottom.sidebar__footerBottom--text{ direction:rtl !important; display:grid !important; grid-template-columns:1fr !important; gap:6px !important; margin-top:10px !important; } .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel, .sidebar__footerBottom.sidebar__footerBottom--text #planLabel{ width:100% !important; max-width:none !important; min-width:0 !important; display:flex !important; align-items:center !important; justify-content:space-between !important; gap:10px !important; padding:7px 10px !important; border:1px solid rgba(148,163,184,.18) !important; border-radius:14px !important; background:rgba(255,255,255,.035) !important; line-height:1.35 !important; font-weight:800 !important; box-sizing:border-box !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:clip !important; } .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel::before, .sidebar__footerBottom.sidebar__footerBottom--text #planLabel::before{ flex:0 0 auto; color:var(--muted); font-size:11px; font-weight:700; } .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel::before{ content:"نام کاربری"; } .sidebar__footerBottom.sidebar__footerBottom--text #planLabel::before{ content:"اشتراک فعلی"; } .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel, .sidebar__footerBottom.sidebar__footerBottom--text #planLabel{ color:var(--text) !important; direction:rtl !important; text-align:left !important; } .sidebar__footerBottom.sidebar__footerBottom--text #userNameLabel{ order:1 !important; } .sidebar__footerBottom.sidebar__footerBottom--text #planLabel{ order:2 !important; color:var(--muted) !important; } /* v119 */ .sidebar__footer{padding-bottom:10px;} html:not([data-theme="light"]) .brandLogoImg--dark{display:block;} @media (max-width:520px){.loginGate__logo{width:min(230px, 84%);}.loginGate__logoWrap{margin-bottom:8px;}} /* v123: admin UI must be invisible for normal users */ [data-superadmin-only], [data-superadmin-page]{ display:none !important; } body.is-admin-eligible [data-superadmin-only], body.is-admin-unlocked [data-superadmin-page]{ display:revert !important; } body.is-admin-unlocked section.page[data-superadmin-page]{ display:block !important; } /* ---------------- v295: mobile/login/dashboard polish ---------------- */ .loginGate__brand[hidden], .loginGate__title[hidden]{display:none !important;} @media (max-width: 980px){ .sidebar{ width:min(320px, 82vw); } } @media (max-width: 520px){ .sidebar{ width:min(300px, 80vw); } .loginGate{ place-items:center; justify-items:center; align-items:center; padding:14px; overflow:auto; } .loginGate__card{ width:min(460px, calc(100vw - 28px)); max-width:calc(100vw - 28px); margin-inline:auto; padding:16px; border-radius:20px; } } html[data-theme="light"] .sidebar__footer .clockTicker--ui, body.theme-light .sidebar__footer .clockTicker--ui{ box-shadow:none !important; } html[data-theme="light"] .supportChat, body.theme-light .supportChat{ background:#ffffff !important; border-color:rgba(37,99,235,.16) !important; box-shadow:0 16px 34px rgba(15,23,42,.10) !important; backdrop-filter:none; -webkit-backdrop-filter:none; } html[data-theme="light"] .supportChatMsg, body.theme-light .supportChatMsg{ background:#ffffff !important; border-color:rgba(148,163,184,.28) !important; } html[data-theme="light"] .supportChatMsg--user, body.theme-light .supportChatMsg--user{ background:#eef5ff !important; border-color:rgba(37,99,235,.20) !important; } html[data-theme="light"] .supportChat__form textarea, body.theme-light .supportChat__form textarea{ background:#f8fbff !important; border-color:rgba(148,163,184,.32) !important; } html[data-theme="light"] .supportChat__min, body.theme-light .supportChat__min{ background:#f8fbff; } /* ---------------- v296: plan checkout fix + stronger light UI + password meter ---------------- */ html[data-theme="light"] body, body.theme-light{ background: radial-gradient(900px 520px at 12% -10%, rgba(37,99,235,.16), transparent 58%), radial-gradient(780px 520px at 92% 8%, rgba(14,165,233,.13), transparent 56%), linear-gradient(180deg, #f5f8ff 0%, #eef6ff 46%, #f7fbff 100%) !important; } html[data-theme="light"] .card, body.theme-light .card, html[data-theme="light"] .dashPanel, body.theme-light .dashPanel, html[data-theme="light"] .planCheckoutCard, body.theme-light .planCheckoutCard, html[data-theme="light"] .planCatalogCard, body.theme-light .planCatalogCard{ background:rgba(255,255,255,.96) !important; border-color:rgba(37,99,235,.11) !important; box-shadow:0 14px 34px rgba(37,99,235,.08) !important; } html[data-theme="light"] .dashProHero, body.theme-light .dashProHero{ background:linear-gradient(135deg, rgba(255,255,255,.98), rgba(239,246,255,.96)) !important; border-color:rgba(37,99,235,.14) !important; box-shadow:0 18px 42px rgba(37,99,235,.10) !important; } html[data-theme="light"] .nav__item.is-active, body.theme-light .nav__item.is-active{ background:linear-gradient(135deg, rgba(37,99,235,.12), rgba(14,165,233,.10)) !important; color:#0b5cff !important; border-color:rgba(37,99,235,.22) !important; } html[data-theme="light"] .btn:not(.btn--danger), body.theme-light .btn:not(.btn--danger){ box-shadow:0 8px 18px rgba(37,99,235,.07); } html[data-theme="light"] .input, body.theme-light .input, html[data-theme="light"] input, body.theme-light input, html[data-theme="light"] textarea, body.theme-light textarea, html[data-theme="light"] select, body.theme-light select{ background:#fbfdff; border-color:rgba(37,99,235,.15); } .passwordStrength{display:grid;gap:6px;margin-top:8px;} .passwordStrength__bar{height:7px;border-radius:999px;background:rgba(148,163,184,.20);overflow:hidden;border:1px solid rgba(148,163,184,.18);} .passwordStrength__bar span{display:block;height:100%;width:0;border-radius:inherit;background:#ef4444;transition:width .18s ease, background .18s ease;} .passwordStrength.is-medium .passwordStrength__bar span{background:#f59e0b;} .passwordStrength.is-strong .passwordStrength__bar span{background:#22c55e;} .passwordStrength__meta{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;line-height:1.5;color:var(--muted);} .passwordStrength__meta b{color:var(--text);font-weight:900;white-space:nowrap;} .passwordStrength__meta small{text-align:left;direction:rtl;} @media (max-width:520px){.passwordStrength__meta{flex-direction:column;align-items:flex-start;gap:2px}.passwordStrength__meta small{text-align:right}} /* ---------------- v297: payment return polish ---------------- */ .planPaymentSuccessModal__icon--fail{ background:rgba(239,68,68,.14) !important; color:#ef4444 !important; border-color:rgba(239,68,68,.30) !important; font-size:32px; font-weight:900; } html[data-theme="light"] .planPaymentFailModal, body.theme-light .planPaymentFailModal{ background:rgba(254,242,242,.95) !important; border-color:rgba(239,68,68,.24) !important; } /* ---------------- v305: temporary OTP debug on login page ---------------- */ .otpDebugPanel{ margin-top:12px; border:1px dashed rgba(245,158,11,.45); background:rgba(15,23,42,.72); color:#e5e7eb; border-radius:14px; overflow:hidden; direction:ltr; text-align:left; } .otpDebugPanel__head{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 10px; border-bottom:1px solid rgba(245,158,11,.22); direction:rtl; text-align:right; color:#fbbf24; font-size:12px; } .otpDebugPanel__clear{ border:1px solid rgba(245,158,11,.35); background:rgba(245,158,11,.10); color:#fbbf24; border-radius:10px; padding:5px 9px; cursor:pointer; font-size:11px; font-family:inherit; } .otpDebugPanel pre{ margin:0; padding:10px; max-height:220px; overflow:auto; white-space:pre-wrap; word-break:break-word; font:11px/1.65 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; } html[data-theme="light"] .otpDebugPanel, body.theme-light .otpDebugPanel{ background:#fffaf0; color:#334155; border-color:rgba(245,158,11,.48); } /* ---------------- v306: plan/addon + light nav polish ---------------- */ .nav__item[data-nav="settings"] .nav__content svg, .nav__item[data-nav="settings"] svg{ width:20px !important; height:20px !important; stroke-width:1.85 !important; } html[data-theme="light"] .nav__item[data-nav="settings"].is-active, body.theme-light .nav__item[data-nav="settings"].is-active{ background:linear-gradient(90deg, rgba(37,99,235,.12), rgba(96,165,250,.08)) !important; border-color:rgba(37,99,235,.24) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.55), 0 8px 18px rgba(37,99,235,.08) !important; } .planAddonGrid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));} .planAddonItem{display:grid;gap:8px;border:1px solid var(--border);border-radius:16px;padding:12px;background:rgba(255,255,255,.035)} .planAddonItem strong{font-weight:900;color:var(--text)} .planAddonItem span{font-size:12px;color:var(--muted);line-height:1.7} .planAddonItem input{width:100%;border:1px solid var(--border);border-radius:12px;padding:10px;background:var(--panel);color:var(--text);text-align:center;font-weight:900} html[data-theme="light"] .planAddonItem, body.theme-light .planAddonItem{background:#fff;border-color:rgba(37,99,235,.14);box-shadow:0 10px 24px rgba(15,23,42,.06)} /* ---------------- v308: account addons gating + report/personal polish ---------------- */ .nav__item[data-nav="settings"] .nav__content svg, .nav__item[data-nav="settings"] svg{ width:18px !important; height:18px !important; stroke-width:1.7 !important; opacity:.9; } html[data-theme="light"] .nav__item[data-nav="settings"].is-active, body.theme-light .nav__item[data-nav="settings"].is-active{ background:linear-gradient(90deg, rgba(37,99,235,.09), rgba(96,165,250,.055)) !important; border-color:rgba(37,99,235,.18) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.72), 0 6px 14px rgba(37,99,235,.055) !important; } .planAddonNotice{ grid-column:1/-1; border:1px dashed rgba(var(--accent-rgb),.32); border-radius:16px; padding:14px 16px; background:rgba(var(--accent-rgb),.055); color:var(--text); font-weight:800; line-height:1.8; text-align:center; } html[data-theme="light"] .planAddonNotice, body.theme-light .planAddonNotice{ background:#f7fbff; border-color:rgba(37,99,235,.22); color:#1e3a8a; } .personalComingSoon{ display:grid; justify-items:center; gap:10px; min-height:220px; align-content:center; text-align:center; } .personalComingSoon__icon{ width:58px; height:58px; border-radius:20px; display:grid; place-items:center; background:rgba(var(--accent-rgb),.12); border:1px solid rgba(var(--accent-rgb),.22); font-size:24px; } .reportPageTitle{margin-bottom:10px;} .reportCard--pro{ padding:16px !important; border-radius:24px !important; } .reportCard--pro .reportTop{ align-items:center; background:linear-gradient(135deg, rgba(var(--accent-rgb),.12), rgba(34,197,94,.055)); border:1px solid rgba(var(--accent-rgb),.16); border-radius:20px; padding:14px; margin-bottom:14px; } .reportCard--pro .reportTitle__h{ font-size:clamp(18px,2.2vw,24px); } .reportCard--pro .reportStats{ gap:12px; } .reportCard--pro .statBox{ min-height:86px; border-radius:20px; position:relative; overflow:hidden; } .reportCard--pro .statBox::after{ content:""; position:absolute; left:12px; top:12px; width:34px; height:34px; border-radius:14px; background:rgba(var(--accent-rgb),.10); border:1px solid rgba(var(--accent-rgb),.14); } .reportCard--pro .chartBox{ border-radius:22px; padding:14px; } html[data-theme="light"] .reportCard--pro .reportTop, body.theme-light .reportCard--pro .reportTop{ background:linear-gradient(135deg,#eef5ff 0%,#f7fbff 62%,#f0fdf4 100%); border-color:rgba(37,99,235,.12); } html[data-theme="light"] .reportCard--pro .chartBox, body.theme-light .reportCard--pro .chartBox{ background:#fff; border-color:rgba(15,23,42,.09); box-shadow:0 12px 28px rgba(15,23,42,.055); } @media (max-width:760px){ .reportCard--pro .reportTop{align-items:stretch;} .reportToolbar .filter-mini__fields{width:100%;} .reportToolbar{width:100%;} } /* ---------------- v309: personal cloud icon + report bottom layout + restore report header ---------------- */ .personalComingSoon__icon svg{width:30px;height:30px;display:block;} .personalComingSoon__icon{ color:var(--accent); font-size:0 !important; background:linear-gradient(135deg, rgba(var(--accent-rgb),.14), rgba(14,165,233,.08)); } /* برگرداندن بالای گزارش به حالت ساده قبل؛ فقط چیدمان پایین صفحه بهبود می‌ماند. */ .reportCard--pro .reportTop{ background:transparent !important; border:0 !important; border-radius:0 !important; padding:0 !important; margin-bottom:12px !important; box-shadow:none !important; } html[data-theme="light"] .reportCard--pro .reportTop, body.theme-light .reportCard--pro .reportTop{ background:transparent !important; border-color:transparent !important; } .reportCard--pro .reportTitle__h{font-size:18px !important;} .reportCard--pro .reportTitle__sub{max-width:58ch;} .reportCard--pro .reportStats{ display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:12px !important; margin-top:14px !important; } .reportCard--pro .reportStats .statBox{ min-height:96px; display:grid; align-content:center; gap:8px; } .reportCard--pro .reportStats .statBox::after{ top:auto; bottom:12px; left:12px; opacity:.75; } .reportCard--pro .reportCharts{ display:grid !important; grid-template-columns:minmax(280px,.92fr) minmax(320px,1.08fr) !important; gap:14px !important; align-items:stretch !important; margin-top:14px !important; } .reportCard--pro .chartBox{ min-height:335px; display:grid; grid-template-rows:auto minmax(0,1fr) auto; align-items:stretch; } .reportCard--pro .chartBox canvas{ max-width:100%; align-self:center; } .reportCard--pro #repPieLegend{ justify-content:center; } @media (max-width:900px){ .reportCard--pro .reportStats{grid-template-columns:repeat(2,minmax(0,1fr)) !important;} .reportCard--pro .reportCharts{grid-template-columns:1fr !important;} } @media (max-width:520px){ .reportCard--pro .reportStats{grid-template-columns:1fr !important;} .reportCard--pro .chartBox{min-height:300px;} } /* ---------------- v310: admin visibility + module add-ons + feedback polish ---------------- */ body.is-admin-unlocked section.page[data-superadmin-page][hidden], section.page[data-superadmin-page][hidden]{ display:none !important; } body.is-admin-unlocked section.page[data-superadmin-page]:not([hidden]){ display:block !important; } .btn--feedbackSubmit{ min-width:128px; min-height:44px; padding-inline:24px; font-size:14px; font-weight:900; } .planAddonGrid{ grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); } .planAddonItem--stepper{ align-content:start; gap:12px; } .planAddonItem__info{display:grid;gap:4px;} .addonStepper{ display:grid; grid-template-columns:44px minmax(0,1fr) 44px; gap:8px; align-items:center; direction:ltr; } .addonStepper__btn{ width:44px; height:44px; border-radius:14px; border:1px solid rgba(var(--accent-rgb),.26); background:rgba(var(--accent-rgb),.10); color:var(--accent); font-size:24px; line-height:1; font-weight:900; cursor:pointer; } .addonStepper__btn:hover{background:rgba(var(--accent-rgb),.16)} .addonStepper__input{ height:44px; direction:ltr; text-align:center; font-weight:900; border-radius:14px; } .planAddonItem__sum{ color:var(--text); font-weight:900; text-align:center; padding:8px 10px; border-radius:12px; background:rgba(var(--accent-rgb),.06); } .planAddonItem__permanent{ display:block; margin-top:2px; color:var(--muted); font-size:12px; line-height:1.8; } .loginGate--force-repaint, .loginGate__step--justShown{ transform:translateZ(0); will-change:transform,opacity; } html[data-theme="light"] .addonStepper__btn, body.theme-light .addonStepper__btn{ background:#eef5ff; border-color:rgba(37,99,235,.22); color:#0b5cff; } html[data-theme="light"] .planAddonItem__sum, body.theme-light .planAddonItem__sum{ background:#f7fbff; color:#1e3a8a; } /* ---------------- v311: no-plan banner + login footer + noisy captcha ---------------- */ .noPlanGlobalBanner{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 14px; padding:12px 14px; border:1px solid rgba(239,68,68,.52); border-radius:16px; background:linear-gradient(135deg, rgba(239,68,68,.08), rgba(37,99,235,.06)); color:var(--text); box-shadow:0 10px 28px rgba(15,23,42,.06); } .noPlanGlobalBanner[hidden]{display:none!important;} .noPlanGlobalBanner__text{font-weight:900;line-height:1.8;} .noPlanGlobalBanner .btn{min-width:116px;min-height:40px;border-radius:13px;font-weight:900;} @media (max-width:640px){ .noPlanGlobalBanner{flex-direction:column;align-items:stretch;text-align:center;} .noPlanGlobalBanner .btn{width:100%;} } .loginGate__subtitle{ text-align:center; margin:-2px 0 10px; color:var(--muted,#94a3b8); font-weight:900; font-size:13px; line-height:1.7; } .loginGate__footerInfo{ margin-top:12px; display:grid; gap:5px; text-align:center; color:var(--muted,#94a3b8); font-size:12px; line-height:1.7; } .loginGate__version{direction:ltr;font-weight:800;} .loginGate__socialLink{color:var(--link,#60a5fa);text-decoration:none;font-weight:800;} .loginGate__socialLink:hover{text-decoration:underline;} .loginGate__captchaQuestion{ position:relative; overflow:hidden; isolation:isolate; background: repeating-linear-gradient(18deg, rgba(37,99,235,.12) 0 2px, transparent 2px 7px), repeating-linear-gradient(-22deg, rgba(239,68,68,.08) 0 1px, transparent 1px 8px), radial-gradient(circle at 15% 40%, rgba(37,99,235,.16), transparent 22%), rgba(37,99,235,.055) !important; } .loginGate__captchaQuestion::before{ content:''; position:absolute; inset:-10px; z-index:-1; background-image: radial-gradient(circle, rgba(15,23,42,.18) 0 1px, transparent 1.6px), radial-gradient(circle, rgba(37,99,235,.16) 0 1px, transparent 1.8px); background-size:13px 11px, 19px 17px; transform:rotate(-4deg); opacity:.55; } .loginGate__captchaQuestion::after{ content:'↻'; font-size:14px; opacity:.7; margin-inline-start:8px; filter:drop-shadow(0 1px 0 rgba(255,255,255,.35)); } .captchaNoise{ position:absolute; inset:8px; pointer-events:none; border-top:2px solid rgba(37,99,235,.28); border-bottom:1px dashed rgba(15,23,42,.22); transform:skewX(-18deg) rotate(-2deg); opacity:.8; } .captchaPart{ display:inline-block; margin:0 3px; transform:rotate(var(--r,0deg)) translateY(var(--y,0)); text-shadow:1px 1px 0 rgba(255,255,255,.52), -1px 0 0 rgba(37,99,235,.16); letter-spacing:.5px; } .captchaPart--word{letter-spacing:0;opacity:.92;} html[data-theme="dark"] .loginGate__captchaQuestion::before{opacity:.72;} html[data-theme="dark"] .captchaPart{text-shadow:1px 1px 0 rgba(0,0,0,.65), -1px 0 0 rgba(96,165,250,.24);} /* ---------------- v312: cleaner captcha, no global plan banner, compact admin ---------------- */ .noPlanGlobalBanner{display:none !important;} .loginGate__captchaBody{ grid-template-columns:minmax(150px,auto) minmax(0,1fr) !important; direction:rtl; align-items:center; } .loginGate__captchaQuestion{ min-height:48px; direction:ltr !important; justify-content:center; gap:4px; background: linear-gradient(135deg, rgba(37,99,235,.10), rgba(16,185,129,.06)), radial-gradient(circle at 18% 25%, rgba(37,99,235,.16), transparent 24%), radial-gradient(circle at 82% 78%, rgba(99,102,241,.10), transparent 28%) !important; border-color:rgba(37,99,235,.22) !important; } .loginGate__captchaQuestion::before{ content:''; position:absolute; inset:7px 10px; z-index:-1; background: linear-gradient(18deg, transparent 0 44%, rgba(37,99,235,.22) 45% 47%, transparent 48% 100%), linear-gradient(-12deg, transparent 0 56%, rgba(15,23,42,.13) 57% 58%, transparent 59% 100%); opacity:.75; transform:none; } .loginGate__captchaQuestion::after{ content:'↻'; margin-inline-start:8px; opacity:.55; font-size:13px; } .captchaNoise{display:none !important;} .captchaCanvasLine{ position:absolute; pointer-events:none; left:14px; right:14px; height:2px; border-radius:999px; opacity:.45; z-index:0; } .captchaCanvasLine--a{top:18px;background:rgba(37,99,235,.34);transform:rotate(-5deg);} .captchaCanvasLine--b{bottom:16px;background:rgba(16,185,129,.26);transform:rotate(4deg);} .captchaText{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;unicode-bidi:isolate;font-variant-numeric:tabular-nums;} .captchaPart{ margin:0 1px !important; min-width:18px; font-size:17px; font-weight:950; transform:rotate(var(--r,0deg)) translateY(var(--y,0)); color:var(--text); text-shadow:0 1px 0 rgba(255,255,255,.50), 0 0 8px rgba(37,99,235,.16); } .captchaPart--op,.captchaPart--eq{font-size:15px;opacity:.82;} .captchaPart--word{display:none!important;} @media (max-width:520px){ .loginGate__captchaBody{ grid-template-columns:minmax(128px, 1fr) minmax(0, 1fr) !important; gap:8px !important; direction:rtl; } .loginGate__captchaQuestion{min-height:46px;padding:8px 10px !important;} .loginGate__captchaField .input{min-height:46px;} } .adminTicketItem--compact{padding:12px !important;display:grid;gap:9px;} .adminTicketCompact__top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;} .adminTicketCompact__main{min-width:0;display:grid;gap:4px;} .adminTicketCompact__main strong{font-size:13px;line-height:1.7;} .adminTicketCompact__main p{margin:0;color:var(--muted);font-size:12px;line-height:1.8;white-space:pre-wrap;word-break:break-word;} .adminTicketCompact__meta{display:grid;justify-items:end;gap:5px;flex:0 0 auto;} .adminTicketCompact__chips{display:flex;gap:6px;flex-wrap:wrap;} .adminReplyBox--compact{padding:8px !important;border-radius:14px;background:rgba(148,163,184,.045);} .adminReplyBox--compact .adminReplyInput{min-height:48px;font-size:12px;} .adminTicketCompact__actions{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-top:7px;} .adminTabPanel[data-admin-panel="plan"] .adminGrid{gap:16px;align-items:stretch !important;} .adminTabPanel[data-admin-panel="plan"] .adminCard{border-radius:18px;} .adminPlanEditorCard{border-color:rgba(37,99,235,.24) !important;box-shadow:0 14px 34px rgba(37,99,235,.06);} .adminTabPanel[data-admin-panel="plan"] .adminCard:has(#adminPlansList){border-color:rgba(16,185,129,.22) !important;} .adminAddonCard{border-color:rgba(245,158,11,.26) !important;} .adminCouponCard{border-color:rgba(139,92,246,.24) !important;} @media (max-width:640px){ .adminTicketCompact__top{display:grid;} .adminTicketCompact__meta{justify-items:start;display:flex;align-items:center;justify-content:space-between;} .adminTicketCompact__actions{display:grid;} } /* ---------------- v314: 30-day login + support/AI chat polish ---------------- */ .supportChat__tabs{ display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:4px; border:1px solid rgba(var(--accent-rgb),.16); background:rgba(var(--accent-rgb),.055); border-radius:14px; } .supportChat__tab{ appearance:none; border:0; border-radius:11px; padding:8px 10px; background:transparent; color:var(--muted); font-weight:900; cursor:pointer; } .supportChat__tab.is-active{ color:var(--accent); background:rgba(var(--accent-rgb),.14); box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.22); } .supportChat__ai{ border:1px dashed rgba(var(--accent-rgb),.28); background:rgba(var(--accent-rgb),.055); border-radius:16px; padding:14px; line-height:1.9; color:var(--text); } .supportChat__ai strong{display:block;font-size:13px;margin-bottom:4px;color:var(--accent)} .supportChat__ai p{margin:0;color:var(--muted);font-size:12px} .supportChat__body{gap:10px;} .supportChat__messages{border-radius:14px;} .supportChat__form{grid-template-columns:minmax(0,1fr) 72px;} .supportChat__form button{min-height:44px;border-radius:14px;font-weight:900;} @media (max-width:760px){ .supportChat__form{grid-template-columns:1fr;} .supportChat__form button{width:100%;} } /* ---------------- v314: OTP polish + required mobile register ---------------- */ .loginGate__otpDigits.is-ok .loginGate__otpDigit, .loginGate__otpDigit.is-ok{ border-color:rgba(34,197,94,.78) !important; background:rgba(34,197,94,.10) !important; box-shadow:0 0 0 2px rgba(34,197,94,.10) !important; } .loginGate__otpDigits.is-err .loginGate__otpDigit, .loginGate__otpDigit.is-err{ border-color:rgba(239,68,68,.78) !important; background:rgba(239,68,68,.10) !important; box-shadow:0 0 0 2px rgba(239,68,68,.10) !important; } .loginGate__otpDigits.is-checking .loginGate__otpDigit, .loginGate__otpDigit.is-checking{ border-color:rgba(59,130,246,.62) !important; background:rgba(59,130,246,.08) !important; } .loginGate__version{direction:rtl;unicode-bidi:plaintext;} /* ---------------- v315: AI support chat ---------------- */ .supportChatMsg--ai{ background:color-mix(in oklab, var(--panel) 76%, #22c55e 18%); border-color:rgba(34,197,94,.26); } html[data-theme="light"] .supportChatMsg--ai, body.theme-light .supportChatMsg--ai{ background:#effdf5 !important; border-color:rgba(22,163,74,.22) !important; } .supportChat[data-mode="ai"] .supportChat__dot{ background:rgba(59,130,246,.95); box-shadow:0 0 0 4px rgba(59,130,246,.14); } .supportChat[data-mode="ai"] .supportChat__messages{ min-height:190px; } /* ---------------- v316: rectangular AI support chat + animated blue border + intro bubble ---------------- */ .supportChat{ border-radius:12px !important; overflow:visible !important; border:1px solid rgba(59,130,246,.30) !important; isolation:isolate; box-shadow:0 20px 46px rgba(15,23,42,.22), 0 0 0 1px rgba(59,130,246,.10) !important; } .supportChat::before{ content:""; position:absolute; inset:-2px; z-index:-1; border-radius:14px; padding:2px; background:conic-gradient(from var(--support-chat-angle, 0deg), rgba(14,165,233,.15), rgba(37,99,235,.95), rgba(99,102,241,.55), rgba(14,165,233,.15)); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; animation:supportChatBlueRing 2.7s linear infinite; pointer-events:none; } @property --support-chat-angle{ syntax:''; inherits:false; initial-value:0deg; } @keyframes supportChatBlueRing{ to{ --support-chat-angle:360deg; } } .supportChat::after{ content:"سؤال یا مشکلی دارید؟ من اینجام"; position:absolute; left:12px; bottom:calc(100% + 10px); max-width:min(270px, calc(100vw - 56px)); padding:10px 14px; border-radius:12px 12px 4px 12px; color:#fff; font-size:12px; font-weight:900; line-height:1.7; background:linear-gradient(135deg, #2563eb, #0ea5e9); box-shadow:0 18px 34px rgba(37,99,235,.26); transform-origin:left bottom; animation:supportChatNotice 7.5s ease-in-out infinite; pointer-events:none; white-space:nowrap; } @keyframes supportChatNotice{ 0%, 8%{ opacity:0; transform:translateY(6px) scale(.96); } 16%, 48%{ opacity:1; transform:translateY(0) scale(1); } 62%, 100%{ opacity:0; transform:translateY(-8px) scale(.98); } } .supportChat__head{ border-radius:12px 12px 0 0; background:linear-gradient(135deg, rgba(37,99,235,.14), rgba(14,165,233,.07)); } .supportChat__body{ border-radius:0 0 12px 12px; overflow:hidden; } .supportChat__ai{ min-height:0 !important; padding:0 !important; border:0 !important; background:transparent !important; line-height:0 !important; } .supportChat__ai strong, .supportChat__ai p{display:none !important;} .supportChat[data-mode="ai"] .supportChat__title::after{ content:"آنلاین"; margin-inline-start:6px; padding:2px 7px; border-radius:999px; font-size:10px; color:#1d4ed8; background:rgba(59,130,246,.13); border:1px solid rgba(59,130,246,.22); } .supportChat[data-mode="ai"] .supportChatMsg--system .supportChatMsg__text{ color:var(--text); } .supportChat[data-collapsed="1"]::after{ bottom:calc(100% + 12px); } html[data-theme="light"] .supportChat, body.theme-light .supportChat{ box-shadow:0 18px 38px rgba(37,99,235,.12), 0 0 0 1px rgba(37,99,235,.08) !important; } html[data-theme="light"] .supportChat::after, body.theme-light .supportChat::after{ box-shadow:0 14px 30px rgba(37,99,235,.20); } @media (max-width:760px){ .supportChat::after{ left:14px; right:auto; white-space:normal; } } /* ---------------- v317: compact support chat, one-shot login notice, AI loading, pin mode ---------------- */ .supportChat{ width:min(300px, calc(100vw - 48px)) !important; border-radius:11px !important; } .supportChat__actions{ display:flex; align-items:center; gap:6px; flex:0 0 auto; } .supportChat__pin, .supportChat__min{ display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; } .supportChat__pin{ width:28px; height:28px; border-radius:10px; border:1px solid var(--border); background:transparent; color:var(--text); cursor:pointer; font-size:14px; line-height:1; filter:grayscale(.9); opacity:.72; transition:transform .16s ease, background .16s ease, opacity .16s ease, filter .16s ease; } .supportChat__pin:hover{background:rgba(255,255,255,.07);opacity:1;transform:translateY(-1px);} .supportChat__pin.is-active{ opacity:1; filter:none; background:rgba(59,130,246,.15); border-color:rgba(59,130,246,.36); box-shadow:0 0 0 3px rgba(59,130,246,.10); } .supportChat.is-pinned .supportChat__title::before{ content:"پین‌شده"; order:3; margin-inline-start:6px; padding:2px 7px; border-radius:999px; font-size:10px; color:#1d4ed8; background:rgba(59,130,246,.13); border:1px solid rgba(59,130,246,.22); } .supportChat__form{grid-template-columns:minmax(0,1fr) 68px !important;} .supportChat__form textarea{min-height:40px !important;font-size:11.8px !important;} .supportChat__form button{ min-height:40px !important; padding-inline:10px !important; display:inline-flex; align-items:center; justify-content:center; gap:6px; white-space:nowrap; } .supportChat__messages{max-height:168px !important;} .supportChat[data-mode="ai"] .supportChat__messages{min-height:176px !important;} .supportChat::after{ opacity:0 !important; animation:none !important; transform:translateY(6px) scale(.96); } .supportChat.supportChat--notice::after{ content:"سؤال یا مشکلی دارید؟ من اینجام"; opacity:1 !important; animation:supportChatNoticeOnce 7.2s ease-in-out both !important; } @keyframes supportChatNoticeOnce{ 0%, 8%{ opacity:0; transform:translateY(7px) scale(.96); } 16%, 70%{ opacity:1; transform:translateY(0) scale(1); } 100%{ opacity:0; transform:translateY(-9px) scale(.98); } } .supportBtnSpinner{ width:14px; height:14px; border-radius:999px; border:2px solid rgba(255,255,255,.45); border-top-color:#fff; animation:supportSpin .8s linear infinite; } @keyframes supportSpin{to{transform:rotate(360deg)}} .supportTyping{ display:inline-flex; align-items:center; gap:4px; margin-inline-end:8px; vertical-align:middle; } .supportTyping i{ width:6px; height:6px; border-radius:999px; background:rgba(37,99,235,.86); display:block; animation:supportTypingBounce 1s ease-in-out infinite; } .supportTyping i:nth-child(2){animation-delay:.14s;} .supportTyping i:nth-child(3){animation-delay:.28s;} @keyframes supportTypingBounce{ 0%, 80%, 100%{ transform:translateY(0); opacity:.42; } 40%{ transform:translateY(-5px); opacity:1; } } .supportChatMsg--loading{ border-color:rgba(59,130,246,.26) !important; background:linear-gradient(135deg, rgba(59,130,246,.12), rgba(14,165,233,.07)) !important; } .supportAiLink{ appearance:none; border:1px solid rgba(59,130,246,.26); background:rgba(59,130,246,.10); color:var(--accent); border-radius:999px; padding:1px 8px; margin:0 2px; font:inherit; font-weight:900; cursor:pointer; line-height:1.8; display:inline-flex; align-items:center; } .supportAiLink:hover{ background:rgba(59,130,246,.18); border-color:rgba(59,130,246,.42); } html[data-theme="light"] .supportTyping i, body.theme-light .supportTyping i{background:#2563eb;} @media (max-width:760px){ .supportChat{width:auto !important;} .supportChat__form{grid-template-columns:1fr !important;} .supportChat__messages{max-height:142px !important;} } /* ---------------- v319: restore open chat size + clean collapsed/pinned chat UX ---------------- */ .supportChat:not([data-collapsed="1"]){ width:min(380px, calc(100vw - 48px)) !important; border-radius:12px !important; } .supportChat:not([data-collapsed="1"]) .supportChat__messages{ min-height:205px !important; max-height:260px !important; } .supportChat:not([data-collapsed="1"])[data-mode="ai"] .supportChat__messages{ min-height:205px !important; } .supportChat[data-collapsed="1"]:not(.is-pinned){ width:min(248px, calc(100vw - 32px)) !important; border-radius:14px !important; } .supportChat[data-collapsed="1"] .supportChat__pin, .supportChat[data-collapsed="1"] .supportChat__title::before, .supportChat[data-collapsed="1"] .supportChat__title::after{ display:none !important; content:none !important; } .supportChat[data-collapsed="1"] .supportChat__head{ min-height:46px; padding:8px 10px; } .supportChat__pin{filter:none !important;} .supportChat__pin svg{ width:16px; height:16px; display:block; } .supportChat.is-pinned[data-collapsed="1"]{ width:60px !important; height:60px !important; min-width:60px !important; border-radius:999px !important; overflow:visible !important; cursor:pointer; } .supportChat.is-pinned[data-collapsed="1"]::before{ border-radius:999px !important; inset:-2px; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head{ width:100%; height:100%; min-height:0; padding:0 !important; display:grid; place-items:center; border:0 !important; border-radius:999px !important; background:linear-gradient(135deg, rgba(37,99,235,.96), rgba(14,165,233,.86)) !important; box-shadow:0 16px 34px rgba(37,99,235,.24); } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head > *{ display:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head::before{ content:""; width:27px; height:27px; display:block; background:#fff; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4a7 7 0 0 0-7 7v3a3 3 0 0 0 3 3h1v-6H6a6 6 0 0 1 12 0h-3v6h1a3 3 0 0 0 3-3v-3a7 7 0 0 0-7-7Zm-1 11H8v-2h3v2Zm5 0h-3v-2h3v2Z'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4a7 7 0 0 0-7 7v3a3 3 0 0 0 3 3h1v-6H6a6 6 0 0 1 12 0h-3v6h1a3 3 0 0 0 3-3v-3a7 7 0 0 0-7-7Zm-1 11H8v-2h3v2Zm5 0h-3v-2h3v2Z'/%3E%3C/svg%3E") center/contain no-repeat; } .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head::before{ -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3l1.35 3.85L17 8l-3.65 1.15L12 13l-1.35-3.85L7 8l3.65-1.15L12 3Zm-5 9l.9 2.2L10 15l-2.1.8L7 18l-.9-2.2L4 15l2.1-.8L7 12Zm10 2l.8 2.15L20 17l-2.2.85L17 20l-.8-2.15L14 17l2.2-.85L17 14Z'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3l1.35 3.85L17 8l-3.65 1.15L12 13l-1.35-3.85L7 8l3.65-1.15L12 3Zm-5 9l.9 2.2L10 15l-2.1.8L7 18l-.9-2.2L4 15l2.1-.8L7 12Zm10 2l.8 2.15L20 17l-2.2.85L17 20l-.8-2.15L14 17l2.2-.85L17 14Z'/%3E%3C/svg%3E") center/contain no-repeat; } .supportChat__tabs{ position:relative; overflow:hidden; isolation:isolate; } .supportChat__tabs::before{ content:""; position:absolute; top:4px; bottom:4px; right:4px; width:calc(50% - 5px); border-radius:11px; background:rgba(var(--accent-rgb),.16); box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.24), 0 8px 18px rgba(37,99,235,.08); transform:translateX(0); transition:transform .24s cubic-bezier(.2,.9,.2,1); z-index:0; } .supportChat[data-mode="ai"] .supportChat__tabs::before{ transform:translateX(calc(-100% - 6px)); } .supportChat__tab{ position:relative; z-index:1; transition:color .18s ease, transform .18s ease; } .supportChat__tab.is-active{ background:transparent !important; box-shadow:none !important; transform:translateY(-1px); } .supportChat--modeSwitch .supportChat__messages{ animation:supportChatPaneSwitch .26s ease both; } @keyframes supportChatPaneSwitch{ 0%{opacity:.35; transform:translateY(6px) scale(.995);} 100%{opacity:1; transform:translateY(0) scale(1);} } .supportChat__form{ grid-template-columns:minmax(0,1fr) 88px !important; align-items:stretch !important; gap:8px !important; } .supportChat__form textarea{ min-height:52px !important; max-height:122px !important; font-size:12px !important; line-height:1.7 !important; overflow:auto; } .supportChat__form button{ min-height:52px !important; height:auto !important; padding-inline:8px !important; white-space:nowrap !important; overflow:hidden; text-overflow:ellipsis; } .supportBtnSpinner{display:none !important;} @media (max-width:760px){ .supportChat:not([data-collapsed="1"]){ left:12px !important; right:12px !important; width:auto !important; } .supportChat__form{ grid-template-columns:minmax(0,1fr) 82px !important; } .supportChat:not([data-collapsed="1"]) .supportChat__messages{ min-height:175px !important; max-height:220px !important; } } /* ---------------- v320: polished pin icon, sliding suggestions, compact AI input, better pinned bubble ---------------- */ .supportChat__pin{ width:31px !important; height:31px !important; border-radius:999px !important; color:#bcd5ff !important; background:linear-gradient(135deg, rgba(37,99,235,.10), rgba(14,165,233,.05)) !important; border-color:rgba(96,165,250,.22) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 8px 18px rgba(15,23,42,.16) !important; } .supportChat__pin svg{ width:17px !important; height:17px !important; stroke-width:2.15 !important; transition:transform .18s ease, color .18s ease; } .supportChat__pin:hover{ color:#fff !important; background:linear-gradient(135deg, rgba(37,99,235,.22), rgba(14,165,233,.12)) !important; border-color:rgba(96,165,250,.40) !important; transform:translateY(-1px) !important; } .supportChat__pin.is-active{ color:#fff !important; background:linear-gradient(135deg, rgba(37,99,235,.86), rgba(14,165,233,.70)) !important; border-color:rgba(147,197,253,.62) !important; box-shadow:0 0 0 3px rgba(37,99,235,.15), 0 12px 22px rgba(37,99,235,.20) !important; } .supportChat__pin.is-active svg{transform:rotate(-18deg) scale(1.02);} html[data-theme="light"] .supportChat__pin, body.theme-light .supportChat__pin{ color:#1d4ed8 !important; background:linear-gradient(135deg, rgba(37,99,235,.08), rgba(14,165,233,.05)) !important; } html[data-theme="light"] .supportChat__pin.is-active, body.theme-light .supportChat__pin.is-active{color:#fff !important;} .supportChat__suggest{ overflow:hidden; min-height:31px; margin-top:-2px; margin-bottom:-1px; display:flex; align-items:center; justify-content:stretch; } .supportChat__suggest[hidden]{display:none !important;} .supportChat__suggestBtn{ width:100%; min-height:30px; border:1px solid rgba(59,130,246,.20); border-radius:13px; padding:5px 10px; text-align:right; color:#cfe0ff; background:linear-gradient(135deg, rgba(37,99,235,.11), rgba(14,165,233,.055)); font-size:11.2px; font-weight:850; line-height:1.5; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-shadow:inset 0 1px 0 rgba(255,255,255,.05); } .supportChat__suggestBtn::before{ content:"نمونه سؤال: "; color:#60a5fa; font-weight:950; } .supportChat__suggestBtn:hover{ border-color:rgba(96,165,250,.38); background:linear-gradient(135deg, rgba(37,99,235,.17), rgba(14,165,233,.10)); } .supportChat__suggest.is-slide .supportChat__suggestBtn{ animation:supportSuggestSlide .42s cubic-bezier(.2,.9,.2,1) both; } @keyframes supportSuggestSlide{ 0%{opacity:0; transform:translateX(22px) scale(.98);} 50%{opacity:1; transform:translateX(-3px) scale(1);} 100%{opacity:1; transform:translateX(0) scale(1);} } html[data-theme="light"] .supportChat__suggestBtn, body.theme-light .supportChat__suggestBtn{ color:#1e293b; background:linear-gradient(135deg, rgba(37,99,235,.07), rgba(14,165,233,.04)); } .supportChat__form{ grid-template-columns:minmax(0,1fr) 76px !important; align-items:start !important; column-gap:8px !important; row-gap:2px !important; } .supportChat__form textarea{ min-height:40px !important; max-height:88px !important; padding:7px 10px !important; font-size:12px !important; line-height:1.55 !important; border-radius:13px !important; } .supportChat__form button{ min-height:40px !important; height:40px !important; padding-inline:8px !important; border-radius:13px !important; font-size:12px !important; line-height:1.2 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; } .supportChat[data-mode="ai"] .supportChat__form::after{ content:"هوش مصنوعی می‌تواند اشتباه کند؛ صحت اطلاعات مهم را بررسی کنید."; grid-column:1 / -1; grid-row:2; color:var(--muted); opacity:.72; font-size:9.2px; font-weight:700; line-height:1.45; text-align:right; padding:1px 4px 0; pointer-events:none; } .supportChat[data-mode="human"] .supportChat__form::after{content:none;} .supportChat.is-pinned[data-collapsed="1"]{ width:58px !important; height:58px !important; min-width:58px !important; border:0 !important; background:transparent !important; box-shadow:none !important; } .supportChat.is-pinned[data-collapsed="1"]::before{ inset:-3px !important; border-radius:999px !important; padding:0 !important; background:conic-gradient(from var(--support-chat-angle, 0deg), rgba(14,165,233,.12), rgba(37,99,235,.95), rgba(125,211,252,.76), rgba(59,130,246,.28), rgba(14,165,233,.12)) !important; filter:drop-shadow(0 14px 28px rgba(37,99,235,.25)); } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head{ position:relative; overflow:hidden; background:radial-gradient(circle at 28% 20%, rgba(255,255,255,.33), rgba(255,255,255,0) 31%), linear-gradient(135deg, #1d4ed8 0%, #0284c7 58%, #0f172a 100%) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.22), 0 17px 34px rgba(14,165,233,.24) !important; transition:transform .18s ease, box-shadow .18s ease, filter .18s ease; } .supportChat.is-pinned[data-collapsed="1"]:hover .supportChat__head{ transform:translateY(-2px) scale(1.035); box-shadow:inset 0 1px 0 rgba(255,255,255,.26), 0 22px 42px rgba(14,165,233,.30) !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head::before{ width:29px !important; height:29px !important; background:linear-gradient(180deg, #fff 0%, #dbeafe 100%) !important; filter:drop-shadow(0 3px 8px rgba(0,0,0,.18)); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3a8 8 0 0 0-8 8v3a4 4 0 0 0 4 4h1.4a1.4 1.4 0 0 0 1.4-1.4v-4.2A1.4 1.4 0 0 0 9.4 11H6.2a5.8 5.8 0 0 1 11.6 0h-3.2a1.4 1.4 0 0 0-1.4 1.4v4.2a1.4 1.4 0 0 0 1.4 1.4H16a4 4 0 0 0 4-4v-3a8 8 0 0 0-8-8Zm-4 10h1v3H8a2 2 0 0 1-2-2v-1h2Zm8 3h-1v-3h3v1a2 2 0 0 1-2 2Z'/%3E%3C/svg%3E") center/contain no-repeat !important; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3a8 8 0 0 0-8 8v3a4 4 0 0 0 4 4h1.4a1.4 1.4 0 0 0 1.4-1.4v-4.2A1.4 1.4 0 0 0 9.4 11H6.2a5.8 5.8 0 0 1 11.6 0h-3.2a1.4 1.4 0 0 0-1.4 1.4v4.2a1.4 1.4 0 0 0 1.4 1.4H16a4 4 0 0 0 4-4v-3a8 8 0 0 0-8-8Zm-4 10h1v3H8a2 2 0 0 1-2-2v-1h2Zm8 3h-1v-3h3v1a2 2 0 0 1-2 2Z'/%3E%3C/svg%3E") center/contain no-repeat !important; } .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head::before{ width:30px !important; height:30px !important; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M11 2h2v3h-2V2Zm-5 7a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v1h1.2A2.8 2.8 0 0 1 22 12.8v3.4a2.8 2.8 0 0 1-2.8 2.8H4.8A2.8 2.8 0 0 1 2 16.2v-3.4A2.8 2.8 0 0 1 4.8 10H6V9Zm2 1v1.8a1.2 1.2 0 0 1-1.2 1.2H4.8a.8.8 0 0 0-.8.8v3.4a.8.8 0 0 0 .8.8h14.4a.8.8 0 0 0 .8-.8v-3.4a.8.8 0 0 0-.8-.8h-2A1.2 1.2 0 0 1 16 11.8V10a3 3 0 0 0-3-3h-2a3 3 0 0 0-3 3Zm1.5 4.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0Zm6 0a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0ZM8 21h8v2H8v-2Z'/%3E%3C/svg%3E") center/contain no-repeat !important; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M11 2h2v3h-2V2Zm-5 7a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v1h1.2A2.8 2.8 0 0 1 22 12.8v3.4a2.8 2.8 0 0 1-2.8 2.8H4.8A2.8 2.8 0 0 1 2 16.2v-3.4A2.8 2.8 0 0 1 4.8 10H6V9Zm2 1v1.8a1.2 1.2 0 0 1-1.2 1.2H4.8a.8.8 0 0 0-.8.8v3.4a.8.8 0 0 0 .8.8h14.4a.8.8 0 0 0 .8-.8v-3.4a.8.8 0 0 0-.8-.8h-2A1.2 1.2 0 0 1 16 11.8V10a3 3 0 0 0-3-3h-2a3 3 0 0 0-3 3Zm1.5 4.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0Zm6 0a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0ZM8 21h8v2H8v-2Z'/%3E%3C/svg%3E") center/contain no-repeat !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head::after{ content:""; position:absolute; right:9px; bottom:9px; width:10px; height:10px; border-radius:999px; background:#22c55e; box-shadow:0 0 0 3px rgba(15,23,42,.75), 0 0 0 6px rgba(34,197,94,.16); } .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head::after{ right:8px; bottom:8px; background:#a78bfa; box-shadow:0 0 0 3px rgba(15,23,42,.75), 0 0 0 6px rgba(167,139,250,.18); } @media (max-width:760px){ .supportChat__form{grid-template-columns:minmax(0,1fr) 74px !important;} .supportChat[data-mode="ai"] .supportChat__form::after{font-size:9px;text-align:right;} } /* ---------------- v322: OTP bodyId 461160 + pinned AI robot avatar ---------------- */ .supportChat__pinnedAvatar{ display:none; position:relative; width:44px; height:44px; flex:0 0 auto; pointer-events:none; user-select:none; } .supportChat__pinnedAvatarImg{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; object-position:center; pointer-events:none; user-select:none; } .supportChat__pinnedAvatarImg--base{ opacity:1; animation:supportPinnedRobotFloat 2.8s ease-in-out infinite; } .supportChat__pinnedAvatarImg--wink{ opacity:0; animation:supportPinnedRobotBlink 6.4s ease-in-out infinite; } @keyframes supportPinnedRobotFloat{ 0%,100%{transform:translateY(0) scale(1);} 50%{transform:translateY(-1.5px) scale(1.035);} } @keyframes supportPinnedRobotBlink{ 0%, 8%, 43%, 100%{opacity:0;} 10%, 14%{opacity:1;} 45%, 48%{opacity:1;} } .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head{ background:radial-gradient(circle at 30% 18%, rgba(255,255,255,.30), rgba(255,255,255,0) 35%), linear-gradient(145deg, #1d4ed8 0%, #0ea5e9 52%, #0f172a 100%) !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head > .supportChat__pinnedAvatar{ display:none !important; } .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head > .supportChat__pinnedAvatar{ display:block !important; z-index:2; width:46px; height:46px; filter:drop-shadow(0 8px 14px rgba(2,6,23,.22)); } .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head::before{ content:none !important; display:none !important; } .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head::after{ right:7px; bottom:7px; width:9px; height:9px; background:#38bdf8; box-shadow:0 0 0 3px rgba(15,23,42,.72), 0 0 0 6px rgba(56,189,248,.18); } /* ---------------- v323: single pinned AI icon, no border ring, centered AI disclaimer ---------------- */ .supportChat[data-mode="ai"] .supportChat__form::after{ grid-column:1 / -1; grid-row:2; display:block; width:100%; text-align:center !important; justify-self:center; align-self:center; margin:2px auto 0; padding:2px 6px 0; } .supportChat__pinnedAvatarImg--wink{display:none !important;} .supportChat__pinnedAvatarImg--base{ opacity:1 !important; animation:supportPinnedRobotFloat 2.8s ease-in-out infinite; } .supportChat.is-pinned[data-collapsed="1"]{ width:58px !important; height:58px !important; min-width:58px !important; border:0 !important; background:transparent !important; box-shadow:none !important; } .supportChat.is-pinned[data-collapsed="1"]::before, .supportChat.is-pinned[data-collapsed="1"]::after{ content:none !important; display:none !important; background:none !important; box-shadow:none !important; filter:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head{ width:100%; height:100%; min-height:0; padding:0 !important; display:grid; place-items:center; border:0 !important; border-radius:999px !important; background:transparent !important; box-shadow:none !important; overflow:visible !important; } .supportChat.is-pinned[data-collapsed="1"]:hover .supportChat__head{ transform:none !important; box-shadow:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head > *{ display:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head > .supportChat__pinnedAvatar{ display:block !important; width:56px; height:56px; filter:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head::before, .supportChat.is-pinned[data-collapsed="1"] .supportChat__head::after{ content:none !important; display:none !important; } /* ---------------- v324: larger pinned icon, no background, centered note ---------------- */ .supportChat[data-mode="ai"] .supportChat__form::after{ width:100%; text-align:center !important; margin:4px auto 0 !important; } .supportChat.is-pinned[data-collapsed="1"]{ width:68px !important; height:68px !important; min-width:68px !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head{ background:transparent !important; box-shadow:none !important; border:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatar{ width:66px !important; height:66px !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatarImg{ object-fit:contain !important; background:transparent !important; box-shadow:none !important; filter:none !important; } /* ---------------- v325: contextual AI follow-up + clean transparent pinned robot icon ---------------- */ .supportChat.is-pinned[data-collapsed="1"]{ width:74px !important; height:74px !important; min-width:74px !important; overflow:visible !important; background:transparent !important; border:none !important; box-shadow:none !important; } .supportChat.is-pinned[data-collapsed="1"]::before, .supportChat.is-pinned[data-collapsed="1"]::after, .supportChat.is-pinned[data-collapsed="1"] .supportChat__head::before, .supportChat.is-pinned[data-collapsed="1"] .supportChat__head::after{ content:none !important; display:none !important; background:none !important; border:none !important; box-shadow:none !important; filter:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head{ width:74px !important; height:74px !important; min-height:74px !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; background:transparent !important; border:none !important; border-radius:0 !important; box-shadow:none !important; backdrop-filter:none !important; overflow:visible !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head > :not(.supportChat__pinnedAvatar){ display:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatar{ display:block !important; position:relative !important; width:74px !important; height:74px !important; background:transparent !important; border:none !important; border-radius:0 !important; box-shadow:none !important; filter:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatarImg, .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatarImg--base{ width:100% !important; height:100% !important; object-fit:contain !important; object-position:center !important; background:transparent !important; border:none !important; border-radius:0 !important; box-shadow:none !important; filter:none !important; mix-blend-mode:normal !important; } .supportChat[data-mode="ai"] .supportChat__form::after{ text-align:center !important; justify-self:center !important; align-self:center !important; } /* ---------------- v326: same transparent robot for pinned support + AI ---------------- */ .supportChat.is-pinned[data-collapsed="1"][data-mode="human"] .supportChat__pinnedAvatar, .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__pinnedAvatar{ display:block !important; background:transparent !important; border:none !important; box-shadow:none !important; filter:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatarImg{ content:url('/brand/support-ai-robot-base.png'); background:transparent !important; border:none !important; box-shadow:none !important; filter:none !important; } /* ---------------- v327: same smaller transparent robot in pinned support + AI ---------------- */ .supportChat.is-pinned[data-collapsed="1"]{ width:64px !important; height:64px !important; min-width:64px !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__head{ width:64px !important; height:64px !important; min-height:64px !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatar, .supportChat.is-pinned[data-collapsed="1"][data-mode="human"] .supportChat__pinnedAvatar, .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__pinnedAvatar{ display:block !important; width:60px !important; height:60px !important; background:transparent !important; border:none !important; box-shadow:none !important; filter:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatarImg, .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatarImg--base, .supportChat.is-pinned[data-collapsed="1"][data-mode="human"] .supportChat__pinnedAvatarImg, .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__pinnedAvatarImg{ content:url('/brand/support-ai-robot-base.png') !important; width:100% !important; height:100% !important; object-fit:contain !important; object-position:center !important; background:transparent !important; border:none !important; box-shadow:none !important; filter:none !important; } /* ---------------- v328: remove AI-only pinned background square completely ---------------- */ .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"], .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head, .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__pinnedAvatar{ background:transparent !important; background-color:transparent !important; background-image:none !important; border:none !important; box-shadow:none !important; filter:none !important; backdrop-filter:none !important; overflow:visible !important; } .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"]::before, .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"]::after, .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head::before, .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head::after{ content:none !important; display:none !important; background:transparent !important; background-color:transparent !important; background-image:none !important; border:none !important; box-shadow:none !important; filter:none !important; } .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__pinnedAvatarImg{ content:url('/brand/support-ai-robot-base.png') !important; background:transparent !important; background-color:transparent !important; background-image:none !important; border:none !important; box-shadow:none !important; filter:none !important; } /* ---------------- v329: OTP delay notice after one minute ---------------- */ .loginGate__otpDelayNotice{ display:inline-block; margin-inline-start:6px; font-size:11.5px; font-weight:800; color:#d97706; white-space:normal; } .loginGate__otpTimer--step .loginGate__otpDelayNotice{ vertical-align:baseline; } /* ---------------- v334: cleaner invoice totals panel + concise correction success ---------------- */ .page--send .invBottomCol--totals .totals--side{ margin-top:12px; display:grid; gap:8px; } .page--send .invBottomCol--totals .totals--side .totals__row{ display:grid; grid-template-columns:minmax(0, 1fr) max-content; align-items:center; gap:18px; min-height:44px; padding:10px 12px !important; border:1px solid rgba(148,163,184,.14); border-radius:14px !important; background:linear-gradient(180deg, rgba(255,255,255,.030), rgba(255,255,255,.014)); } .page--send .invBottomCol--totals .totals--side .totals__row span{ min-width:0; color:var(--muted); font-size:13px; font-weight:750; white-space:nowrap; } .page--send .invBottomCol--totals .totals--side .totals__row b{ direction:ltr; unicode-bidi:isolate; text-align:left; color:var(--text); font-size:15px; font-weight:900; font-variant-numeric:tabular-nums; letter-spacing:.1px; white-space:nowrap; } .page--send .invBottomCol--totals .totals--side .totals__pay{ min-height:50px; border-color:rgba(var(--accent-rgb), .28) !important; background:linear-gradient(180deg, rgba(var(--accent-rgb), .15), rgba(var(--accent-rgb), .075)) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.055); } .page--send .invBottomCol--totals .totals--side .totals__pay span{ color:rgba(226,232,240,.92); font-size:13.5px; } .page--send .invBottomCol--totals .totals--side .totals__pay b{ color:#fff; font-size:17px; } html[data-theme="light"] .page--send .invBottomCol--totals .totals--side .totals__row, body.theme-light .page--send .invBottomCol--totals .totals--side .totals__row{ border-color:rgba(15,23,42,.08); background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.88)); box-shadow:0 8px 18px rgba(2,6,23,.035); } html[data-theme="light"] .page--send .invBottomCol--totals .totals--side .totals__pay, body.theme-light .page--send .invBottomCol--totals .totals--side .totals__pay{ border-color:rgba(var(--accent-rgb), .20) !important; background:linear-gradient(180deg, rgba(var(--accent-rgb), .11), rgba(var(--accent-rgb), .055)) !important; } html[data-theme="light"] .page--send .invBottomCol--totals .totals--side .totals__pay span, body.theme-light .page--send .invBottomCol--totals .totals--side .totals__pay span{ color:rgba(15,23,42,.72); } html[data-theme="light"] .page--send .invBottomCol--totals .totals--side .totals__pay b, body.theme-light .page--send .invBottomCol--totals .totals--side .totals__pay b{ color:var(--text); } .page--send #sendOk{ max-width:max-content; padding:7px 11px; border-radius:11px; font-weight:800; } @media (max-width:560px){ .page--send .invBottomCol--totals .totals--side .totals__row{ grid-template-columns:1fr; gap:4px; align-items:start; } .page--send .invBottomCol--totals .totals--side .totals__row b{ justify-self:start; font-size:14px; } .page--send .invBottomCol--totals .totals--side .totals__pay b{ font-size:16px; } } /* ---------------- v335: AI history, unified pinned chat icon, and better pickers ---------------- */ .supportChat.is-pinned[data-collapsed="1"], .supportChat.is-pinned[data-collapsed="1"][data-mode="human"], .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"], .supportChat.is-pinned[data-collapsed="1"] .supportChat__head, .supportChat.is-pinned[data-collapsed="1"][data-mode="human"] .supportChat__head, .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__head{ background:transparent !important; background-color:transparent !important; background-image:none !important; border:none !important; box-shadow:none !important; filter:none !important; backdrop-filter:none !important; overflow:visible !important; } .supportChat.is-pinned[data-collapsed="1"]::before, .supportChat.is-pinned[data-collapsed="1"]::after, .supportChat.is-pinned[data-collapsed="1"] .supportChat__head::before, .supportChat.is-pinned[data-collapsed="1"] .supportChat__head::after{ content:none !important; display:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatar, .supportChat.is-pinned[data-collapsed="1"][data-mode="human"] .supportChat__pinnedAvatar, .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__pinnedAvatar{ display:block !important; background:transparent !important; background-color:transparent !important; border:none !important; box-shadow:none !important; filter:none !important; } .supportChat.is-pinned[data-collapsed="1"] .supportChat__pinnedAvatarImg, .supportChat.is-pinned[data-collapsed="1"][data-mode="human"] .supportChat__pinnedAvatarImg, .supportChat.is-pinned[data-collapsed="1"][data-mode="ai"] .supportChat__pinnedAvatarImg{ content:url('/brand/support-ai-robot-base.png') !important; width:100% !important; height:100% !important; object-fit:contain !important; background:transparent !important; background-color:transparent !important; border:none !important; box-shadow:none !important; filter:none !important; } #modal[data-picker-kind="buyer"] .modal__panel, #modal[data-picker-kind="item"] .modal__panel{ width:min(980px, calc(100vw - 24px)); } #modal[data-picker-kind="buyer"] .modal__header, #modal[data-picker-kind="item"] .modal__header{ position:sticky; top:0; z-index:3; background:rgba(15,25,48,.96); backdrop-filter:blur(16px); } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modal__header, html[data-theme="light"] #modal[data-picker-kind="item"] .modal__header, body.theme-light #modal[data-picker-kind="buyer"] .modal__header, body.theme-light #modal[data-picker-kind="item"] .modal__header{ background:rgba(255,255,255,.96); } #modal[data-picker-kind="buyer"] #modalTitle, #modal[data-picker-kind="item"] #modalTitle{ font-size:16px; font-weight:900; } #modal[data-picker-kind="buyer"] .modal__body > .row:first-child, #modal[data-picker-kind="item"] .modal__body > .row:first-child{ padding:10px; border:1px solid rgba(148,163,184,.16); border-radius:16px; background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)); } #modal[data-picker-kind="buyer"] #modalSearch, #modal[data-picker-kind="item"] #modalSearch{ min-height:42px; border-radius:13px; font-weight:750; } .modalPickerList{ display:grid; gap:10px; max-height:min(58vh, 520px); overflow:auto; padding:2px; } .modalPickCard{ display:grid; grid-template-columns:minmax(0, 1fr) auto; align-items:center; gap:14px; padding:12px 14px; border:1px solid rgba(148,163,184,.16); border-radius:16px; background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)); cursor:pointer; transition:transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease; } .modalPickCard:hover, .modalPickCard:focus-visible{ transform:translateY(-1px); border-color:rgba(59,130,246,.42); background:linear-gradient(180deg, rgba(59,130,246,.12), rgba(255,255,255,.025)); box-shadow:0 12px 30px rgba(2,6,23,.18); outline:none; } .modalPickCard__main{min-width:0;display:grid;gap:6px;} .modalPickCard__title{display:flex;align-items:center;gap:8px;min-width:0;} .modalPickCard__title b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .modalPickCard__title span{ flex:0 0 auto; padding:3px 8px; border-radius:999px; font-size:11px; font-weight:900; color:#93c5fd; background:rgba(59,130,246,.12); border:1px solid rgba(59,130,246,.22); } .modalPickCard__sub{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .modalPickCard__meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end;} .modalPickCard__meta span{ display:grid; gap:2px; min-width:86px; padding:6px 8px; border-radius:12px; border:1px solid rgba(148,163,184,.14); background:rgba(15,23,42,.16); } .modalPickCard__meta em{font-style:normal;color:var(--muted);font-size:10.5px;font-weight:800;} .modalPickCard__meta b{font-size:12px;font-weight:900;white-space:nowrap;} .modalPickEmpty{ padding:18px; border-radius:16px; color:var(--muted); text-align:center; border:1px dashed rgba(148,163,184,.28); } @media (max-width:720px){ .modalPickCard{grid-template-columns:1fr;align-items:start;} .modalPickCard__meta{justify-content:stretch;} .modalPickCard__meta span{flex:1 1 30%;min-width:0;} .modalPickerList{max-height:min(62vh, 560px);} } /* ---------------- v336: compact searchable pickers + fixed pager ---------------- */ #modal[data-picker-kind="buyer"] .modal__panel, #modal[data-picker-kind="item"] .modal__panel{ display:flex; flex-direction:column; overflow:hidden; max-height:calc(100vh - 28px); } #modal[data-picker-kind="buyer"] .modal__body, #modal[data-picker-kind="item"] .modal__body{ display:flex; flex-direction:column; min-height:0; gap:10px; overflow:hidden; } #modal[data-picker-kind="buyer"] #modalTable, #modal[data-picker-kind="item"] #modalTable{ display:flex; flex-direction:column; min-height:0; flex:1 1 auto; overflow:hidden; } #modal[data-picker-kind="buyer"] .modalPickerList, #modal[data-picker-kind="item"] .modalPickerList{ flex:1 1 auto; min-height:0; max-height:none; overflow:auto; gap:6px; padding:1px 2px 8px; } #modal[data-picker-kind="buyer"] .modalPickerPager, #modal[data-picker-kind="item"] .modalPickerPager{ flex:0 0 auto; position:sticky; bottom:0; z-index:4; background:rgba(15,25,48,.96); border-top:1px solid rgba(148,163,184,.16); padding:8px 0 0; margin-top:4px; backdrop-filter:blur(10px); } body[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPickerPager, body[data-theme="light"] #modal[data-picker-kind="item"] .modalPickerPager{ background:rgba(248,250,252,.96); } #modal[data-picker-kind="buyer"] .modalPickCard, #modal[data-picker-kind="item"] .modalPickCard{ grid-template-columns:minmax(0,1fr) auto auto; gap:8px; padding:8px 10px; border-radius:12px; } #modal[data-picker-kind="buyer"] .modalPickCard__main, #modal[data-picker-kind="item"] .modalPickCard__main{gap:3px;} #modal[data-picker-kind="buyer"] .modalPickCard__title, #modal[data-picker-kind="item"] .modalPickCard__title{gap:6px;} #modal[data-picker-kind="buyer"] .modalPickCard__title b, #modal[data-picker-kind="item"] .modalPickCard__title b{font-size:13px;} #modal[data-picker-kind="buyer"] .modalPickCard__title span, #modal[data-picker-kind="item"] .modalPickCard__title span{font-size:10px;padding:2px 6px;border-radius:999px;} #modal[data-picker-kind="buyer"] .modalPickCard__sub, #modal[data-picker-kind="item"] .modalPickCard__sub{font-size:11px;} #modal[data-picker-kind="buyer"] .modalPickCard__meta, #modal[data-picker-kind="item"] .modalPickCard__meta{gap:5px;} #modal[data-picker-kind="buyer"] .modalPickCard__meta span, #modal[data-picker-kind="item"] .modalPickCard__meta span{ min-width:64px; padding:4px 6px; border-radius:10px; } #modal[data-picker-kind="buyer"] .modalPickCard__meta em, #modal[data-picker-kind="item"] .modalPickCard__meta em{font-size:9.5px;} #modal[data-picker-kind="buyer"] .modalPickCard__meta b, #modal[data-picker-kind="item"] .modalPickCard__meta b{font-size:11px;} .modalPickCard__edit{ width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center; align-self:center; border-radius:10px; border:1px solid rgba(148,163,184,.22); background:rgba(59,130,246,.10); color:var(--text); cursor:pointer; transition:.18s ease; } .modalPickCard__edit:hover, .modalPickCard__edit:focus-visible{ background:rgba(59,130,246,.18); transform:translateY(-1px); outline:none; } @media(max-width:720px){ #modal[data-picker-kind="buyer"] .modalPickCard, #modal[data-picker-kind="item"] .modalPickCard{grid-template-columns:1fr auto;align-items:start;} #modal[data-picker-kind="buyer"] .modalPickCard__meta, #modal[data-picker-kind="item"] .modalPickCard__meta{grid-column:1 / -1;justify-content:stretch;} #modal[data-picker-kind="buyer"] .modalPickCard__meta span, #modal[data-picker-kind="item"] .modalPickCard__meta span{flex:1 1 30%;min-width:0;} .modalPickCard__edit{grid-column:2;grid-row:1;width:28px;height:28px;} } /* ---------------- v337: compact lists, clearer edit icons, toolbar + pager polish ---------------- */ .listToolbar{ direction:rtl; display:flex; align-items:flex-end; justify-content:space-between; gap:10px; flex-wrap:nowrap; margin-bottom:8px; } .listToolbar__fields{ display:flex; align-items:flex-end; justify-content:flex-start; gap:10px; flex:1 1 auto; min-width:0; } .listToolbar__fields .form{display:block;min-width:0;} .listToolbar__search{flex:0 1 230px;max-width:250px;} .listToolbar__sort{flex:0 0 178px;} .listToolbar__btn{flex:0 0 auto;min-width:86px;} #customersTable .table, #itemsTable .table{font-size:12px;} #customersTable .table th, #customersTable .table td, #itemsTable .table th, #itemsTable .table td{padding:7px 8px;} #customersTable .table--customers .custCol--name{min-width:170px;} #customersTable .table--customers .custCol--ops{min-width:96px;} #customersTable .bulkActions, #itemsTable .bulkActions{margin:7px 0 4px !important;gap:6px !important;} #customersTable .bulkActions .btn, #itemsTable .bulkActions .btn{min-height:30px;padding:5px 9px;font-size:12px;} #customersTable .opActions--mini .btn--iconOnly, #itemsTable .opActions--mini .btn--iconOnly, .table .opActions--mini .btn--iconOnly{ width:30px !important; height:30px !important; min-width:30px !important; border-radius:9px !important; background:rgba(59,130,246,.12) !important; border-color:rgba(59,130,246,.28) !important; color:#60a5fa !important; } #customersTable .opActions--mini .btn--iconOnly:hover, #itemsTable .opActions--mini .btn--iconOnly:hover, .table .opActions--mini .btn--iconOnly:hover{ background:rgba(59,130,246,.22) !important; border-color:rgba(59,130,246,.42) !important; color:#93c5fd !important; } #customersTable .opActions--mini .btn--danger.btn--iconOnly, #itemsTable .opActions--mini .btn--danger.btn--iconOnly, .table .opActions--mini .btn--danger.btn--iconOnly{ background:rgba(239,68,68,.08) !important; border-color:rgba(239,68,68,.20) !important; color:#ef4444 !important; } #customersTable .opActions--mini .btn--iconOnly .btn__ico svg, #itemsTable .opActions--mini .btn--iconOnly .btn__ico svg, .table .opActions--mini .btn--iconOnly .btn__ico svg{ width:16px !important; height:16px !important; stroke-width:2.35; } .modalPickCard__edit{ background:rgba(59,130,246,.18) !important; border-color:rgba(59,130,246,.36) !important; color:#7dd3fc !important; box-shadow:0 6px 16px rgba(37,99,235,.14); } .modalPickCard__edit .btn__ico svg{width:17px;height:17px;stroke-width:2.35;} .modalPickCard__edit:hover{background:rgba(59,130,246,.28) !important;color:#bfdbfe !important;} #modal[data-picker-kind="buyer"] .modalPickCard, #modal[data-picker-kind="item"] .modalPickCard{ padding:7px 9px; gap:7px; border-radius:11px; } #modal[data-picker-kind="buyer"] .modalPickerList, #modal[data-picker-kind="item"] .modalPickerList{gap:5px;} .modalPickerPager .pager{ margin-top:0; gap:8px; align-items:center; } .modalPickerPager .pager__left{font-size:11.5px;} .modalPickerPager .pager__right{gap:5px;} .modalPickerPager .pager__btn{padding:5px 8px;border-radius:9px;font-size:11.5px;} .modalPickerPager .pager__num--text{ min-width:auto; padding:5px 10px; border-radius:999px; border:1px solid rgba(148,163,184,.20); background:rgba(255,255,255,.045); color:var(--text); font-size:11.5px; font-weight:800; white-space:nowrap; } @media(max-width:720px){ .listToolbar{flex-wrap:wrap;align-items:stretch;} .listToolbar__fields{width:100%;flex-wrap:wrap;} .listToolbar__search{flex:1 1 100%;max-width:none;} .listToolbar__sort{flex:1 1 150px;} .listToolbar__btn{width:100%;} .modalPickerPager .pager{justify-content:center;} .modalPickerPager .pager__left{width:100%;text-align:center;} } /* ---------------- v338: item toolbar width + manual-ready queue polish ---------------- */ .listToolbar--items .listToolbar__sort{ flex-basis:224px !important; min-width:224px !important; } .listToolbar--items .listToolbar__search{ flex-basis:260px !important; } @media(max-width:720px){ .listToolbar--items .listToolbar__sort, .listToolbar--items .listToolbar__search{ flex-basis:100% !important; min-width:0 !important; } } /* v340 invoice list page total */ .invPageTotalBadge{ display:inline-flex; align-items:center; min-height:0; padding:0; border-radius:0; background:transparent; border:0; color:var(--text); font-weight:800; white-space:nowrap; } /* v341 invoice list total: shorter label and below table */ .invPageTotalRow{ display:flex; justify-content:flex-end; align-items:center; margin:10px 0 4px; } .invPageTotalRow .invPageTotalBadge{ padding-inline:0; } /* ---------------- v342: mobile-safe customers page + production polish ---------------- */ .page[data-page="customers"], .page[data-page="customers"] .grid2--customers, .page[data-page="customers"] .card, .page[data-page="customers"] .card--customersList, .page[data-page="customers"] #customersTable, .page[data-page="customers"] .tablewrap{ min-width:0; max-width:100%; } .page[data-page="customers"] input, .page[data-page="customers"] select, .page[data-page="customers"] textarea, .page[data-page="customers"] .selectx, .page[data-page="customers"] .selectx-btn{ max-width:100%; } @media (max-width:720px){ .page[data-page="customers"]{ width:100%; overflow-x:hidden; } .page[data-page="customers"] h1{ font-size:18px; line-height:1.6; margin-bottom:10px; } .page[data-page="customers"] .grid2--customers{ display:grid; grid-template-columns:minmax(0,1fr) !important; gap:10px; width:100%; } .page[data-page="customers"] .card{ padding:12px; border-radius:15px; width:100%; } .page[data-page="customers"] .customerForm{ grid-template-columns:repeat(12,minmax(0,1fr)); gap:10px; } .page[data-page="customers"] .customerForm > label, .page[data-page="customers"] .customerForm > .row, .page[data-page="customers"] .customerForm > .formsep, .page[data-page="customers"] .customerForm > .formmsg{ min-width:0; } .page[data-page="customers"] .customerForm > label.sm-7{grid-column:span 7 !important;} .page[data-page="customers"] .customerForm > label.sm-6{grid-column:span 6 !important;} .page[data-page="customers"] .customerForm > label.sm-5{grid-column:span 5 !important;} .page[data-page="customers"] .customerForm > label.sm-12, .page[data-page="customers"] .customerForm > label.col-12{grid-column:span 12 !important;} .page[data-page="customers"] .customerForm .row.col-12{ display:grid; grid-template-columns:1fr 1fr; gap:8px; } .page[data-page="customers"] .customerForm .row.col-12 .btn{ width:100%; min-width:0; } .page[data-page="customers"] .listToolbar{ display:grid; grid-template-columns:1fr; gap:8px; width:100%; } .page[data-page="customers"] .listToolbar__fields{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; width:100%; } .page[data-page="customers"] .listToolbar__search, .page[data-page="customers"] .listToolbar__sort, .page[data-page="customers"] .listToolbar__btn{ width:100% !important; max-width:none !important; min-width:0 !important; flex:initial !important; } .page[data-page="customers"] .listToolbar__search{grid-column:span 2;} .page[data-page="customers"] .listToolbar__btn{min-height:40px;} /* Mobile card view for customer list: table no longer stretches the whole page */ #customersTable .tablewrap{ overflow:visible !important; border:0; } #customersTable .table--customers, #customersTable .table--customers tbody, #customersTable .table--customers tr, #customersTable .table--customers td{ display:block; width:100%; max-width:100%; } #customersTable .table--customers thead{display:none;} #customersTable .table--customers tbody{ display:grid; gap:8px; } #customersTable .table--customers tr{ border:1px solid var(--border); border-radius:14px; padding:8px; background:rgba(148,163,184,.045); overflow:hidden; } html[data-theme="light"] #customersTable .table--customers tr, body.theme-light #customersTable .table--customers tr{ background:rgba(15,23,42,.025); } #customersTable .table--customers td{ border-bottom:0; padding:5px 2px; white-space:normal !important; word-break:break-word; overflow-wrap:anywhere; min-width:0 !important; } #customersTable .table--customers td.c{ display:flex; justify-content:flex-end; padding-bottom:2px; } #customersTable .table--customers td:not(.c):not(.custCol--ops){ display:grid; grid-template-columns:82px minmax(0,1fr); gap:8px; align-items:start; } #customersTable .table--customers td:not(.c):not(.custCol--ops)::before{ color:var(--muted); font-size:11.5px; font-weight:800; white-space:nowrap; } #customersTable .table--customers td.custCol--code::before{content:"کد";} #customersTable .table--customers td.custCol--name::before{content:"نام";} #customersTable .table--customers td.custCol--nid::before{content:"شناسه";} #customersTable .table--customers td.custCol--phone::before{content:"تلفن";} #customersTable .table--customers .custCol--nid, #customersTable .table--customers .custCol--phone{ direction:rtl; text-align:right; unicode-bidi:plaintext; } #customersTable .table--customers .custCol--nid > *, #customersTable .table--customers .custCol--phone > *{ direction:ltr; } #customersTable .table--customers .custCol--ops{ padding-top:7px; text-align:initial; } #customersTable .table--customers .custCol--ops .opActions{ justify-content:flex-end; gap:7px; } #customersTable .bulkActions{ justify-content:stretch !important; } #customersTable .bulkActions .btn{ flex:1 1 100%; width:100%; } #customersTable .pager{ justify-content:center; } } @media (max-width:380px){ .page[data-page="customers"] .card{padding:10px;} .page[data-page="customers"] .listToolbar__fields{grid-template-columns:1fr;} .page[data-page="customers"] .listToolbar__search{grid-column:auto;} .page[data-page="customers"] .customerForm > label.sm-7, .page[data-page="customers"] .customerForm > label.sm-6, .page[data-page="customers"] .customerForm > label.sm-5{ grid-column:span 12 !important; } .page[data-page="customers"] .customerForm .row.col-12{ grid-template-columns:1fr; } #customersTable .table--customers td:not(.c):not(.custCol--ops){ grid-template-columns:70px minmax(0,1fr); } } /* ---------------- v343: customer mobile list like items + compact party overview ---------------- */ .partyOverviewCompact{display:grid;gap:10px;min-width:0;} .partyOverviewHead{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px !important;} .partyOverviewHead__main{min-width:0;} .partyOverviewHead h2{margin:0 0 8px;font-size:18px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .partyOverviewChips{display:flex;flex-wrap:wrap;gap:6px;} .partyOverviewChips span{font-size:11.5px;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:4px 8px;background:rgba(148,163,184,.06);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .partyMiniStats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;} .partyMiniStat{border:1px solid var(--border);border-radius:14px;padding:10px;background:rgba(148,163,184,.045);min-width:0;} .partyMiniStat span{display:block;color:var(--muted);font-size:11.5px;font-weight:800;margin-bottom:5px;} .partyMiniStat b{display:block;font-size:15px;line-height:1.55;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .partyRecentCard{padding:12px !important;} .partyRecentHead{margin-bottom:8px;} .partyRecentHead h2{margin:0;font-size:16px;} .partyRecentTable{margin-top:0 !important;} #partyModal .modal__panel{max-width:900px;} #partyModal .modal__body{padding:12px;} @media(max-width:720px){ /* undo v342 customer card conversion; keep a compact table inside its own horizontal scroller like items */ #customersTable .tablewrap{ overflow-x:auto !important; overflow-y:hidden !important; -webkit-overflow-scrolling:touch; border:1px solid var(--border); border-radius:14px; max-width:100% !important; } #customersTable .table--customers{ display:table !important; width:100% !important; min-width:540px !important; max-width:none !important; table-layout:auto !important; font-size:12px; } #customersTable .table--customers thead{display:table-header-group !important;} #customersTable .table--customers tbody{display:table-row-group !important;} #customersTable .table--customers tr{ display:table-row !important; width:auto !important; max-width:none !important; border:0 !important; border-radius:0 !important; padding:0 !important; background:transparent !important; overflow:visible !important; } #customersTable .table--customers th, #customersTable .table--customers td{ display:table-cell !important; width:auto !important; max-width:none !important; min-width:auto !important; border-bottom:1px solid var(--border) !important; padding:7px 8px !important; white-space:nowrap !important; word-break:normal !important; overflow-wrap:normal !important; vertical-align:middle !important; } #customersTable .table--customers td.c{ display:table-cell !important; justify-content:initial !important; text-align:center !important; } #customersTable .table--customers td:not(.c):not(.custCol--ops){ display:table-cell !important; grid-template-columns:none !important; gap:0 !important; } #customersTable .table--customers td:not(.c):not(.custCol--ops)::before{content:none !important;display:none !important;} #customersTable .table--customers .custCol--name{min-width:150px !important;white-space:normal !important;} #customersTable .table--customers .custCol--nid{max-width:150px;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:right;} #customersTable .table--customers .custCol--phone{max-width:110px;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:right;} #customersTable .table--customers .custCol--ops{min-width:96px !important;text-align:center !important;} #customersTable .table--customers .custCol--ops .opActions{justify-content:center !important;gap:5px !important;} #customersTable .bulkActions{justify-content:flex-end !important;gap:6px !important;} #customersTable .bulkActions .btn{flex:0 0 auto !important;width:auto !important;min-height:30px;padding:5px 9px;font-size:12px;} #customersTable .pager{justify-content:center;} #partyModal .modal__panel{width:min(96vw,900px);max-height:92vh;} #partyModal .modal__header{padding:10px 12px;gap:8px;} #partyModal #partyModalTitle{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} #partyModal .modal__body{padding:10px;} .partyOverviewHead{align-items:flex-start;padding:10px !important;} .partyOverviewHead h2{font-size:16px;} .partyOverviewChips{gap:5px;} .partyOverviewChips span{font-size:11px;padding:3px 7px;} .partyMiniStats{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;} .partyMiniStat{padding:8px;border-radius:12px;} .partyRecentCard{padding:10px !important;} .partyRecentTable{overflow-x:auto;} .partyRecentTable .table{min-width:430px;font-size:12px;} } @media(max-width:420px){ #customersTable .table--customers{min-width:500px !important;} #customersTable .bulkActions{justify-content:stretch !important;} #customersTable .bulkActions .btn{flex:1 1 100% !important;width:100% !important;} .partyOverviewHead{display:grid;grid-template-columns:1fr;} .partyOverviewHead .btn{width:100%;} } /* ---------------- v344: keep customer action buttons in one row on mobile ---------------- */ @media(max-width:720px){ #customersTable .table--customers .custCol--ops{ min-width:128px !important; width:128px !important; max-width:128px !important; white-space:nowrap !important; } #customersTable .table--customers .custCol--ops .opActions, #customersTable .table--customers .custCol--ops .opActions--mini{ display:inline-flex !important; flex-direction:row !important; flex-wrap:nowrap !important; align-items:center !important; justify-content:center !important; gap:6px !important; width:max-content !important; max-width:none !important; } #customersTable .table--customers .custCol--ops .btn, #customersTable .table--customers .custCol--ops .btn--iconOnly{ flex:0 0 32px !important; width:32px !important; min-width:32px !important; max-width:32px !important; height:32px !important; min-height:32px !important; padding:0 !important; margin:0 !important; } } /* ---------------- v45: invoice extract placement + compact mobile filters/charts ---------------- */ .page--send .invLinesActions{ display:flex; flex-wrap:wrap; justify-content:flex-end; } .page--send .invLinesActions .btn{ min-width:118px; } @media (max-width:640px){ .page--send .invCard--lines .cardHeadRow{ gap:8px; align-items:center; } .page--send .invLinesActions{ flex:0 0 auto; justify-content:flex-end; gap:6px !important; } .page--send .invLinesActions .btn{ flex:0 0 auto !important; min-width:0; min-height:36px; padding:7px 9px; font-size:11.5px; border-radius:12px; white-space:nowrap; } } @media (max-width:560px){ #dashBar, #repBar{ height:286px !important; min-height:286px; } .chartBox canvas, .dashPanel--chart canvas{ max-width:100%; } } @media (max-width:720px){ section[data-page="invoices"] > h1, section[data-page="jobs"] > h1{ margin-bottom:8px; } section[data-page="invoices"] .card > .inv-toolbar2, section[data-page="jobs"] .card > .inv-toolbar2{ padding:8px !important; border-radius:16px !important; margin-bottom:10px !important; } section[data-page="invoices"] .inv-toolbar2__row, section[data-page="jobs"] .inv-toolbar2__row{ gap:8px !important; } section[data-page="invoices"] .inv-toolbar2__row--top, section[data-page="jobs"] .inv-toolbar2__row--top{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px !important; padding-bottom:8px !important; } section[data-page="invoices"] .inv-toolbar2__row--top .invtf--search, section[data-page="jobs"] .inv-toolbar2__row--top .invtf--search{ grid-column:1 / -1 !important; } section[data-page="invoices"] .inv-toolbar2 .field.invtf, section[data-page="jobs"] .inv-toolbar2 .field.invtf{ min-width:0 !important; width:100% !important; max-width:none !important; } section[data-page="invoices"] .inv-toolbar2 label, section[data-page="jobs"] .inv-toolbar2 label{ gap:4px !important; font-size:10.5px !important; line-height:1.3 !important; white-space:nowrap; } section[data-page="invoices"] .inv-toolbar2 .field.invtf > label > input.input--sm, section[data-page="invoices"] .inv-toolbar2 .field.invtf > label > select.input--sm, section[data-page="jobs"] .inv-toolbar2 .field.invtf > label > input.input--sm, section[data-page="jobs"] .inv-toolbar2 .field.invtf > label > select.input--sm{ height:38px !important; min-height:38px !important; padding:0 10px !important; border-radius:12px !important; font-size:11.5px !important; } section[data-page="invoices"] .inv-toolbar2__row--bottom, section[data-page="jobs"] .inv-toolbar2__row--bottom{ grid-template-columns:1fr !important; gap:8px !important; } section[data-page="invoices"] .inv-dates, section[data-page="jobs"] .inv-dates{ display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px !important; width:100% !important; } section[data-page="invoices"] .inv-toolbar2__row--bottom .invtf--date, section[data-page="jobs"] .inv-toolbar2__row--bottom .invtf--date{ min-width:0 !important; max-width:none !important; width:100% !important; flex:none !important; } section[data-page="invoices"] .inv-actions, section[data-page="jobs"] .inv-actions{ width:100% !important; display:grid !important; grid-template-columns:repeat(auto-fit,minmax(86px,1fr)) !important; gap:6px !important; } section[data-page="invoices"] .inv-actions .btn, section[data-page="jobs"] .inv-actions .btn{ width:100% !important; min-height:36px !important; padding:7px 8px !important; border-radius:12px !important; font-size:11.5px !important; white-space:nowrap; } } @media (max-width:370px){ section[data-page="invoices"] .inv-toolbar2__row--top, section[data-page="jobs"] .inv-toolbar2__row--top{ grid-template-columns:1fr !important; } section[data-page="invoices"] .inv-dates, section[data-page="jobs"] .inv-dates{ grid-template-columns:1fr !important; } } /* ---------------- v46: compact mobile invoice filters + animated extract button + chart label fix ---------------- */ #btnInvoiceExtract{ position:relative; isolation:isolate; overflow:visible; border:1px solid rgba(34,211,238,.35) !important; box-shadow:0 0 0 1px rgba(59,130,246,.14), 0 10px 22px rgba(37,99,235,.16); } #btnInvoiceExtract::before{ content:""; position:absolute; inset:-3px; border-radius:inherit; padding:2px; background:conic-gradient(from 0deg, #22d3ee, #2563eb, #8b5cf6, #ec4899, #22d3ee); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite:exclude; pointer-events:none; z-index:-1; animation:invoiceExtractRingSpin 1.65s linear infinite; } @keyframes invoiceExtractRingSpin{to{transform:rotate(360deg)}} @media(max-width:720px){ section[data-page="invoices"] .card > .inv-toolbar2, section[data-page="jobs"] .card > .inv-toolbar2{ padding:7px !important; border-radius:14px !important; } section[data-page="invoices"] .inv-toolbar2__row--top{ grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:7px !important; align-items:end !important; } section[data-page="invoices"] .inv-toolbar2__row--top .invtf--search{ grid-column:1 / -1 !important; } section[data-page="invoices"] .inv-toolbar2__row--top .invtf--sort, section[data-page="invoices"] .inv-toolbar2__row--top .invtf--subject, section[data-page="invoices"] .inv-toolbar2__row--top .field.invtf:not(.invtf--search){ min-width:0 !important; max-width:none !important; } section[data-page="invoices"] .inv-toolbar2 label, section[data-page="jobs"] .inv-toolbar2 label{ font-size:10px !important; gap:3px !important; } section[data-page="invoices"] .inv-toolbar2 .field.invtf > label > input.input--sm, section[data-page="invoices"] .inv-toolbar2 .field.invtf > label > select.input--sm, section[data-page="jobs"] .inv-toolbar2 .field.invtf > label > input.input--sm, section[data-page="jobs"] .inv-toolbar2 .field.invtf > label > select.input--sm{ height:35px !important; min-height:35px !important; border-radius:11px !important; padding:0 8px !important; font-size:11px !important; } section[data-page="jobs"] .inv-toolbar2__row--top{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:7px !important; } section[data-page="jobs"] .inv-toolbar2__row--top .invtf--search{ grid-column:1 / -1 !important; } section[data-page="invoices"] .inv-toolbar2__row--bottom, section[data-page="jobs"] .inv-toolbar2__row--bottom{ gap:7px !important; } } @media(max-width:410px){ section[data-page="invoices"] .inv-toolbar2__row--top{ grid-template-columns:repeat(3,minmax(0,1fr)) !important; } section[data-page="invoices"] .inv-toolbar2 label{font-size:9.5px !important;} section[data-page="invoices"] .inv-toolbar2 .field.invtf > label > select.input--sm{font-size:10.2px !important;padding-inline:6px !important;} } @media(max-width:340px){ section[data-page="invoices"] .inv-toolbar2__row--top, section[data-page="jobs"] .inv-toolbar2__row--top{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; } section[data-page="invoices"] .inv-toolbar2__row--top .invtf--search, section[data-page="jobs"] .inv-toolbar2__row--top .invtf--search{grid-column:1 / -1 !important;} } /* ---------------- v47: slim project-color extract border + print quantity fit ---------------- */ #btnInvoiceExtract{ position:relative !important; overflow:hidden !important; isolation:isolate; border:1px solid transparent !important; background: linear-gradient(180deg, rgba(15,23,42,.88), rgba(15,23,42,.70)) padding-box, linear-gradient(90deg, rgba(var(--accent-rgb),.78), rgba(56,189,248,.46), rgba(var(--accent-rgb),.78)) border-box !important; background-size:auto, 220% 100% !important; background-position:0 0, 0% 50% !important; box-shadow:0 0 0 1px rgba(var(--accent-rgb),.05), 0 6px 14px rgba(var(--accent-rgb),.08) !important; animation:invoiceExtractBorderFlow 2.9s linear infinite !important; } #btnInvoiceExtract::before, #btnInvoiceExtract::after{ display:none !important; content:none !important; } @keyframes invoiceExtractBorderFlow{ 0%{background-position:0 0, 0% 50%;} 100%{background-position:0 0, 240% 50%;} } html[data-theme="light"] #btnInvoiceExtract, body.theme-light #btnInvoiceExtract{ background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.94)) padding-box, linear-gradient(90deg, rgba(var(--accent-rgb),.72), rgba(14,165,233,.44), rgba(var(--accent-rgb),.72)) border-box !important; background-size:auto, 240% 100% !important; } @media (prefers-reduced-motion: reduce){ #btnInvoiceExtract{animation:none !important;} } /* ---------------- v48: slimmer project-color extract border + larger invoice item numbers in print ---------------- */ #btnInvoiceExtract{ border-width:1px !important; } /* ---------------- v49: thin animated project-color extract border + working file picker ---------------- */ #btnInvoiceExtract{ position:relative !important; isolation:isolate !important; overflow:hidden !important; border:1px solid rgba(var(--accent-rgb),.38) !important; background:linear-gradient(180deg, rgba(15,23,42,.92), rgba(15,23,42,.74)) !important; box-shadow:0 0 0 1px rgba(var(--accent-rgb),.06), 0 6px 14px rgba(var(--accent-rgb),.10) !important; animation:none !important; } #btnInvoiceExtract::before{ content:"" !important; display:block !important; position:absolute !important; inset:0 !important; border-radius:inherit !important; padding:1px !important; background:conic-gradient( from 0deg, rgba(var(--accent-rgb),.10), rgba(var(--accent-rgb),.95), rgba(34,211,238,.62), rgba(var(--accent-rgb),.95), rgba(var(--accent-rgb),.10) ) !important; -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important; -webkit-mask-composite:xor !important; mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important; mask-composite:exclude !important; pointer-events:none !important; z-index:1 !important; transform-origin:center center !important; animation:invoiceExtractThinRingSpin 2.25s linear infinite !important; } #btnInvoiceExtract::after{ display:none !important; content:none !important; } @keyframes invoiceExtractThinRingSpin{to{transform:rotate(360deg)}} html[data-theme="light"] #btnInvoiceExtract, body.theme-light #btnInvoiceExtract{ background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.94)) !important; border-color:rgba(var(--accent-rgb),.34) !important; } @media (prefers-reduced-motion: reduce){ #btnInvoiceExtract::before{animation:none !important;} } /* ---------------- v50: support-like extract orbit ring ---------------- */ #btnInvoiceExtract{ position:relative !important; isolation:isolate !important; overflow:visible !important; border:1px solid rgba(var(--accent-rgb),.32) !important; box-shadow:0 0 0 1px rgba(var(--accent-rgb),.08), 0 8px 18px rgba(var(--accent-rgb),.13) !important; } #btnInvoiceExtract::before{ content:"" !important; display:block !important; position:absolute !important; inset:-2px !important; z-index:-1 !important; border-radius:calc(var(--radius-lg, 16px) + 2px) !important; padding:2px !important; background:conic-gradient( from var(--invoice-extract-angle, 0deg), rgba(var(--accent-rgb),.08), rgba(37,99,235,.95), rgba(14,165,233,.65), rgba(var(--accent-rgb),.08) ) !important; -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important; -webkit-mask-composite:xor !important; mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important; mask-composite:exclude !important; pointer-events:none !important; transform:none !important; animation:invoiceExtractOrbitRing 2.65s linear infinite !important; } #btnInvoiceExtract::after{ display:none !important; content:none !important; } @property --invoice-extract-angle{ syntax:''; inherits:false; initial-value:0deg; } @keyframes invoiceExtractOrbitRing{ to{ --invoice-extract-angle:360deg; } } @media (prefers-reduced-motion: reduce){ #btnInvoiceExtract::before{animation:none !important;} } /* ---------------- v54: extract modal + print sizing polish ---------------- */ .invoiceExtractModal__panel{max-width:min(92vw, 520px) !important;} .invoiceExtractModal__header{align-items:center;} .invoiceExtractModal__titleWrap{display:flex;align-items:center;gap:10px;min-width:0;} .invoiceExtractModal__title{font-weight:900;font-size:18px;} .invoiceExtractModal__beta{ display:inline-flex;align-items:center;justify-content:center; min-width:48px;height:24px;padding:0 10px;border-radius:999px; font-size:11px;font-weight:900;letter-spacing:.08em;direction:ltr; color:#dbeafe;background:linear-gradient(135deg, rgba(37,99,235,.28), rgba(14,165,233,.18)); border:1px solid rgba(59,130,246,.38);box-shadow:0 8px 18px rgba(37,99,235,.12); } .invoiceExtractModal__body{display:grid;gap:14px;} .invoiceExtractModal__lead{color:var(--text);font-size:14px;line-height:1.8;text-align:right;} .invoiceExtractModal__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;} .invoiceExtractModal__actions .btn{min-height:46px;font-weight:800;} .invoiceExtractModal__note{ font-size:13px;line-height:1.9;color:var(--muted); background:rgba(15,23,42,.35);border:1px dashed rgba(148,163,184,.28); border-radius:14px;padding:10px 12px; } @media (max-width:640px){ .invoiceExtractModal__panel{width:min(96vw, 96vw) !important;} .invoiceExtractModal__actions{grid-template-columns:1fr;} } /* ---------------- v55: extract modal UI + extraction warnings ---------------- */ .invoiceExtractModal__beta{ min-width:40px !important; letter-spacing:0 !important; direction:rtl !important; font-size:12px !important; } .invoiceExtractModal__close{ border-radius:12px !important; padding:8px 13px !important; min-height:34px !important; line-height:1 !important; } .invoiceExtractModal__warnings{ border:1px solid rgba(245,158,11,.42); background:rgba(245,158,11,.10); color:#fde68a; border-radius:14px; padding:10px 12px; font-size:13px; line-height:1.9; } .invoiceExtractModal__warningsTitle{ font-weight:900; margin-bottom:4px; color:#fef3c7; } .invoiceExtractModal__warnings ul{margin:0;padding:0 18px 0 0;} .invoiceExtractModal__warnings li{margin:2px 0;} html[data-theme="light"] .invoiceExtractModal__warnings, body.theme-light .invoiceExtractModal__warnings{ color:#7c2d12; background:#fff7ed; border-color:#fdba74; } html[data-theme="light"] .invoiceExtractModal__warningsTitle, body.theme-light .invoiceExtractModal__warningsTitle{color:#9a3412;} /* ---------------- v58: professional AI extraction modal + camera ---------------- */ .invoiceExtractModal__panel--pro{ max-width:min(94vw, 640px) !important; overflow:hidden; border:1px solid rgba(59,130,246,.32) !important; box-shadow:0 28px 90px rgba(2,6,23,.58), inset 0 1px 0 rgba(255,255,255,.04) !important; background: radial-gradient(circle at 18% 0%, rgba(37,99,235,.18), transparent 34%), radial-gradient(circle at 88% 14%, rgba(14,165,233,.16), transparent 32%), linear-gradient(180deg, rgba(15,23,42,.98), rgba(10,16,30,.98)) !important; } .invoiceExtractModal__header--pro{ padding:16px 18px !important; border-bottom:1px solid rgba(148,163,184,.16) !important; background:linear-gradient(90deg, rgba(37,99,235,.14), rgba(14,165,233,.07), transparent) !important; } .invoiceExtractModal__titleWrap{gap:12px !important;} .invoiceExtractModal__orb{ width:42px;height:42px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center; font-size:13px;font-weight:950;letter-spacing:.08em;direction:ltr;color:#dbeafe; background:linear-gradient(135deg, rgba(37,99,235,.95), rgba(14,165,233,.75)); box-shadow:0 0 0 1px rgba(147,197,253,.35), 0 14px 32px rgba(37,99,235,.28); flex:0 0 auto; } .invoiceExtractModal__title{font-size:20px !important;font-weight:950 !important;line-height:1.35;} .invoiceExtractModal__subtitle{font-size:12px;color:rgba(226,232,240,.68);margin-top:2px;} .invoiceExtractModal__beta{ height:26px !important;min-width:auto !important;padding:0 11px !important; font-size:12px !important;letter-spacing:0 !important;direction:rtl !important; color:#bfdbfe !important;background:rgba(37,99,235,.16) !important; border:1px solid rgba(96,165,250,.42) !important; } .invoiceExtractModal__close.iconbtn{ width:38px;height:38px;border-radius:14px;font-size:22px;line-height:1; color:#dbeafe;background:rgba(15,23,42,.72);border:1px solid rgba(148,163,184,.25); box-shadow:none; } .invoiceExtractModal__close.iconbtn:hover{background:rgba(30,41,59,.88);border-color:rgba(96,165,250,.45);} .invoiceExtractModal__body--pro{padding:18px !important;gap:14px !important;} .invoiceExtractHero{ display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:18px; background:linear-gradient(135deg, rgba(15,23,42,.74), rgba(30,41,59,.48)); border:1px solid rgba(148,163,184,.18); } .invoiceExtractHero__icon{ width:38px;height:38px;border-radius:14px;display:flex;align-items:center;justify-content:center; font-size:22px;font-weight:900;color:#93c5fd;background:rgba(37,99,235,.14);border:1px solid rgba(59,130,246,.28); flex:0 0 auto; } .invoiceExtractHero__title{font-size:14px;font-weight:900;color:#f8fafc;line-height:1.8;} .invoiceExtractHero__text{font-size:12.5px;color:rgba(203,213,225,.72);line-height:1.8;margin-top:2px;} .invoiceExtractSteps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;} .invoiceExtractSteps div{ display:flex;align-items:center;gap:8px;padding:10px;border-radius:15px; background:rgba(15,23,42,.54);border:1px solid rgba(148,163,184,.16);min-width:0; } .invoiceExtractSteps b{ width:24px;height:24px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center; background:rgba(37,99,235,.2);color:#bfdbfe;font-size:12px;flex:0 0 auto; } .invoiceExtractSteps span{font-size:11.5px;color:rgba(226,232,240,.78);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .invoiceExtractModal__actions--pro{gap:12px !important;} .invoiceExtractModal__mainAction{min-height:52px !important;border-radius:16px !important;font-size:14px !important;font-weight:950 !important;} .invoiceExtractModal__note{ border-radius:16px !important;background:rgba(15,23,42,.58) !important;border:1px dashed rgba(96,165,250,.28) !important; color:rgba(226,232,240,.76) !important; } .invoiceCameraStage{display:grid;gap:10px;padding:12px;border:1px solid rgba(96,165,250,.24);border-radius:18px;background:rgba(15,23,42,.62);} .invoiceCameraStage[hidden]{display:none !important;} .invoiceCameraStage__frame{position:relative;overflow:hidden;border-radius:16px;background:#020617;min-height:260px;border:1px solid rgba(148,163,184,.22);} .invoiceCameraStage__frame video{display:block;width:100%;height:min(48vh,360px);object-fit:cover;background:#020617;} .invoiceCameraStage__scan{position:absolute;inset:14px;border:1px solid rgba(96,165,250,.55);border-radius:14px;box-shadow:0 0 0 999px rgba(2,6,23,.22), inset 0 0 22px rgba(59,130,246,.15);pointer-events:none;} .invoiceCameraStage__actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;} .invoiceCameraStage__hint{font-size:12px;color:rgba(203,213,225,.75);line-height:1.8;text-align:center;} html[data-theme="light"] .invoiceExtractModal__panel--pro, body.theme-light .invoiceExtractModal__panel--pro{ background:linear-gradient(180deg,#ffffff,#f8fafc) !important;color:#0f172a; box-shadow:0 28px 90px rgba(15,23,42,.22) !important; } html[data-theme="light"] .invoiceExtractHero, body.theme-light .invoiceExtractHero, html[data-theme="light"] .invoiceExtractSteps div, body.theme-light .invoiceExtractSteps div, html[data-theme="light"] .invoiceCameraStage, body.theme-light .invoiceCameraStage{ background:#f8fafc;border-color:#dbeafe; } html[data-theme="light"] .invoiceExtractHero__title, body.theme-light .invoiceExtractHero__title{color:#0f172a;} html[data-theme="light"] .invoiceExtractHero__text, body.theme-light .invoiceExtractHero__text, html[data-theme="light"] .invoiceExtractSteps span, body.theme-light .invoiceExtractSteps span{color:#475569;} @media (max-width:640px){ .invoiceExtractModal__panel--pro{width:min(96vw, 96vw) !important;} .invoiceExtractModal__title{font-size:17px !important;} .invoiceExtractModal__subtitle{display:none;} .invoiceExtractSteps{grid-template-columns:1fr;} .invoiceExtractSteps span{white-space:normal;} .invoiceCameraStage__frame{min-height:220px;} } /* ---------------- v59: inline AI extraction warnings ---------------- */ .invoiceExtractInlineWarnings{ margin:12px 0 0; border:1px solid rgba(245,158,11,.32); background:linear-gradient(135deg, rgba(245,158,11,.14), rgba(15,23,42,.32)); color:#fed7aa; border-radius:18px; padding:12px 14px; line-height:1.9; box-shadow:0 14px 32px rgba(245,158,11,.08), inset 0 1px 0 rgba(255,255,255,.06); } .invoiceExtractInlineWarnings[hidden]{display:none!important;} .invoiceExtractInlineWarnings .invoiceExtractModal__warningsTitle{font-weight:950;margin-bottom:4px;color:#fbbf24;} .invoiceExtractInlineWarnings ul{margin:0;padding:0 20px 0 0;} .invoiceExtractInlineWarnings li{margin:2px 0;} html[data-theme="light"] .invoiceExtractInlineWarnings, body.theme-light .invoiceExtractInlineWarnings{ background:linear-gradient(135deg, rgba(255,247,237,.96), rgba(239,246,255,.86)); color:#78350f; border-color:rgba(245,158,11,.36); } html[data-theme="light"] .invoiceExtractInlineWarnings .invoiceExtractModal__warningsTitle, body.theme-light .invoiceExtractInlineWarnings .invoiceExtractModal__warningsTitle{color:#b45309;} /* ---------------- v60: extract modal scrolling + mobile close + Finaria AI wording ---------------- */ #invoiceExtractModal{ align-items:center !important; justify-content:center !important; padding:12px !important; } #invoiceExtractModal .invoiceExtractModal__panel--pro{ max-height:calc(100dvh - 24px) !important; display:flex !important; flex-direction:column !important; overflow:hidden !important; } #invoiceExtractModal .invoiceExtractModal__header--pro{ position:relative !important; flex:0 0 auto !important; } #invoiceExtractModal .invoiceExtractModal__body--pro{ flex:1 1 auto !important; min-height:0 !important; overflow-y:auto !important; overflow-x:hidden !important; overscroll-behavior:contain !important; scrollbar-width:thin; } #invoiceExtractModal .invoiceExtractModal__actions--pro{ position:sticky !important; bottom:0 !important; z-index:3 !important; padding-top:10px !important; padding-bottom:4px !important; background:linear-gradient(180deg, rgba(10,16,30,0), rgba(10,16,30,.92) 28%, rgba(10,16,30,.98)) !important; } #invoiceExtractModal .invoiceCameraStage__actions{ position:sticky !important; bottom:0 !important; z-index:3 !important; padding-top:8px !important; background:linear-gradient(180deg, rgba(10,16,30,0), rgba(10,16,30,.94) 30%, rgba(10,16,30,.98)) !important; } #invoiceExtractModal .invoiceExtractModal__close.iconbtn{ flex:0 0 auto !important; z-index:6 !important; } @media (max-width:640px){ #invoiceExtractModal{align-items:flex-start !important;padding:8px !important;} #invoiceExtractModal .invoiceExtractModal__panel--pro{ width:min(98vw, 98vw) !important; max-height:calc(100dvh - 16px) !important; margin:0 auto !important; } #invoiceExtractModal .invoiceExtractModal__header--pro{ padding:12px 56px 12px 12px !important; align-items:flex-start !important; } #invoiceExtractModal .invoiceExtractModal__close.iconbtn{ position:absolute !important; left:12px !important; top:12px !important; width:38px !important; height:38px !important; } #invoiceExtractModal .invoiceExtractModal__titleWrap{ display:grid !important; grid-template-columns:34px minmax(0,1fr) !important; gap:8px !important; width:100% !important; padding-left:46px !important; } #invoiceExtractModal .invoiceExtractModal__orb{width:34px !important;height:34px !important;border-radius:13px !important;font-size:11px !important;} #invoiceExtractModal .invoiceExtractModal__title{font-size:16px !important;line-height:1.45 !important;} #invoiceExtractModal .invoiceExtractModal__subtitle{font-size:11px !important;line-height:1.6 !important;} #invoiceExtractModal .invoiceExtractModal__beta{ grid-column:2 !important; justify-self:start !important; margin-top:4px !important; position:relative !important; z-index:1 !important; } #invoiceExtractModal .invoiceExtractModal__body--pro{ padding:12px !important; max-height:calc(100dvh - 84px) !important; } #invoiceExtractModal .invoiceExtractHero{padding:12px !important;gap:10px !important;} #invoiceExtractModal .invoiceExtractSteps{grid-template-columns:1fr !important;} #invoiceExtractModal .invoiceExtractModal__actions--pro{grid-template-columns:1fr !important;} } /* ---------------- v61: extraction modal above announcements + hard mobile close ---------------- */ #invoiceExtractModal{ z-index:10080 !important; isolation:isolate !important; } #invoiceExtractModal .modal__backdrop{z-index:0 !important;} #invoiceExtractModal .invoiceExtractModal__panel--pro{ position:relative !important; z-index:1 !important; } #invoiceExtractModal .invoiceExtractModal__close.iconbtn{ z-index:10090 !important; } @media (max-width:640px){ #invoiceExtractModal{ padding-top:calc(env(safe-area-inset-top, 0px) + 8px) !important; } #invoiceExtractModal .invoiceExtractModal__close.iconbtn{ position:fixed !important; left:calc(env(safe-area-inset-left, 0px) + 12px) !important; top:calc(env(safe-area-inset-top, 0px) + 12px) !important; width:40px !important; height:40px !important; border-radius:14px !important; z-index:10095 !important; transform:translateZ(0); } #invoiceExtractModal .invoiceExtractModal__header--pro{ min-height:64px !important; padding-left:62px !important; } } /* ---------------- v64: extract modal close inside mobile viewport ---------------- */ @media (max-width:640px){ #invoiceExtractModal .invoiceExtractModal__close.iconbtn{ left:calc(env(safe-area-inset-left, 0px) + 22px) !important; top:calc(env(safe-area-inset-top, 0px) + 14px) !important; z-index:10120 !important; } #invoiceExtractModal .invoiceExtractModal__header--pro{ padding-left:74px !important; } } /* ---------------- v66: selectable invoice extraction fields ---------------- */ .invoiceExtractFields{ border:1px solid rgba(96,165,250,.20); background:linear-gradient(180deg, rgba(15,23,42,.58), rgba(15,23,42,.32)); border-radius:18px; padding:12px; box-shadow:inset 0 1px 0 rgba(255,255,255,.04); } .invoiceExtractFields__head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;} .invoiceExtractFields__head strong{font-size:13px;color:#f8fafc;font-weight:950;} .invoiceExtractFields__head span{font-size:11.5px;color:rgba(203,213,225,.72);} .invoiceExtractFields__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;} .invoiceExtractField{ display:flex;align-items:center;gap:8px;min-height:40px; padding:8px 10px;border-radius:14px; border:1px solid rgba(71,85,105,.56); background:rgba(15,23,42,.45); color:#dbeafe;font-size:12.5px;font-weight:800;cursor:pointer; user-select:none; } .invoiceExtractField input{width:16px;height:16px;accent-color:#2563eb;flex:0 0 auto;} .invoiceExtractField:has(input:checked){border-color:rgba(59,130,246,.7);background:rgba(37,99,235,.18);box-shadow:0 0 0 1px rgba(59,130,246,.12) inset;} html[data-theme="light"] .invoiceExtractFields, body.theme-light .invoiceExtractFields{background:rgba(248,250,252,.88);border-color:rgba(37,99,235,.18);} html[data-theme="light"] .invoiceExtractFields__head strong, body.theme-light .invoiceExtractFields__head strong{color:#0f172a;} html[data-theme="light"] .invoiceExtractFields__head span, body.theme-light .invoiceExtractFields__head span{color:#64748b;} html[data-theme="light"] .invoiceExtractField, body.theme-light .invoiceExtractField{background:#fff;color:#1e3a8a;border-color:#dbeafe;} @media (max-width:640px){ .invoiceExtractFields__head{align-items:flex-start;flex-direction:column;gap:3px;} .invoiceExtractFields__grid{grid-template-columns:1fr;} .invoiceExtractField{min-height:38px;} } /* ---------------- v67: extraction notes, picker redesign, mobile queue details ---------------- */ #modal[data-picker-kind="buyer"], #modal[data-picker-kind="item"]{z-index:10040;} #modal[data-picker-kind="buyer"] .modal__panel, #modal[data-picker-kind="item"] .modal__panel{ width:min(96vw, 720px) !important; max-height:min(92dvh, 860px) !important; overflow:hidden !important; display:flex !important; flex-direction:column !important; border-radius:22px !important; border-color:rgba(59,130,246,.28) !important; background:linear-gradient(180deg, rgba(15,23,42,.98), rgba(10,16,30,.98)) !important; } #modal[data-picker-kind="buyer"] .modal__header, #modal[data-picker-kind="item"] .modal__header{ flex:0 0 auto !important; position:sticky !important; top:0 !important; z-index:2 !important; background:linear-gradient(90deg, rgba(37,99,235,.16), rgba(14,165,233,.08), rgba(15,23,42,.98)) !important; } #modal[data-picker-kind="buyer"] .modal__body, #modal[data-picker-kind="item"] .modal__body{ min-height:0 !important; overflow:hidden !important; display:grid !important; grid-template-rows:auto minmax(0,1fr) !important; gap:12px !important; } #modal[data-picker-kind="buyer"] .modal__body > .row:first-child, #modal[data-picker-kind="item"] .modal__body > .row:first-child{ display:grid !important; grid-template-columns:minmax(0,1fr) minmax(150px,190px) 104px !important; gap:10px !important; align-items:end !important; } #modal[data-picker-kind="buyer"] .modalSearchForm, #modal[data-picker-kind="item"] .modalSearchForm, #modal[data-picker-kind="buyer"] .modalSortForm, #modal[data-picker-kind="item"] .modalSortForm{min-width:0 !important;} #modal[data-picker-kind="buyer"] #modalSearch, #modal[data-picker-kind="item"] #modalSearch, #modal[data-picker-kind="buyer"] #modalSort, #modal[data-picker-kind="item"] #modalSort{ width:100% !important; height:46px !important; border-radius:15px !important; } #modal[data-picker-kind="buyer"] #modalRefresh, #modal[data-picker-kind="item"] #modalRefresh{ height:46px !important; border-radius:15px !important; width:100% !important; margin:0 !important; } #modal[data-picker-kind="buyer"] #modalTable, #modal[data-picker-kind="item"] #modalTable{min-height:0 !important;overflow:hidden !important;display:grid !important;} #modal[data-picker-kind="buyer"] .modalPickerList, #modal[data-picker-kind="item"] .modalPickerList{ max-height:none !important; overflow:auto !important; padding:6px !important; border:1px solid rgba(96,165,250,.18) !important; border-radius:18px !important; background:rgba(2,6,23,.18) !important; } #modal[data-picker-kind="buyer"] .modalPickCard, #modal[data-picker-kind="item"] .modalPickCard{ grid-template-columns:minmax(0,1.25fr) minmax(230px,.95fr) 38px !important; gap:10px !important; align-items:center !important; border-radius:16px !important; margin-bottom:8px !important; } #modal[data-picker-kind="buyer"] .modalPickCard__meta, #modal[data-picker-kind="item"] .modalPickCard__meta{ display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:8px !important; } #modal[data-picker-kind="buyer"] .modalPickCard__meta span, #modal[data-picker-kind="item"] .modalPickCard__meta span{min-width:0 !important;} #modal[data-picker-kind="buyer"] .modalPickerPager, #modal[data-picker-kind="item"] .modalPickerPager{ flex:0 0 auto !important; margin-top:8px !important; border-radius:16px !important; } @media (max-width:640px){ #modal[data-picker-kind="buyer"] .modal__panel, #modal[data-picker-kind="item"] .modal__panel{width:calc(100vw - 12px) !important;max-height:calc(100dvh - 18px) !important;border-radius:20px !important;} #modal[data-picker-kind="buyer"] .modal__body, #modal[data-picker-kind="item"] .modal__body{padding:10px !important;} #modal[data-picker-kind="buyer"] .modal__body > .row:first-child, #modal[data-picker-kind="item"] .modal__body > .row:first-child{grid-template-columns:1fr 1fr !important;gap:8px !important;} #modal[data-picker-kind="buyer"] #modalRefresh, #modal[data-picker-kind="item"] #modalRefresh{grid-column:1 / -1 !important;} #modal[data-picker-kind="buyer"] .modalPickCard, #modal[data-picker-kind="item"] .modalPickCard{grid-template-columns:minmax(0,1fr) 36px !important;align-items:start !important;} #modal[data-picker-kind="buyer"] .modalPickCard__meta, #modal[data-picker-kind="item"] .modalPickCard__meta{grid-column:1 / -1 !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;} #modal[data-picker-kind="buyer"] .modalPickCard__edit, #modal[data-picker-kind="item"] .modalPickCard__edit{grid-column:2 !important;grid-row:1 / span 2 !important;} } @media (max-width:640px){ #invoiceExtractModal .invoiceExtractModal__close.iconbtn{ left:auto !important; right:calc(env(safe-area-inset-right, 0px) + 12px) !important; top:calc(env(safe-area-inset-top, 0px) + 12px) !important; } #invoiceExtractModal .invoiceExtractModal__header--pro{ padding-right:62px !important; padding-left:12px !important; } #invoiceExtractModal .invoiceExtractModal__titleWrap{padding-left:0 !important;padding-right:0 !important;} } @media (max-width:760px){ .jobAdvancedTableRow > td{padding:0 !important;background:transparent !important;} .jobAdvanced--invoiceList{ position:sticky !important; right:0 !important; width:calc(100vw - 34px) !important; max-width:calc(100vw - 34px) !important; max-height:62dvh !important; overflow:auto !important; margin:8px 8px 12px !important; box-shadow:0 18px 46px rgba(2,6,23,.35) !important; } .jobAdvanced--invoiceList .jobAdvanced__grid{grid-template-columns:1fr !important;padding:0 0 10px !important;} .jobAdvanced--invoiceList .jobAdvanced__cell b{white-space:normal !important;overflow-wrap:anywhere !important;text-align:start;} .jobAdvanced--invoiceList .jobAdvanced__cell--mono b{direction:ltr;text-align:left;} .jobAdvanced--invoiceList .jobAdvanced__error{margin:0 0 10px !important;} } /* ---------------- v68: picker column headers + attached search button + mobile invoice details ---------------- */ #modal[data-picker-kind="buyer"] #modalTable, #modal[data-picker-kind="item"] #modalTable{ grid-template-rows:auto minmax(0,1fr) auto !important; gap:0 !important; } #modal[data-picker-kind="buyer"] .modal__body > .row:first-child, #modal[data-picker-kind="item"] .modal__body > .row:first-child{ column-gap:0 !important; row-gap:10px !important; } #modal[data-picker-kind="buyer"] .modalSearchForm, #modal[data-picker-kind="item"] .modalSearchForm{ margin-inline-end:10px !important; } #modal[data-picker-kind="buyer"] .modalSortForm, #modal[data-picker-kind="item"] .modalSortForm{ margin:0 !important; } #modal[data-picker-kind="buyer"] #modalSort, #modal[data-picker-kind="item"] #modalSort{ border-top-left-radius:0 !important; border-bottom-left-radius:0 !important; } #modal[data-picker-kind="buyer"] #modalRefresh, #modal[data-picker-kind="item"] #modalRefresh{ border-top-right-radius:0 !important; border-bottom-right-radius:0 !important; border-inline-start:0 !important; box-shadow:none !important; } .modalPickerHeader{ direction:rtl; display:grid; grid-template-columns:minmax(0,1.25fr) repeat(3,minmax(72px,1fr)) 38px; gap:8px; align-items:center; padding:8px 12px; margin:0 6px 6px; border:1px solid rgba(96,165,250,.18); border-radius:14px; background:linear-gradient(180deg, rgba(59,130,246,.14), rgba(15,23,42,.16)); color:#bfdbfe; font-size:11.5px; font-weight:950; position:sticky; top:0; z-index:3; } .modalPickerHeader span{ min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .modalPickerHeader span:not(:first-child){text-align:center;} #modal[data-picker-kind="buyer"] .modalPickerList, #modal[data-picker-kind="item"] .modalPickerList{ padding-top:0 !important; } html[data-theme="light"] .modalPickerHeader, body.theme-light .modalPickerHeader{ background:linear-gradient(180deg, #eff6ff, #ffffff); color:#1d4ed8; border-color:#dbeafe; } @media (max-width:640px){ #modal[data-picker-kind="buyer"] .modal__body > .row:first-child, #modal[data-picker-kind="item"] .modal__body > .row:first-child{ grid-template-columns:1fr 1fr !important; column-gap:0 !important; row-gap:8px !important; } #modal[data-picker-kind="buyer"] .modalSearchForm, #modal[data-picker-kind="item"] .modalSearchForm{ grid-column:1 / -1 !important; margin-inline-end:0 !important; } #modal[data-picker-kind="buyer"] .modalSortForm, #modal[data-picker-kind="item"] .modalSortForm{grid-column:1 !important;} #modal[data-picker-kind="buyer"] #modalRefresh, #modal[data-picker-kind="item"] #modalRefresh{grid-column:2 !important;} .modalPickerHeader{ grid-template-columns:minmax(0,1fr) repeat(3,minmax(46px,.58fr)) 30px; padding:7px 8px; margin:0 4px 5px; gap:5px; font-size:10px; } } @media (max-width:760px){ .jobAdvanced--invoiceList{ border-radius:18px !important; padding:10px !important; } .jobAdvanced--invoiceList .jobAdvanced__grid{ display:grid !important; grid-template-columns:1fr !important; gap:8px !important; padding:0 0 8px !important; } .jobAdvanced--invoiceList .jobAdvanced__cell{ display:grid !important; grid-template-columns:minmax(88px,.36fr) minmax(0,1fr) !important; gap:8px !important; align-items:center !important; padding:10px 11px !important; border-radius:14px !important; } .jobAdvanced--invoiceList .jobAdvanced__cell span{ margin:0 !important; font-size:11px !important; line-height:1.6 !important; } .jobAdvanced--invoiceList .jobAdvanced__cell b, .jobAdvanced--invoiceList .jobAdvanced__copy b{ white-space:normal !important; overflow:visible !important; text-overflow:clip !important; overflow-wrap:anywhere !important; word-break:break-word !important; text-align:start !important; line-height:1.7 !important; } .jobAdvanced--invoiceList .jobAdvanced__cell--mono b, .jobAdvanced--invoiceList .jobAdvanced__cell--mono .jobAdvanced__copy b{ direction:ltr !important; text-align:left !important; unicode-bidi:plaintext !important; } .jobAdvanced--invoiceList .jobAdvanced__copy{ min-width:0 !important; display:flex !important; gap:8px !important; } .jobAdvanced--invoiceList .jobAdvanced__error{ margin:0 !important; padding:10px !important; } .jobAdvanced--invoiceList .jobAdvanced__error p{ max-height:none !important; white-space:pre-wrap !important; overflow-wrap:anywhere !important; } } /* ---------------- v69: picker full list redesign ---------------- */ #modal[data-picker-kind="buyer"], #modal[data-picker-kind="item"]{z-index:10050;} #modal[data-picker-kind="buyer"] .modal__panel, #modal[data-picker-kind="item"] .modal__panel{ width:min(96vw, 1040px) !important; max-height:calc(100dvh - 34px) !important; display:flex !important; flex-direction:column !important; overflow:hidden !important; } #modal[data-picker-kind="buyer"] .modal__header, #modal[data-picker-kind="item"] .modal__header{ flex:0 0 auto !important; } #modal[data-picker-kind="buyer"] .modal__body, #modal[data-picker-kind="item"] .modal__body{ flex:1 1 auto !important; min-height:0 !important; display:grid !important; grid-template-rows:auto minmax(0,1fr) !important; gap:10px !important; overflow:hidden !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker, #modal[data-picker-kind="item"] .listToolbar--modalPicker{ margin:0 !important; padding:10px !important; border:1px solid rgba(148,163,184,.16); border-radius:18px; background:linear-gradient(180deg, rgba(15,23,42,.46), rgba(15,23,42,.22)); } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__search, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__search{ flex:1 1 420px !important; max-width:none !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__sort, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__sort{ flex:0 0 190px !important; min-width:170px !important; } #modal[data-picker-kind="buyer"] #modalSearch, #modal[data-picker-kind="item"] #modalSearch, #modal[data-picker-kind="buyer"] #modalSort, #modal[data-picker-kind="item"] #modalSort{ width:100% !important; height:42px !important; border-radius:13px !important; } #modal[data-picker-kind="buyer"] #modalRefresh, #modal[data-picker-kind="item"] #modalRefresh{ width:auto !important; min-width:94px !important; height:42px !important; border-radius:13px !important; border-inline-start:1px solid rgba(var(--accent-rgb),.45) !important; box-shadow:0 10px 26px rgba(var(--accent-rgb),.15) !important; } #modal[data-picker-kind="buyer"] #modalTable, #modal[data-picker-kind="item"] #modalTable{ min-height:0 !important; display:flex !important; flex-direction:column !important; gap:8px !important; overflow:hidden !important; } #modal[data-picker-kind="buyer"] .modalPickerTableWrap, #modal[data-picker-kind="item"] .modalPickerTableWrap{ flex:1 1 auto !important; min-height:0 !important; max-height:none !important; overflow:auto !important; border:1px solid rgba(148,163,184,.16) !important; border-radius:18px !important; background:rgba(2,6,23,.14) !important; } #modal[data-picker-kind="buyer"] .modalPickerTable, #modal[data-picker-kind="item"] .modalPickerTable{ min-width:860px; font-size:12.5px; } #modal[data-picker-kind="buyer"] .modalPickerTable th, #modal[data-picker-kind="buyer"] .modalPickerTable td, #modal[data-picker-kind="item"] .modalPickerTable th, #modal[data-picker-kind="item"] .modalPickerTable td{ padding:9px 10px !important; vertical-align:middle !important; } #modal[data-picker-kind="buyer"] .modalPickerTable thead th, #modal[data-picker-kind="item"] .modalPickerTable thead th{ position:sticky !important; top:0 !important; z-index:3 !important; background:linear-gradient(180deg, rgba(15,23,42,.98), rgba(15,23,42,.90)) !important; color:var(--muted) !important; white-space:nowrap !important; } #modal[data-picker-kind="buyer"] .modalPickerTable__row, #modal[data-picker-kind="item"] .modalPickerTable__row{ cursor:pointer; transition:background .16s ease, box-shadow .16s ease; } #modal[data-picker-kind="buyer"] .modalPickerTable__row:hover, #modal[data-picker-kind="buyer"] .modalPickerTable__row:focus-visible, #modal[data-picker-kind="item"] .modalPickerTable__row:hover, #modal[data-picker-kind="item"] .modalPickerTable__row:focus-visible{ background:rgba(var(--accent-rgb),.10); outline:none; } #modal[data-picker-kind="buyer"] .modalPickerTable td b, #modal[data-picker-kind="item"] .modalPickerTable td b{ font-weight:900; color:var(--text); } #modal[data-picker-kind="buyer"] .modalPickSortBtn, #modal[data-picker-kind="item"] .modalPickSortBtn{ margin:0; justify-content:flex-start; } .modalPickerChooseBadge{ display:inline-flex; align-items:center; justify-content:center; height:28px; padding:0 9px; border-radius:999px; border:1px solid rgba(var(--accent-rgb),.36); background:rgba(var(--accent-rgb),.10); color:#bfdbfe; font-size:11.5px; font-weight:900; white-space:nowrap; } #modal[data-picker-kind="buyer"] .modalPickerTable .opActions, #modal[data-picker-kind="item"] .modalPickerTable .opActions{ justify-content:center; gap:6px; flex-wrap:nowrap; } .modalPickerEmptyState{ min-height:220px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; border:1px dashed rgba(148,163,184,.28); border-radius:18px; background:rgba(2,6,23,.14); color:var(--muted); text-align:center; padding:22px; } .modalPickerEmptyState__icon{ width:46px; height:46px; border-radius:18px; display:grid; place-items:center; background:rgba(var(--accent-rgb),.12); color:#bfdbfe; font-size:24px; font-weight:900; } .modalPickerEmptyState b{color:var(--text);font-size:14px;} .modalPickerEmptyState span{font-size:12px;line-height:1.9;} #modal[data-picker-kind="buyer"] .modalPickerPager, #modal[data-picker-kind="item"] .modalPickerPager{ flex:0 0 auto !important; margin:0 !important; padding:8px 10px !important; border:1px solid rgba(148,163,184,.14) !important; border-radius:16px !important; background:rgba(15,23,42,.28) !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .listToolbar--modalPicker, html[data-theme="light"] #modal[data-picker-kind="item"] .listToolbar--modalPicker, body.theme-light #modal[data-picker-kind="buyer"] .listToolbar--modalPicker, body.theme-light #modal[data-picker-kind="item"] .listToolbar--modalPicker{ background:linear-gradient(180deg,#ffffff,#f8fafc); border-color:#e2e8f0; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPickerTableWrap, html[data-theme="light"] #modal[data-picker-kind="item"] .modalPickerTableWrap, body.theme-light #modal[data-picker-kind="buyer"] .modalPickerTableWrap, body.theme-light #modal[data-picker-kind="item"] .modalPickerTableWrap{ background:#fff !important; border-color:#e2e8f0 !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPickerTable thead th, html[data-theme="light"] #modal[data-picker-kind="item"] .modalPickerTable thead th, body.theme-light #modal[data-picker-kind="buyer"] .modalPickerTable thead th, body.theme-light #modal[data-picker-kind="item"] .modalPickerTable thead th{ background:linear-gradient(180deg,#f8fafc,#eef2ff) !important; } html[data-theme="light"] .modalPickerChooseBadge, body.theme-light .modalPickerChooseBadge{ color:#1d4ed8; background:#eff6ff; border-color:#bfdbfe; } html[data-theme="light"] .modalPickerEmptyState, body.theme-light .modalPickerEmptyState{ background:#fff; border-color:#cbd5e1; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPickerPager, html[data-theme="light"] #modal[data-picker-kind="item"] .modalPickerPager, body.theme-light #modal[data-picker-kind="buyer"] .modalPickerPager, body.theme-light #modal[data-picker-kind="item"] .modalPickerPager{ background:#fff !important; border-color:#e2e8f0 !important; } @media(max-width:720px){ #modal[data-picker-kind="buyer"] .modal__panel, #modal[data-picker-kind="item"] .modal__panel{ width:calc(100vw - 12px) !important; max-height:calc(100dvh - 16px) !important; border-radius:20px !important; } #modal[data-picker-kind="buyer"] .modal__body, #modal[data-picker-kind="item"] .modal__body{ padding:10px !important; gap:8px !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker, #modal[data-picker-kind="item"] .listToolbar--modalPicker{ padding:8px !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__fields, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__fields{ display:grid !important; grid-template-columns:minmax(0,1fr) 118px !important; gap:8px !important; width:100% !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__search, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__search{ grid-column:1 / -1 !important; flex-basis:auto !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__sort, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__sort{ grid-column:1 !important; min-width:0 !important; flex-basis:auto !important; } #modal[data-picker-kind="buyer"] #modalRefresh, #modal[data-picker-kind="item"] #modalRefresh{ grid-column:2 !important; width:100% !important; min-width:0 !important; align-self:end !important; } #modal[data-picker-kind="buyer"] .modalPickerTable, #modal[data-picker-kind="item"] .modalPickerTable{ min-width:760px; font-size:12px; } #modal[data-picker-kind="buyer"] .modalPickerTable th, #modal[data-picker-kind="buyer"] .modalPickerTable td, #modal[data-picker-kind="item"] .modalPickerTable th, #modal[data-picker-kind="item"] .modalPickerTable td{ padding:8px 7px !important; } #modal[data-picker-kind="buyer"] .modalPickerTableWrap, #modal[data-picker-kind="item"] .modalPickerTableWrap{ border-radius:15px !important; } .modalPickerChooseBadge{height:26px;padding:0 7px;font-size:11px;} } /* v69.1: keep picker controls like list pages: search + sort + button in one toolbar */ #modal[data-picker-kind="buyer"] .listToolbar--modalPicker, #modal[data-picker-kind="item"] .listToolbar--modalPicker{ display:grid !important; grid-template-columns:minmax(0,1fr) 190px 96px !important; align-items:end !important; gap:10px !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__fields, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__fields{ display:contents !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__search, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__search, #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__sort, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__sort{ flex:none !important; max-width:none !important; min-width:0 !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker #modalRefresh, #modal[data-picker-kind="item"] .listToolbar--modalPicker #modalRefresh{ width:100% !important; } @media(max-width:720px){ #modal[data-picker-kind="buyer"] .listToolbar--modalPicker, #modal[data-picker-kind="item"] .listToolbar--modalPicker{ grid-template-columns:minmax(0,1fr) 112px !important; gap:8px !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__search, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__search{ grid-column:1 / -1 !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__sort, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__sort{ grid-column:1 !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker #modalRefresh, #modal[data-picker-kind="item"] .listToolbar--modalPicker #modalRefresh{ grid-column:2 !important; } } /* v70: picker bottom page-size control (default 10, max 50) */ #modal[data-picker-kind="buyer"] .modalPageSizeCtl, #modal[data-picker-kind="item"] .modalPageSizeCtl{ display:inline-flex; align-items:center; gap:7px; margin-inline-start:auto; color:var(--muted); font-size:11.5px; font-weight:800; white-space:nowrap; } #modal[data-picker-kind="buyer"] .modalPageSizeCtl select, #modal[data-picker-kind="item"] .modalPageSizeCtl select{ width:74px; height:32px; padding:0 9px; border-radius:10px; border:1px solid rgba(148,163,184,.24); background:rgba(15,23,42,.38); color:var(--text); font-weight:900; outline:none; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPageSizeCtl select, html[data-theme="light"] #modal[data-picker-kind="item"] .modalPageSizeCtl select, body.theme-light #modal[data-picker-kind="buyer"] .modalPageSizeCtl select, body.theme-light #modal[data-picker-kind="item"] .modalPageSizeCtl select{ background:#fff; border-color:#cbd5e1; } #modal[data-picker-kind="buyer"] .modalPickerPager .pager, #modal[data-picker-kind="item"] .modalPickerPager .pager{ flex-wrap:wrap; } @media(max-width:720px){ #modal[data-picker-kind="buyer"] .modalPickerPager .pager, #modal[data-picker-kind="item"] .modalPickerPager .pager{ justify-content:center !important; } #modal[data-picker-kind="buyer"] .modalPickerPager .pager__right, #modal[data-picker-kind="item"] .modalPickerPager .pager__right{ justify-content:center; flex-wrap:wrap; } #modal[data-picker-kind="buyer"] .modalPageSizeCtl, #modal[data-picker-kind="item"] .modalPageSizeCtl{ width:100%; margin-inline-start:0; justify-content:center; } } /* ---------------- v76: polished public invoice preview + simpler Excel import ---------------- */ .excelHub{display:flex;flex-direction:column;gap:14px;margin-top:14px;} .excelGuideCard{display:flex;align-items:center;justify-content:space-between;gap:16px;overflow:hidden;position:relative;} .excelGuideCard::before{content:"";position:absolute;inset:auto -80px -120px auto;width:260px;height:260px;border-radius:999px;background:rgba(var(--accent-rgb),.14);filter:blur(4px);pointer-events:none;} .excelGuideCard__text{position:relative;z-index:1;min-width:0;} .excelGuideCard__eyebrow{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(var(--accent-rgb),.12);color:var(--primary-200);font-size:12px;font-weight:900;margin-bottom:8px;} .excelGuideCard h2{margin:0 0 6px;font-size:20px;} .excelGuideCard p{margin:0;max-width:720px;line-height:1.9;} .excelGuideSteps{position:relative;z-index:1;display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;} .excelGuideStep{display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.04);white-space:nowrap;} .excelGuideStep span{width:24px;height:24px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:rgba(var(--accent-rgb),.16);color:var(--primary-200);font-weight:1000;} .excelGuideStep strong{font-size:12px;} .excelImportGrid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:14px;align-items:stretch;} .excelImportCard{display:flex;flex-direction:column;gap:12px;min-height:100%;border-radius:22px;} .excelImportCard--primary{border-color:rgba(var(--accent-rgb),.32);box-shadow:0 16px 46px rgba(11,92,255,.12);} .excelImportCard__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;} .excelImportCard__head h2{margin:0 0 6px;font-size:17px;} .excelImportCard__head p{margin:0;line-height:1.8;} .excelImportCard__kicker{display:inline-flex;padding:4px 9px;border-radius:999px;background:rgba(34,197,94,.12);color:var(--accent2);font-size:11px;font-weight:900;margin-bottom:8px;border:1px solid rgba(34,197,94,.22);} .excelImportCard__icon{flex:0 0 auto;min-width:54px;height:38px;padding:0 10px;border-radius:15px;display:inline-flex;align-items:center;justify-content:center;background:rgba(148,163,184,.09);border:1px solid var(--border);font-size:12px;font-weight:900;color:var(--muted);} .excelImportActions{display:flex;flex-direction:column;gap:10px;margin-top:auto;} .excelFilePick{width:100%;min-width:0;padding:10px;border-radius:16px;border:1px dashed rgba(var(--border-rgb),.42);background:rgba(148,163,184,.05);display:flex;align-items:center;gap:10px;justify-content:space-between;} .excelFilePick .filepick__name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;direction:rtl;} .excelImportCard__submit{width:100%;justify-content:center;} .excelExportCard{display:flex;align-items:center;justify-content:space-between;gap:14px;} .excelExportCard__title h2{margin:0 0 4px;font-size:17px;} .excelExportCard__title p{margin:0;} .excelExportCard__actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;} .invPrevPanel--clean{width:min(1180px, calc(100vw - 24px));max-height:90vh;overflow:hidden;display:flex;flex-direction:column;} .invPrevHeader{border-bottom:1px solid var(--border);} .invPrevBodyClean{display:flex;flex-direction:column;gap:12px;min-height:0;} .invPrevTopbar{display:flex;align-items:center;justify-content:space-between;gap:12px;} .invPrevConfirmBtn{white-space:nowrap;} .invPrevToolbar--clean{padding:10px 12px;border:1px solid var(--border);border-radius:16px;background:rgba(148,163,184,.05);margin-bottom:0;} .invPrevTableWrap--clean{max-height:min(54vh, 560px);overflow:auto;border-radius:18px;border:1px solid var(--border);background:rgba(2,6,23,.10);} .invPrevTable--clean{margin:0;min-width:1060px;} .invPrevTable--clean thead th{position:sticky;top:0;z-index:2;background:var(--panel);box-shadow:0 1px 0 var(--border);font-size:12px;} .invPrevTable--clean td{vertical-align:middle;} .invPrevTable--clean .in.in--sm{min-width:92px;width:100%;height:32px;border-radius:10px;} .invPrevTable--clean td:nth-child(4) .in.in--sm{min-width:150px;} .invPrevStat{border-radius:14px;background:rgba(148,163,184,.06);} .invPrevStatus{display:inline-flex;align-items:center;max-width:260px;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:900;line-height:1.6;white-space:normal;} .invPrevStatus--ok{background:rgba(34,197,94,.12);color:var(--accent2);border:1px solid rgba(34,197,94,.24);} .invPrevStatus--bad{background:rgba(var(--danger-rgb),.12);color:#fecaca;border:1px solid rgba(var(--danger-rgb),.24);} .invPrevErrCell{min-width:160px;line-height:1.7;} .invPrevErrCell--ok{text-align:center;} .invPrevRow--err td{background:rgba(var(--danger-rgb),.07) !important;} @media (max-width:1100px){ .excelImportGrid{grid-template-columns:1fr;} .excelExportCard{align-items:stretch;flex-direction:column;} .excelExportCard__actions{justify-content:stretch;} .excelExportCard__actions .btn{flex:1 1 180px;} } @media (max-width:760px){ .excelGuideCard{align-items:stretch;flex-direction:column;} .excelGuideSteps{justify-content:stretch;} .excelGuideStep{flex:1 1 100%;} .excelFilePick{align-items:stretch;flex-direction:column;} .excelFilePick .btn{width:100%;} .excelFilePick .filepick__name{text-align:center;} .invPrevTopbar{align-items:stretch;flex-direction:column;} .invPrevSummary{width:100%;} .invPrevConfirmBtn{width:100%;} .invPrevToolbar--clean{align-items:stretch;} .invPrevPager{width:100%;} .invPrevPager .btn{flex:1 1 auto;} } /* v78 login OTP flow refinements */ .loginGate__otpLockedHint{ margin-top:8px; padding:9px 11px; border:1px solid rgba(var(--accent-rgb),.16); border-radius:12px; background:rgba(var(--accent-rgb),.055); color:var(--text); font-size:12px; font-weight:800; text-align:center; } #loginGateMobile.is-otp-locked{ background:rgba(148,163,184,.08); border-color:rgba(var(--accent-rgb),.24); cursor:not-allowed; } .loginGate__otpSubmitRow{ display:grid; grid-template-columns:minmax(0,1fr) 132px; gap:8px; align-items:center; margin-top:10px; } .loginGate__otpSubmitRow .btn{min-height:46px;white-space:nowrap;} .loginGate__voiceBtn{ display:inline-flex; align-items:center; justify-content:center; border-color:rgba(var(--accent-rgb),.20)!important; background:rgba(var(--accent-rgb),.045)!important; font-weight:800; } @media (max-width:520px){ .loginGate__otpSubmitRow{grid-template-columns:1fr;} .loginGate__voiceBtn{width:100%;} } /* v80: cleaner OTP actions for login/register/forgot */ .loginGate__resendBtn{ width:132px!important; min-width:132px!important; max-width:132px; min-height:46px; padding-inline:10px!important; font-size:12px; font-weight:800; white-space:nowrap; } .loginGate__voiceBtn:disabled, .loginGate__voiceBtn.is-disabled{ opacity:.48; filter:saturate(.65); cursor:not-allowed!important; box-shadow:none!important; } .loginGate__resendBtn:disabled{ opacity:.55; cursor:not-allowed!important; } #loginForgotStep2 .loginGate__otpSubmitRow, #loginRegStep2 .loginGate__otpSubmitRow{ grid-template-columns:minmax(0,1fr) 132px; } #loginForgotStep2 .loginGate__otpSubmitRow .btn, #loginRegStep2 .loginGate__otpSubmitRow .btn{ margin-top:0!important; } @media (max-width:520px){ .loginGate__resendBtn{width:100%!important;max-width:none;min-width:0!important;} #loginForgotStep2 .loginGate__otpSubmitRow, #loginRegStep2 .loginGate__otpSubmitRow{grid-template-columns:1fr;} } /* v81 OTP polish: centered timers and voice cooldown only after voice request */ #loginRegOtpTimer:not([hidden]), #loginForgotOtpTimer:not([hidden]){ display:block; width:100%; text-align:center; } .loginGate__otpTimer.is-lock{ text-align:center; } /* v82: Excel final import result + cleaner OTP voice state */ .invPrevImportResult{ margin:10px 0 0; padding:10px 12px; border-radius:14px; text-align:center; font-weight:800; border:1px solid rgba(148,163,184,.25); background:rgba(15,23,42,.38); } .invPrevImportResult.is-info{color:#bfdbfe;background:rgba(37,99,235,.10);border-color:rgba(59,130,246,.28)} .invPrevImportResult.is-ok{color:#bbf7d0;background:rgba(34,197,94,.10);border-color:rgba(34,197,94,.28)} .invPrevImportResult.is-err{color:#fecaca;background:rgba(239,68,68,.10);border-color:rgba(239,68,68,.28)} .invPrevConfirmBtn.is-loading{position:relative;opacity:.82;cursor:wait} .invPrevConfirmBtn.is-loading::before{ content:""; width:14px;height:14px;margin-inline-end:8px; display:inline-block;vertical-align:-2px; border:2px solid currentColor;border-top-color:transparent;border-radius:50%; animation:spin .8s linear infinite; } .loginGate__otpTimer,.authOtpTimer,.otpTimer{text-align:center} @keyframes spin{to{transform:rotate(360deg)}} /* پیش‌نمایش اکسل: خطا بدون کپسول پس‌زمینه، فقط متن هشدار */ .invPrevStatus--bad{ background:transparent !important; border-color:transparent !important; border-radius:0 !important; padding:0 !important; color:#fecaca !important; box-shadow:none !important; } :root[data-theme="light"] .invPrevStatus--bad, html.theme-light .invPrevStatus--bad, body.theme-light .invPrevStatus--bad{ color:#dc2626 !important; } /* v84: full Excel preview grid + plain error text */ .invPrevTable--clean{min-width:3200px;} .invPrevTable--clean .invPrevCellInput{min-width:110px;width:100%;} .invPrevTable--clean td:nth-child(8) .invPrevCellInput, .invPrevTable--clean td:nth-child(15) .invPrevCellInput{min-width:180px;} .invPrevStatus{display:inline;max-width:none;border-radius:0;padding:0;background:transparent!important;border:0!important;font-size:12px;font-weight:800;line-height:1.8;white-space:normal;} .invPrevStatus--bad{background:transparent!important;border:0!important;color:#fecaca!important;} :root[data-theme="light"] .invPrevStatus--bad,html.theme-light .invPrevStatus--bad,body.theme-light .invPrevStatus--bad{color:#b91c1c!important;background:transparent!important;border:0!important;} .invPrevStatus--ok{background:transparent!important;border:0!important;color:var(--accent2)!important;} /* ---------------- v91: plan prompt actions + mobile polish ---------------- */ .msgActions{ display:flex; align-items:center; justify-content:flex-end; gap:8px; margin-top:12px; flex-wrap:wrap; } .msgActions[hidden]{display:none!important;} .msgActions .btn{min-width:132px;font-weight:950;} @media (max-width:640px){ .msgActions{justify-content:stretch;} .msgActions .btn{width:100%;min-height:44px;} } /* Readable light-mode buttons, especially in day view/mobile cards. */ html[data-theme="light"] .btn--ghost, body.theme-light .btn--ghost{ color:#1e3a8a !important; background:linear-gradient(180deg,#ffffff,#f8fbff) !important; border-color:rgba(37,99,235,.24) !important; box-shadow:0 8px 18px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.9) !important; } html[data-theme="light"] .btn--ghost:hover, body.theme-light .btn--ghost:hover{ color:#0b5cff !important; border-color:rgba(37,99,235,.42) !important; background:linear-gradient(180deg,#ffffff,#eef6ff) !important; } html[data-theme="light"] .btn:disabled, body.theme-light .btn:disabled, html[data-theme="light"] .btn[aria-disabled="true"], body.theme-light .btn[aria-disabled="true"]{ opacity:.58 !important; color:#64748b !important; background:#f1f5f9 !important; border-color:#dbe4ef !important; } /* Report / Excel file names should never push the mobile viewport horizontally. */ .filepick, .excelFilePick{max-width:100%;overflow:hidden;} .filepick__name, .excelFilePick .filepick__name{ display:block; min-width:0 !important; max-width:100% !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; overflow-wrap:anywhere; } @media (max-width:760px){ .excelFilePick{width:100%;box-sizing:border-box;} .excelFilePick .filepick__name{width:100%;text-align:center;direction:rtl;} } /* Extraction modal: remove the black sticky block under file/camera buttons in light mobile view. */ html[data-theme="light"] #invoiceExtractModal .invoiceExtractModal__actions--pro, body.theme-light #invoiceExtractModal .invoiceExtractModal__actions--pro, html[data-theme="light"] #invoiceExtractModal .invoiceCameraStage__actions, body.theme-light #invoiceExtractModal .invoiceCameraStage__actions{ background:linear-gradient(180deg, rgba(248,250,252,0), rgba(248,250,252,.96) 32%, #f8fafc) !important; } html[data-theme="light"] #invoiceExtractModal .invoiceExtractModal__note, body.theme-light #invoiceExtractModal .invoiceExtractModal__note{ background:#f8fafc !important; color:#475569 !important; border-color:#dbeafe !important; } @media (max-width:640px){ #invoiceExtractModal .invoiceExtractModal__actions--pro{ position:relative !important; bottom:auto !important; padding-top:0 !important; padding-bottom:0 !important; background:transparent !important; } #invoiceExtractModal .invoiceCameraStage__actions{ position:relative !important; bottom:auto !important; background:transparent !important; } #invoiceExtractModal .invoiceExtractModal__body--pro{padding-bottom:14px !important;} } /* PWA install button */ .pwaInstallBtn{ position:fixed; z-index:9999; left:18px; bottom:18px; border:1px solid rgba(34,197,94,.45); background:linear-gradient(135deg,#16a34a,#22c55e); color:#fff; border-radius:999px; padding:10px 14px; box-shadow:0 14px 30px rgba(22,163,74,.28); font:700 13px/1.6 var(--font, Tahoma, Arial, sans-serif); cursor:pointer; } .pwaInstallBtn[hidden]{display:none!important;} @media (max-width:760px){ .pwaInstallBtn{left:12px;right:12px;bottom:12px;width:auto;text-align:center;} } @media print{.pwaInstallBtn{display:none!important;}} /* v111 - وضعیت اصلی در لیست، نمایش وضعیت واقعی در باکس، برگشت فونت اولیه پروژه */ .jobQueueListTable .jobQRemoteCell{ min-width:150px!important; width:150px!important; } .jobQueueListTable .jobQRemoteCell .jobRemoteManualSelect{ width:150px!important; min-width:150px!important; max-width:150px!important; height:30px!important; min-height:30px!important; font-family:var(--font)!important; font-size:11.25px!important; font-weight:850!important; line-height:1.2!important; padding-inline-start:18px!important; padding-inline-end:18px!important; text-align:center!important; text-align-last:center!important; vertical-align:middle!important; appearance:auto!important; } .jobQueueListTable .jobQRemoteCell small:empty, .jobQueueListTable .jobQRemoteCell small[hidden]{display:none!important;} .jobRemoteManualSelect option{font-family:var(--font)!important;} /* v112 - هم‌راستاسازی باکس‌های وضعیت صف و نمایش وضعیت واقعی به‌جای «وضعیت اصلی» در حالت بسته */ .jobQueueListTable .jobQStatusCell, .jobQueueListTable .jobQRemoteCell{ vertical-align:top!important; padding-top:6px!important; } .jobQueueListTable .jobQStatusCell .jobPill, .jobQueueListTable .jobQRemoteCell .jobRemoteManualSelect{ display:inline-flex!important; align-items:center!important; justify-content:center!important; margin-top:0!important; margin-bottom:0!important; } .jobQueueListTable .jobQStatusCell small, .jobQueueListTable .jobQRemoteCell small{ display:block!important; min-height:12px!important; line-height:12px!important; margin-top:2px!important; } .jobQueueListTable .jobQRemoteCell small:empty, .jobQueueListTable .jobQRemoteCell small[hidden]{ display:block!important; visibility:hidden!important; } .jobQueueListTable .jobQRemoteCell .jobRemoteManualSelect option[data-original-display="1"]{ display:none!important; } /* v113 - رفع خطای HTTP 400 چاپ موبایل: پارامتر auto-print دیگر به bool مستقیم bind نمی‌شود. */ /* v114 - افزودن حالت ارسال با گواهی امضاء در کنار ارسال با کلید خصوصی. */ /* v115 - اصلاح ظاهر تنظیمات ارسال گواهی و حذف ستون کلید/گواهی. */ /* v119 - گواهی فقط از فایل و پیام‌های کاربرپسند اتصال امن */ .certFields--fileOnly .certFileOnly{ display:flex; flex-direction:column; gap:8px; } .certFileOnly__label{ font-weight:800; color:var(--text); } .certFields--fileOnly .certFilePick{ width:100%; box-sizing:border-box; } /* v120 - محدودسازی ارتفاع پنجره اعلان‌ها + بستن با کلیک بیرون */ .wpAnn[hidden]{display:none!important;} .wpAnn:not([hidden]){ display:flex; flex-direction:column; max-height:calc(100vh - 76px); max-height:calc(100dvh - 76px); } .wpAnn__head{ flex:0 0 auto; } .wpAnn__list{ flex:1 1 auto; min-height:0; max-height:calc(100vh - 132px); max-height:calc(100dvh - 132px); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; } .wpAnn__item{ flex:0 0 auto; } .wpAnn__itemMsg{ max-height:min(180px, 28vh); overflow:auto; overflow-wrap:anywhere; word-break:break-word; scrollbar-width:thin; } @media (max-width:640px){ .wpAnn{ left:12px!important; right:12px!important; width:auto!important; max-height:calc(100vh - 74px); max-height:calc(100dvh - 74px); } .wpAnn__list{ max-height:calc(100vh - 130px); max-height:calc(100dvh - 130px); } .wpAnn__itemMsg{max-height:min(150px, 24vh);} } /* v122 - تفکیک اعلانات شخصی از اطلاع‌رسانی عمومی */ .wpAnn__section{ display:flex; flex-direction:column; gap:8px; } .wpAnn__section + .wpAnn__section{ margin-top:10px; padding-top:10px; border-top:1px dashed var(--border); } .wpAnn__sectionHead{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:2px 2px 0; font-size:12px; color:var(--text); } .wpAnn__sectionHead strong{ font-weight:900; } .wpAnn__sectionHead span{ font-size:11px; color:var(--muted); border:1px solid var(--border); border-radius:999px; padding:2px 7px; background:rgba(255,255,255,.04); white-space:nowrap; } .wpAnn__sectionBody{ display:flex; flex-direction:column; gap:8px; } .wpAnn__empty{ color:var(--muted); font-size:12px; padding:8px 10px; border:1px dashed var(--border); border-radius:12px; background:rgba(255,255,255,.03); } /* v123 - Web Push notification toggle */ .wpAnn__pushToggle{ white-space:nowrap; } .wpAnn__pushToggle.is-on{ border-color:rgba(34,197,94,.45); background:rgba(34,197,94,.12); } .wpAnn__pushToggle.is-blocked{ border-color:rgba(239,68,68,.45); background:rgba(239,68,68,.10); } @media (max-width:420px){ .wpAnn__head{align-items:flex-start;} .wpAnn__headActions{flex-wrap:wrap; justify-content:flex-end;} .wpAnn__pushToggle{font-size:10.5px; padding:5px 7px;} } /* v124 - دو بخشی کردن اعلانات / اطلاع‌رسانی و اصلاح متن فعال‌سازی */ .wpAnn__tabs{ display:grid; grid-template-columns:1fr 1fr; gap:6px; margin:8px 10px 0; padding:4px; border:1px solid rgba(var(--accent-rgb),.16); background:rgba(var(--accent-rgb),.055); border-radius:14px; } .wpAnn__tab{ appearance:none; border:0; border-radius:11px; padding:8px 8px; background:transparent; color:var(--muted); font-weight:900; cursor:pointer; font-size:12px; display:flex; align-items:center; justify-content:center; gap:6px; min-width:0; } .wpAnn__tab.is-active{ color:var(--accent); background:rgba(var(--accent-rgb),.14); box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.22); } .wpAnn__tab span:not([hidden]){ min-width:19px; height:19px; padding:0 6px; border-radius:999px; background:rgba(255,80,80,.95); color:#fff; font-size:10.5px; display:inline-flex; align-items:center; justify-content:center; line-height:1; } .wpAnn__sectionBody--active{padding-top:0;} .wpAnn__headActions{min-width:0;} .wpAnn__pushToggle{max-width:150px; overflow:hidden; text-overflow:ellipsis;} @media (max-width:420px){ .wpAnn__tabs{margin-inline:8px;} .wpAnn__tab{font-size:11.5px; padding:7px 6px;} .wpAnn__pushToggle{max-width:128px;} } /* v125 - اسلاید نرم بین اعلانات / اطلاع‌رسانی */ .wpAnn__tabs{ position:relative; overflow:hidden; isolation:isolate; } .wpAnn__tabs::before{ content:""; position:absolute; top:4px; bottom:4px; right:4px; width:calc(50% - 5px); border-radius:11px; background:rgba(var(--accent-rgb),.16); box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.24), 0 8px 18px rgba(37,99,235,.08); transform:translateX(0); transition:transform .24s cubic-bezier(.2,.9,.2,1); z-index:0; } .wpAnn[data-kind="notice"] .wpAnn__tabs::before{ transform:translateX(calc(-100% - 6px)); } .wpAnn__tab{ position:relative; z-index:1; transition:color .18s ease, transform .18s ease; } .wpAnn__tab.is-active{ background:transparent !important; box-shadow:none !important; transform:translateY(-1px); } .wpAnn--modeSwitch .wpAnn__sectionBody--active{ animation:wpAnnPaneSwitch .26s ease both; } @keyframes wpAnnPaneSwitch{ from{opacity:0; transform:translateY(6px) scale(.985);} to{opacity:1; transform:translateY(0) scale(1);} } .wpAnn__pushToggle.is-on{ color:rgb(22,163,74); font-weight:900; } /* v127 - purchase terms acceptance */ .planTermsAccept{ border:1px solid color-mix(in oklab, var(--line) 76%, var(--accent, #7c5cff) 24%); border-radius:16px; padding:10px 12px; background:color-mix(in oklab, var(--panel) 90%, var(--accent, #7c5cff) 10%); } .planTermsAccept__label{ display:flex; align-items:flex-start; gap:10px; cursor:pointer; user-select:none; line-height:1.9; color:var(--text); font-size:12.5px; } .planTermsAccept__label input{ position:absolute; opacity:0; pointer-events:none; } .planTermsAccept__check{ width:22px; height:22px; flex:0 0 22px; border-radius:8px; border:1px solid rgba(148,163,184,.45); background:rgba(255,255,255,.04); position:relative; margin-top:3px; transition:background .16s ease, border-color .16s ease, box-shadow .16s ease; } .planTermsAccept__check::after{ content:""; position:absolute; width:10px; height:6px; border-right:2px solid #fff; border-bottom:2px solid #fff; transform:translate(-50%,-55%) rotate(45deg) scale(.45); left:50%; top:48%; opacity:0; transition:opacity .16s ease, transform .16s ease; } .planTermsAccept__label input:checked + .planTermsAccept__check{ background:color-mix(in oklab, var(--accent, #7c5cff) 78%, #10b981 22%); border-color:color-mix(in oklab, var(--accent, #7c5cff) 82%, #fff 18%); box-shadow:0 0 0 3px color-mix(in oklab, var(--accent, #7c5cff) 20%, transparent); } .planTermsAccept__label input:checked + .planTermsAccept__check::after{ opacity:1; transform:translate(-50%,-55%) rotate(45deg) scale(1); } .planTermsAccept__link{ display:inline; appearance:none; border:0; background:transparent; padding:0; margin:0; color:var(--accent, #7c5cff); font:inherit; font-weight:900; text-decoration:underline; text-underline-offset:3px; cursor:pointer; } .termsModal__panel{ width:min(780px, calc(100vw - 24px)); } .termsModal__body{ max-height:min(72vh, 680px); overflow:auto; line-height:2; } .termsDoc{ display:grid; gap:12px; font-size:13px; } .termsDoc h3{ margin:0; font-size:16px; } .termsDoc h4{ margin:8px 0 0; font-size:13px; color:var(--text); } .termsDoc p, .termsDoc ul{ margin:0; color:var(--muted); } .termsDoc ul{ padding-right:18px; } .termsDoc li{ margin:4px 0; } .termsDoc__notice{ border:1px solid color-mix(in oklab, var(--accent, #7c5cff) 35%, var(--line) 65%); border-radius:14px; padding:10px; background:color-mix(in oklab, var(--panel) 86%, var(--accent, #7c5cff) 14%); color:var(--text) !important; } /* v128 - fixes notification tabs sizing and read-state sync UX */ .wpAnn__tabs{ flex:0 0 auto; grid-template-columns:minmax(0,1fr) minmax(0,1fr); } .wpAnn__tab{ min-height:34px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex-wrap:nowrap; min-width:0; } .wpAnn__tab span:not([hidden]){ flex:0 0 auto; } .wpAnn__headActions{ flex:0 1 auto; min-width:0; } .wpAnn__pushToggle{ flex:0 1 auto; } @media (max-width:420px){ .wpAnn__tabs{gap:5px; padding:4px;} .wpAnn__tabs::before{width:calc(50% - 4.5px);} .wpAnn__tab{font-size:11.5px; min-height:33px; padding-inline:5px; gap:4px;} .wpAnn__tab span:not([hidden]){min-width:18px; height:18px; padding-inline:5px; font-size:10px;} } /* v129: admin plan unlimited limit controls */ .miniCheck{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);margin-top:4px;} .miniCheck input{width:auto !important;min-height:auto !important;margin:0;} .adminPlanEditorCard .field input:disabled{opacity:.72;cursor:not-allowed;background:rgba(148,163,184,.12);} /* v132: subscription expiry/idempotent payment UI refresh */ /* ---------------- v134: light-mode picker/extraction contrast + reliable controls ---------------- */ html[data-theme="light"] #modal[data-picker-kind="buyer"] .modal__panel, html[data-theme="light"] #modal[data-picker-kind="item"] .modal__panel, body.theme-light #modal[data-picker-kind="buyer"] .modal__panel, body.theme-light #modal[data-picker-kind="item"] .modal__panel{ background:#ffffff !important; color:#0f172a !important; border-color:#dbeafe !important; box-shadow:0 24px 80px rgba(15,23,42,.18) !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modal__header, html[data-theme="light"] #modal[data-picker-kind="item"] .modal__header, body.theme-light #modal[data-picker-kind="buyer"] .modal__header, body.theme-light #modal[data-picker-kind="item"] .modal__header{ background:linear-gradient(90deg,#eff6ff,#ffffff) !important; color:#0f172a !important; border-bottom-color:#dbeafe !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modal__header .btn, html[data-theme="light"] #modal[data-picker-kind="item"] .modal__header .btn, body.theme-light #modal[data-picker-kind="buyer"] .modal__header .btn, body.theme-light #modal[data-picker-kind="item"] .modal__header .btn{ background:#ffffff !important; color:#1e3a8a !important; border-color:#bfdbfe !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPickerTable thead th, html[data-theme="light"] #modal[data-picker-kind="item"] .modalPickerTable thead th, body.theme-light #modal[data-picker-kind="buyer"] .modalPickerTable thead th, body.theme-light #modal[data-picker-kind="item"] .modalPickerTable thead th{ background:linear-gradient(180deg,#f8fafc,#eef4ff) !important; color:#475569 !important; box-shadow:0 1px 0 #dbeafe !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPickerTable td, html[data-theme="light"] #modal[data-picker-kind="item"] .modalPickerTable td, body.theme-light #modal[data-picker-kind="buyer"] .modalPickerTable td, body.theme-light #modal[data-picker-kind="item"] .modalPickerTable td{ color:#334155 !important; border-bottom-color:#e5eefc !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPickerTable td b, html[data-theme="light"] #modal[data-picker-kind="item"] .modalPickerTable td b, body.theme-light #modal[data-picker-kind="buyer"] .modalPickerTable td b, body.theme-light #modal[data-picker-kind="item"] .modalPickerTable td b{ color:#0f172a !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPickerTable__row:hover, html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPickerTable__row:focus-visible, html[data-theme="light"] #modal[data-picker-kind="item"] .modalPickerTable__row:hover, html[data-theme="light"] #modal[data-picker-kind="item"] .modalPickerTable__row:focus-visible, body.theme-light #modal[data-picker-kind="buyer"] .modalPickerTable__row:hover, body.theme-light #modal[data-picker-kind="buyer"] .modalPickerTable__row:focus-visible, body.theme-light #modal[data-picker-kind="item"] .modalPickerTable__row:hover, body.theme-light #modal[data-picker-kind="item"] .modalPickerTable__row:focus-visible{ background:#eaf2ff !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .sortHeadBtn, html[data-theme="light"] #modal[data-picker-kind="item"] .sortHeadBtn, body.theme-light #modal[data-picker-kind="buyer"] .sortHeadBtn, body.theme-light #modal[data-picker-kind="item"] .sortHeadBtn{ color:#475569 !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .sortHeadBtn.is-active, html[data-theme="light"] #modal[data-picker-kind="item"] .sortHeadBtn.is-active, body.theme-light #modal[data-picker-kind="buyer"] .sortHeadBtn.is-active, body.theme-light #modal[data-picker-kind="item"] .sortHeadBtn.is-active{ color:#1d4ed8 !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .badge, html[data-theme="light"] #modal[data-picker-kind="item"] .badge, body.theme-light #modal[data-picker-kind="buyer"] .badge, body.theme-light #modal[data-picker-kind="item"] .badge{ color:#1e3a8a !important; background:#eff6ff !important; border-color:#dbeafe !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalPickerPager .pager, html[data-theme="light"] #modal[data-picker-kind="item"] .modalPickerPager .pager, body.theme-light #modal[data-picker-kind="buyer"] .modalPickerPager .pager, body.theme-light #modal[data-picker-kind="item"] .modalPickerPager .pager{ color:#334155 !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .pager__btn, html[data-theme="light"] #modal[data-picker-kind="item"] .pager__btn, body.theme-light #modal[data-picker-kind="buyer"] .pager__btn, body.theme-light #modal[data-picker-kind="item"] .pager__btn{ background:#ffffff !important; color:#1e3a8a !important; border-color:#dbeafe !important; } html[data-theme="light"] #modal[data-picker-kind="buyer"] .pager__btn:disabled, html[data-theme="light"] #modal[data-picker-kind="item"] .pager__btn:disabled, body.theme-light #modal[data-picker-kind="buyer"] .pager__btn:disabled, body.theme-light #modal[data-picker-kind="item"] .pager__btn:disabled{ color:#94a3b8 !important; background:#f8fafc !important; } html[data-theme="light"] #invoiceExtractModal .invoiceExtractModal__header--pro, body.theme-light #invoiceExtractModal .invoiceExtractModal__header--pro{ background:linear-gradient(90deg,#eff6ff,#ffffff) !important; border-bottom-color:#dbeafe !important; } html[data-theme="light"] #invoiceExtractModal .invoiceExtractModal__title, body.theme-light #invoiceExtractModal .invoiceExtractModal__title{ color:#0f172a !important; } html[data-theme="light"] #invoiceExtractModal .invoiceExtractModal__subtitle, body.theme-light #invoiceExtractModal .invoiceExtractModal__subtitle{ color:#475569 !important; } html[data-theme="light"] #invoiceExtractModal .invoiceExtractModal__beta, body.theme-light #invoiceExtractModal .invoiceExtractModal__beta{ color:#1d4ed8 !important; background:#dbeafe !important; border-color:#93c5fd !important; opacity:1 !important; } html[data-theme="light"] #invoiceExtractModal .invoiceExtractSteps b, body.theme-light #invoiceExtractModal .invoiceExtractSteps b, html[data-theme="light"] #invoiceExtractModal .invoiceExtractHero__icon, body.theme-light #invoiceExtractModal .invoiceExtractHero__icon{ color:#1d4ed8 !important; background:#dbeafe !important; border-color:#93c5fd !important; } html[data-theme="light"] #invoiceExtractModal .invoiceExtractModal__close.iconbtn, body.theme-light #invoiceExtractModal .invoiceExtractModal__close.iconbtn{ color:#334155 !important; background:#f1f5f9 !important; border-color:#cbd5e1 !important; } html[data-theme="light"] #invoiceExtractModal .invoiceExtractModal__actions--pro, body.theme-light #invoiceExtractModal .invoiceExtractModal__actions--pro{ background:linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.94) 30%, #ffffff) !important; } html[data-theme="light"] #invoiceExtractModal .invoiceCameraStage__actions, body.theme-light #invoiceExtractModal .invoiceCameraStage__actions{ background:linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.94) 30%, #ffffff) !important; } html[data-theme="light"] #invoiceExtractModal .invoiceExtractModal__note, body.theme-light #invoiceExtractModal .invoiceExtractModal__note{ color:#475569 !important; background:#f8fafc !important; border-color:#dbeafe !important; } html[data-theme="light"] #invoiceExtractModal .invoiceExtractField:has(input:checked), body.theme-light #invoiceExtractModal .invoiceExtractField:has(input:checked){ color:#1e3a8a !important; background:#eff6ff !important; border-color:#93c5fd !important; } /* ---------------- v135: picker new button + mobile tap reliability ---------------- */ #modalNew[hidden]{display:none !important;} #modal[data-picker-kind="buyer"] .listToolbar--modalPicker, #modal[data-picker-kind="item"] .listToolbar--modalPicker{ grid-template-columns:minmax(0,1fr) 190px 96px 136px !important; } #modal[data-picker-kind="buyer"] .modalNewBtn, #modal[data-picker-kind="item"] .modalNewBtn{ width:100% !important; min-width:0 !important; height:42px !important; border-radius:13px !important; white-space:nowrap !important; color:#bfdbfe !important; border-color:rgba(96,165,250,.38) !important; background:rgba(96,165,250,.10) !important; } #modal[data-picker-kind="buyer"] .modalNewBtn:hover, #modal[data-picker-kind="item"] .modalNewBtn:hover{ background:rgba(96,165,250,.18) !important; } #btnBuyerPick, #btnBuyerLookup, button[data-act="pickItem"]{ touch-action:manipulation; -webkit-tap-highlight-color:transparent; } #modal[data-picker-kind="buyer"] .modalPickerTable__row, #modal[data-picker-kind="item"] .modalPickerTable__row{ touch-action:pan-x pan-y; -webkit-tap-highlight-color:rgba(96,165,250,.12); } html[data-theme="light"] #modal[data-picker-kind="buyer"] .modalNewBtn, html[data-theme="light"] #modal[data-picker-kind="item"] .modalNewBtn, body.theme-light #modal[data-picker-kind="buyer"] .modalNewBtn, body.theme-light #modal[data-picker-kind="item"] .modalNewBtn{ color:#1e3a8a !important; background:#eff6ff !important; border-color:#bfdbfe !important; } @media(max-width:720px){ #modal[data-picker-kind="buyer"] .listToolbar--modalPicker, #modal[data-picker-kind="item"] .listToolbar--modalPicker{ grid-template-columns:minmax(0,1fr) minmax(104px,118px) !important; gap:8px !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__search, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__search{ grid-column:1 / -1 !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__sort, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__sort{ grid-column:1 !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker #modalRefresh, #modal[data-picker-kind="item"] .listToolbar--modalPicker #modalRefresh{ grid-column:2 !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker #modalNew, #modal[data-picker-kind="item"] .listToolbar--modalPicker #modalNew{ grid-column:1 / -1 !important; width:100% !important; } } /* ---------------- v136: picker reliability + easier find buttons ---------------- */ #btnBuyerPick, #btnBuyerLookup, button[data-act="pickItem"]{ min-height:44px !important; min-width:58px !important; padding-inline:14px !important; border-radius:14px !important; position:relative; z-index:2; cursor:pointer; user-select:none; -webkit-user-select:none; touch-action:manipulation; -webkit-tap-highlight-color:transparent; } .page--send .inAffix--buyer > .inAffix__btn, .page--send .lineTitlePick > .inAffix__btn{ box-shadow:0 8px 18px rgba(37,99,235,.12); } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker, #modal[data-picker-kind="item"] .listToolbar--modalPicker{ align-items:end !important; } #modal[data-picker-kind="buyer"] .modalSortForm select, #modal[data-picker-kind="item"] .modalSortForm select, #modal[data-picker-kind="buyer"] #modalSearch, #modal[data-picker-kind="item"] #modalSearch{ min-height:42px; } #modal[data-picker-kind="buyer"] .modalPickerTable__row, #modal[data-picker-kind="item"] .modalPickerTable__row{ cursor:pointer; } @media(max-width:720px){ #btnBuyerLookup, .page--send .lineTitlePick > .inAffix__btn, button[data-act="pickItem"]{ min-height:48px !important; min-width:72px !important; font-size:13px !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker, #modal[data-picker-kind="item"] .listToolbar--modalPicker{ gap:10px !important; } #modal[data-picker-kind="buyer"] .listToolbar--modalPicker .listToolbar__sort, #modal[data-picker-kind="item"] .listToolbar--modalPicker .listToolbar__sort{ margin-top:2px !important; } } /* ---------------- v137: buyer picker buttons + admin monitor polish ---------------- */ .page--send .buyerCodeControl{ display:grid !important; grid-template-columns:minmax(0, 1fr) 78px 68px; gap:8px; align-items:center; width:100%; min-width:0; direction:rtl; } .page--send .buyerCodeControl > input, .page--send .buyerCodeControl #buyerCode{ width:100% !important; min-width:0 !important; height:44px !important; min-height:44px !important; padding:0 14px !important; border-radius:16px !important; direction:ltr !important; text-align:left !important; unicode-bidi:plaintext !important; } .page--send .buyerCodeControl > input::placeholder, .page--send .buyerCodeControl #buyerCode::placeholder{ direction:rtl !important; text-align:right !important; } .page--send .buyerCodeControl__find, .page--send .buyerCodeControl__clear, .page--send #btnBuyerLookup, .page--send #btnBuyerClear{ position:static !important; inset:auto !important; transform:none !important; width:100% !important; min-width:0 !important; height:44px !important; min-height:44px !important; padding:0 10px !important; border-radius:15px !important; font-size:13px !important; font-weight:900 !important; line-height:1 !important; z-index:4 !important; white-space:nowrap !important; touch-action:manipulation; -webkit-tap-highlight-color:transparent; } .page--send .buyerCodeControl__find, .page--send #btnBuyerLookup{ box-shadow:0 10px 22px rgba(37,99,235,.16) !important; } .page--send .buyerRow__code, .page--send .invSend--v2 .invHeadCol--buyer .buyerRow__code{ width:100% !important; min-width:0 !important; } .page--send .buyerRow__code label{ width:100%; } #modal.modal--inputGuard .modal__panel{ pointer-events:none !important; } #modal.modal--inputGuard [data-close]{ pointer-events:auto !important; } @media(max-width:720px){ .page--send .buyerCodeControl{ grid-template-columns:minmax(0, 1fr) 74px 64px; gap:7px; } .page--send .buyerCodeControl__find, .page--send .buyerCodeControl__clear, .page--send #btnBuyerLookup, .page--send #btnBuyerClear{ height:46px !important; min-height:46px !important; font-size:13px !important; padding:0 8px !important; } .page--send .buyerCodeControl > input, .page--send .buyerCodeControl #buyerCode{ height:46px !important; min-height:46px !important; } } @media(max-width:420px){ .page--send .buyerCodeControl{ grid-template-columns:minmax(0, 1fr) 68px 58px; gap:6px; } .page--send .buyerCodeControl__find, .page--send .buyerCodeControl__clear, .page--send #btnBuyerLookup, .page--send #btnBuyerClear{ font-size:12px !important; padding:0 6px !important; } } /* v139: official Tax System goods/service catalog search */ .inputAction--moadian{display:flex;gap:6px;align-items:center;} .inputAction--moadian input{min-width:0;flex:1;} .inputAction--moadian .inputAction__btn{height:38px;white-space:nowrap;padding-inline:10px;} .itemMoadianLookupField{min-width:0;} .taxCatalogAdminBox{margin-top:14px;padding:14px;border:1px solid var(--border);border-radius:16px;background:rgba(255,255,255,.04);} .taxCatalogAdminBox__head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;} .taxCatalogAdminBox__head h3{margin:0 0 4px;font-size:15px;} .taxCatalogAdminBox__actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;} .taxCatalogAdminBox__serverPath{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;margin-top:10px;} .taxCatalogLookupPanel{max-width:min(1040px,96vw);} .taxCatalogLookupBody{display:flex;flex-direction:column;gap:10px;} .taxCatalogSearchBar{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;} .taxCatalogSearchBar label{display:flex;flex-direction:column;gap:6px;} .taxCatalogResults{min-height:180px;} .taxCatalogTable td{vertical-align:top;} .taxCatalogTable td:nth-child(2){min-width:320px;} html[data-theme="light"] .taxCatalogAdminBox{background:#fff;border-color:#dbe4f0;} @media (max-width: 720px){ .inputAction--moadian{align-items:stretch;} .inputAction--moadian .inputAction__btn{height:auto;min-height:40px;} .taxCatalogSearchBar{grid-template-columns:1fr;} .taxCatalogAdminBox__serverPath{grid-template-columns:1fr;} .taxCatalogLookupPanel{max-width:96vw;} .taxCatalogTable td:nth-child(2){min-width:220px;} } /* v140: fixed tax catalog import folder + product form and picker button polish */ .itemTitleField, .itemCodeField, .itemMoadianLookupField{min-width:0;} .inputAction--moadian{ position:relative !important; display:block !important; width:100% !important; } .inputAction--moadian input{ width:100% !important; min-width:0 !important; padding-inline-end:86px !important; } .inputAction--moadian .inputAction__btn{ position:absolute !important; inset-inline-end:6px !important; top:50% !important; transform:translateY(-50%) !important; height:30px !important; min-height:30px !important; padding:0 12px !important; border-radius:12px !important; font-size:12px !important; line-height:1 !important; z-index:2 !important; } .taxCatalogAdminBox__fixedFolder{ display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:10px; align-items:center; margin-top:10px; padding:10px; border:1px dashed var(--border); border-radius:14px; background:rgba(255,255,255,.035); } .taxCatalogDefaultPath{display:flex;flex-direction:column;gap:5px;min-width:0;} .taxCatalogDefaultPath span{font-size:12px;font-weight:900;color:var(--text);} .taxCatalogDefaultPath code{ display:inline-block; width:max-content; max-width:100%; overflow:auto; padding:5px 8px; border-radius:10px; border:1px solid var(--border); background:rgba(15,23,42,.16); font-size:12px; } .taxCatalogDefaultPath small{color:var(--muted);line-height:1.85;} html[data-theme="light"] .taxCatalogAdminBox__fixedFolder, body.theme-light .taxCatalogAdminBox__fixedFolder{background:#f8fafc;border-color:#dbe4f0;} html[data-theme="light"] .taxCatalogDefaultPath code, body.theme-light .taxCatalogDefaultPath code{background:#eef4ff;border-color:#d7e3f5;color:#0f172a;} .page--send .buyerCodeControl__find, .page--send .buyerCodeControl__clear, .page--send #btnBuyerLookup, .page--send #btnBuyerClear{ height:34px !important; min-height:34px !important; align-self:center !important; border-radius:12px !important; padding:0 9px !important; } @media(max-width:720px){ .taxCatalogAdminBox__fixedFolder{grid-template-columns:1fr;align-items:stretch;} .inputAction--moadian input{padding-inline-end:82px !important;} .inputAction--moadian .inputAction__btn{height:32px !important;min-height:32px !important;} .page--send .buyerCodeControl__find, .page--send .buyerCodeControl__clear, .page--send #btnBuyerLookup, .page--send #btnBuyerClear{ height:36px !important; min-height:36px !important; } } @media(max-width:420px){ .inputAction--moadian input{padding-inline-end:76px !important;} .inputAction--moadian .inputAction__btn{padding:0 9px !important;font-size:11.5px !important;} } /* v141: restore buyer find/clear button height; only compact the item-row find button */ .page--send .buyerCodeControl__find, .page--send .buyerCodeControl__clear, .page--send #btnBuyerLookup, .page--send #btnBuyerClear{ height:44px !important; min-height:44px !important; border-radius:15px !important; padding:0 10px !important; } @media(max-width:720px){ .page--send .buyerCodeControl__find, .page--send .buyerCodeControl__clear, .page--send #btnBuyerLookup, .page--send #btnBuyerClear{ height:46px !important; min-height:46px !important; padding:0 8px !important; } } .page--send .lineTitlePick > .inAffix__btn, .page--send .lineTitlePick > button[data-act="pickItem"]{ height:32px !important; min-height:32px !important; min-width:54px !important; padding:0 9px !important; border-radius:11px !important; font-size:12px !important; top:50% !important; transform:translateY(-50%) !important; align-self:center !important; } @media(max-width:720px){ .page--send .lineTitlePick > .inAffix__btn, .page--send .lineTitlePick > button[data-act="pickItem"]{ height:34px !important; min-height:34px !important; min-width:58px !important; } } .taxCatalogAiBar{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:end; padding:10px; border:1px solid var(--border); border-radius:14px; background:rgba(96,165,250,.07); } .taxCatalogAiBar label{display:flex;flex-direction:column;gap:6px;} .taxCatalogAiBar .taxCatalogAiHint{font-size:11px;color:var(--muted);line-height:1.7;margin-top:3px;} .taxCatalogSmartBadge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 8px;background:rgba(96,165,250,.13);color:#bfdbfe;font-size:11px;font-weight:900;} html[data-theme="light"] .taxCatalogAiBar, body.theme-light .taxCatalogAiBar{background:#f0f7ff;border-color:#cfe0f7;} html[data-theme="light"] .taxCatalogSmartBadge, body.theme-light .taxCatalogSmartBadge{background:#dbeafe;color:#1e3a8a;} @media(max-width:720px){ .taxCatalogAiBar{grid-template-columns:1fr;} } /* v142: compact tax catalog smart search buttons */ .taxCatalogSearchBar--smart{grid-template-columns:minmax(0,1fr) auto !important;align-items:end;} .taxCatalogSearchActions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;} .taxCatalogSearchActions .btn{min-height:40px;white-space:nowrap;} .taxCatalogSmartBtn{ position:relative; overflow:hidden; border:1px solid rgba(96,165,250,.42) !important; background:linear-gradient(135deg, rgba(59,130,246,.95), rgba(14,165,233,.92)) !important; color:#fff !important; box-shadow:0 12px 28px rgba(37,99,235,.22); font-weight:950; } .taxCatalogSmartBtn::after{ content:""; position:absolute; inset:-50%; background:linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent); transform:translateX(-70%) rotate(18deg); animation:taxCatalogSmartSweep 2.8s linear infinite; pointer-events:none; } @keyframes taxCatalogSmartSweep{to{transform:translateX(70%) rotate(18deg);}} @media(max-width:720px){ .taxCatalogSearchBar--smart{grid-template-columns:1fr !important;} .taxCatalogSearchActions{display:grid;grid-template-columns:1fr 1fr;width:100%;} .taxCatalogSearchActions .btn{width:100%;} } /* v143: tax catalog filters */ .taxCatalogFilters{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:10px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.035); } .taxCatalogFilters label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:900;color:var(--muted);} .taxCatalogFilters select{ width:100%; min-height:40px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); padding:0 10px; font-weight:900; } html[data-theme="light"] .taxCatalogFilters, body.theme-light .taxCatalogFilters{background:#f8fafc;border-color:#dbe4f0;} html[data-theme="light"] .taxCatalogFilters select, body.theme-light .taxCatalogFilters select{background:#fff;color:#0f172a;border-color:#cbd5e1;} @media(max-width:900px){.taxCatalogFilters{grid-template-columns:repeat(2,minmax(0,1fr));}} @media(max-width:520px){.taxCatalogFilters{grid-template-columns:1fr;}} /* v144: tax catalog smart button like extract button + safe 5M pagination */ .taxCatalogSmartBtn{ position:relative !important; isolation:isolate !important; overflow:visible !important; border:1px solid rgba(var(--accent-rgb),.32) !important; background:linear-gradient(180deg, rgba(15,23,42,.92), rgba(15,23,42,.74)) !important; color:#dbeafe !important; box-shadow:0 0 0 1px rgba(var(--accent-rgb),.08), 0 8px 18px rgba(var(--accent-rgb),.13) !important; font-weight:950 !important; } .taxCatalogSmartBtn::before{ content:"" !important; display:block !important; position:absolute !important; inset:-2px !important; z-index:-1 !important; border-radius:calc(var(--radius-lg, 16px) + 2px) !important; padding:2px !important; background:conic-gradient( from var(--invoice-extract-angle, 0deg), rgba(var(--accent-rgb),.08), rgba(37,99,235,.95), rgba(14,165,233,.65), rgba(var(--accent-rgb),.08) ) !important; -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important; -webkit-mask-composite:xor !important; mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important; mask-composite:exclude !important; pointer-events:none !important; animation:invoiceExtractOrbitRing 2.65s linear infinite !important; } .taxCatalogSmartBtn::after{display:none !important;content:none !important;} html[data-theme="light"] .taxCatalogSmartBtn, body.theme-light .taxCatalogSmartBtn{ background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.94)) !important; color:#1e3a8a !important; border-color:rgba(var(--accent-rgb),.34) !important; } .taxCatalogPager{ display:flex; align-items:center; justify-content:center; gap:10px; padding:10px 0 2px; color:var(--muted); font-size:12px; font-weight:900; } .taxCatalogPager .btn[disabled]{opacity:.45;cursor:not-allowed;filter:grayscale(.15);} @media (prefers-reduced-motion: reduce){ .taxCatalogSmartBtn::before{animation:none !important;} } /* v145: tax catalog counted pagination + quieter smart button */ .taxCatalogResultCount{ text-align:center; color:var(--muted); font-size:12px; font-weight:900; padding:2px 0 10px; } .taxCatalogSmartBadge{gap:0;} .taxCatalogSmartBtn{white-space:nowrap;} /* v145: keep tax catalog modal above notification bell on mobile */ .taxCatalogLookupModal{z-index:180 !important;} body.tax-catalog-modal-open .annBell, body.tax-catalog-modal-open .wpAnn{display:none !important;} .taxCatalogLookupModal .modal__header{position:sticky;top:0;z-index:4;} /* v149: simplified tax catalog server-folder import UI */ .taxCatalogLookupModal .modal__header{ background:linear-gradient(180deg, rgba(15,23,42,.96), rgba(15,23,42,.88)); backdrop-filter:blur(10px); } .taxCatalogLookupModal .modal__header > div:first-child{ font-weight:950; color:var(--text); } .taxCatalogCloseBtn{ min-height:36px !important; height:36px !important; padding:0 16px !important; border-radius:14px !important; border:1px solid rgba(var(--accent-rgb),.32) !important; background:rgba(var(--accent-rgb),.10) !important; color:#dbeafe !important; font-weight:950 !important; box-shadow:0 8px 18px rgba(15,23,42,.18) !important; } .taxCatalogCloseBtn:hover{ background:rgba(var(--accent-rgb),.18) !important; transform:translateY(-1px); } html[data-theme="light"] .taxCatalogLookupModal .modal__header, body.theme-light .taxCatalogLookupModal .modal__header{ background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.94)); } html[data-theme="light"] .taxCatalogCloseBtn, body.theme-light .taxCatalogCloseBtn{ background:#eef4ff !important; color:#1e3a8a !important; border-color:#bfd5ff !important; box-shadow:0 8px 18px rgba(37,99,235,.10) !important; } .taxCatalogPickRow{cursor:pointer;transition:background .15s ease, transform .15s ease;} .taxCatalogPickRow:hover{background:rgba(var(--accent-rgb),.08);} .taxCatalogPickRow:active{transform:scale(.998);} html[data-theme="light"] .taxCatalogPickRow:hover, body.theme-light .taxCatalogPickRow:hover{background:#eff6ff;} @media(max-width:720px){ .taxCatalogCloseBtn{min-height:38px !important;height:38px !important;padding:0 14px !important;} } /* v149: simplified tax catalog server-folder import UI */ .taxCatalogAdminBox__fixedFolder--simple { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; } .taxCatalogAdminBox__actions--compact { margin-top: 10px; align-items: center; } @media (max-width: 640px) { .taxCatalogAdminBox__fixedFolder--simple, .taxCatalogAdminBox__actions--compact { align-items: stretch; } .taxCatalogAdminBox__actions--compact .btn { width: 100%; } } /* v156: only identifier-type filter is multi-select; other filters remain simple */ .taxCatalogMultiFilter{position:relative;} .taxCatalogMultiToggle{ width:100%; min-height:40px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); padding:0 10px; font-weight:950; text-align:right; cursor:pointer; } .taxCatalogMultiToggle::after{ content:"⌄"; float:left; color:var(--muted); font-weight:950; } .taxCatalogMultiMenu{ position:absolute; inset-inline:0; top:calc(100% + 6px); z-index:9; max-height:230px; overflow:auto; border:1px solid var(--border); border-radius:14px; background:var(--surface); padding:8px; box-shadow:0 18px 45px rgba(0,0,0,.28); } .taxCatalogMultiMenu label{ display:flex !important; flex-direction:row !important; align-items:center; gap:8px !important; min-height:34px; padding:6px 8px; border-radius:10px; color:var(--text) !important; cursor:pointer; } .taxCatalogMultiMenu label:hover{background:rgba(var(--accent-rgb),.09);} .taxCatalogMultiMenu input{width:16px;height:16px;accent-color:rgb(var(--accent-rgb));} html[data-theme="light"] .taxCatalogMultiToggle, body.theme-light .taxCatalogMultiToggle, html[data-theme="light"] .taxCatalogMultiMenu, body.theme-light .taxCatalogMultiMenu{background:#fff;color:#0f172a;border-color:#cbd5e1;} .taxCatalogToolbar{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; padding:8px 10px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.025); } .taxCatalogToolbar label{ display:flex; align-items:center; gap:8px; color:var(--muted); font-size:12px; font-weight:900; } .taxCatalogToolbar select{ min-height:36px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); padding:0 10px; font-weight:950; } .taxCatalogPager{flex-wrap:wrap;} .taxCatalogPager__pages{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:6px; } .taxCatalogPager__num{ min-width:34px; padding-inline:9px !important; } .taxCatalogPager__num--active{ background:rgba(var(--accent-rgb),.18) !important; border-color:rgba(var(--accent-rgb),.38) !important; color:var(--text) !important; opacity:1 !important; } .taxCatalogPager__dots{color:var(--muted);font-weight:950;padding:0 2px;} html[data-theme="light"] .taxCatalogToolbar, body.theme-light .taxCatalogToolbar{background:#f8fafc;border-color:#dbe4f0;} html[data-theme="light"] .taxCatalogToolbar select, body.theme-light .taxCatalogToolbar select{background:#fff;color:#0f172a;border-color:#cbd5e1;} @media(max-width:520px){ .taxCatalogToolbar{align-items:stretch;} .taxCatalogToolbar label{width:100%;justify-content:space-between;} .taxCatalogToolbar select{min-width:94px;} } @media(max-width:520px){ .taxCatalogMultiFilter{position:relative;} .taxCatalogMultiMenu{position:relative;top:auto;margin-top:6px;max-height:190px;} } /* v155: smarter official tax-catalog ranking + AI suggestion feeling */ .taxCatalogSearchLoading, .taxCatalogAiThinking{ display:flex; align-items:center; gap:12px; padding:16px; border:1px solid var(--border); border-radius:16px; background:rgba(var(--accent-rgb),.06); color:var(--text); } .taxCatalogSearchLoading{flex-direction:column;align-items:flex-start;gap:6px;} .taxCatalogSearchLoading strong, .taxCatalogAiThinking strong{font-weight:950;} .taxCatalogSearchLoading span, .taxCatalogAiThinking span{display:block;color:var(--muted);font-size:12px;font-weight:800;line-height:1.8;margin-top:3px;} .taxCatalogAiThinking__icon{ flex:0 0 48px; width:48px; height:48px; border-radius:16px; display:grid; place-items:center; font-weight:950; color:#dbeafe; background:linear-gradient(135deg, rgba(37,99,235,.95), rgba(14,165,233,.82)); box-shadow:0 12px 24px rgba(37,99,235,.22); position:relative; overflow:hidden; } .taxCatalogAiThinking__icon::after{ content:""; position:absolute; inset:-40%; background:linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent); transform:translateX(-70%) rotate(18deg); animation:taxCatalogSmartSweep 1.7s linear infinite; } .taxCatalogAiNote{ margin:0 0 8px; padding:10px 12px; border:1px solid rgba(var(--accent-rgb),.20); border-radius:14px; background:rgba(var(--accent-rgb),.07); color:var(--text); font-size:12px; font-weight:900; line-height:1.8; } .taxCatalogReason{ display:inline-flex; margin-top:6px; padding:2px 8px; border-radius:999px; background:rgba(34,197,94,.12); color:#86efac; border:1px solid rgba(34,197,94,.22); font-size:11px; font-weight:950; } html[data-theme="light"] .taxCatalogSearchLoading, body.theme-light .taxCatalogSearchLoading, html[data-theme="light"] .taxCatalogAiThinking, body.theme-light .taxCatalogAiThinking, html[data-theme="light"] .taxCatalogAiNote, body.theme-light .taxCatalogAiNote{background:#f0f7ff;border-color:#cfe0f7;color:#0f172a;} html[data-theme="light"] .taxCatalogReason, body.theme-light .taxCatalogReason{background:#dcfce7;color:#166534;border-color:#bbf7d0;} @media(max-width:520px){.taxCatalogAiThinking{align-items:flex-start}.taxCatalogAiThinking__icon{width:42px;height:42px;flex-basis:42px;border-radius:14px;}} /* v160: هماهنگ‌سازی قطعی فیلتر چندانتخابی «نوع شناسه» با select های کناری */ .taxCatalogFilters .taxCatalogMultiFilter{ position:relative; } .taxCatalogFilters select, .taxCatalogFilters .taxCatalogMultiToggle{ width:100%; height:42px; min-height:42px; box-sizing:border-box; border-radius:14px; border:1px solid rgba(148,163,184,.24) !important; background:linear-gradient(180deg, rgba(30,41,59,.92), rgba(15,23,42,.86)) !important; color:var(--text) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.055) !important; opacity:1 !important; } .taxCatalogFilters select{ padding:0 12px !important; font-weight:900; } .taxCatalogFilters .taxCatalogMultiToggle{ position:relative; display:flex; align-items:center; justify-content:flex-start; padding:0 36px 0 12px !important; font-family:inherit; font-size:inherit; font-weight:900; line-height:1.2; text-align:right; direction:rtl; cursor:pointer; appearance:none; -webkit-appearance:none; } .taxCatalogFilters .taxCatalogMultiToggle:hover, .taxCatalogFilters select:hover{ border-color:rgba(148,163,184,.34) !important; } .taxCatalogFilters .taxCatalogMultiToggle:focus, .taxCatalogFilters select:focus{ outline:none; border-color:rgba(79,140,255,.55) !important; box-shadow:0 0 0 3px rgba(79,140,255,.16), inset 0 1px 0 rgba(255,255,255,.06) !important; } .taxCatalogFilters .taxCatalogMultiToggle::after{ content:"⌄"; position:absolute; inset-inline-start:12px; top:50%; transform:translateY(-50%); color:var(--muted); font-size:16px; font-weight:950; line-height:1; pointer-events:none; } .taxCatalogFilters .taxCatalogMultiMenu{ position:absolute; inset-inline:0; top:calc(100% + 8px); z-index:80; max-height:230px; overflow:auto; border:1px solid rgba(148,163,184,.24) !important; border-radius:16px; background:#101a2f !important; color:var(--text) !important; padding:8px; box-sizing:border-box; box-shadow:0 22px 54px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.05) !important; opacity:1 !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } .taxCatalogFilters .taxCatalogMultiMenu[hidden]{ display:none !important; } .taxCatalogFilters .taxCatalogMultiMenu label{ color:var(--text) !important; background:transparent !important; border:0 !important; box-shadow:none !important; } .taxCatalogFilters .taxCatalogMultiMenu label:hover{ background:rgba(var(--accent-rgb),.11) !important; } html[data-theme="light"] .taxCatalogFilters select, body.theme-light .taxCatalogFilters select, html[data-theme="light"] .taxCatalogFilters .taxCatalogMultiToggle, body.theme-light .taxCatalogFilters .taxCatalogMultiToggle{ background:#fff !important; color:#0f172a !important; border-color:#cbd5e1 !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.9) !important; } html[data-theme="light"] .taxCatalogFilters .taxCatalogMultiMenu, body.theme-light .taxCatalogFilters .taxCatalogMultiMenu{ background:#fff !important; color:#0f172a !important; border-color:#cbd5e1 !important; box-shadow:0 18px 42px rgba(15,23,42,.16) !important; } /* ---------------- v162: customer voice fill smart button + permission polish ---------------- */ .customerEditCard{ position:relative; } .customerVoiceSlot{ position:absolute; top:12px; left:16px; z-index:4; display:flex; align-items:center; justify-content:flex-start; pointer-events:none; } .customerVoiceSmartBtn{ pointer-events:auto; min-height:44px !important; padding:10px 18px !important; border-radius:20px !important; font-weight:950 !important; line-height:1 !important; gap:8px !important; } .customerVoiceSmartBtn .voiceFillBtn__text{ font-size:14px; line-height:1; } .customerVoiceSmartBtn .voiceFillBtn__timer{ min-width:28px; height:28px; padding:0 6px; border-radius:999px; background:rgba(var(--accent-rgb),.16); display:inline-flex; align-items:center; justify-content:center; font-size:12px; line-height:1; } .customerVoiceSmartBtn.is-recording{ border-color:rgba(248,113,113,.72) !important; color:#fee2e2 !important; box-shadow:0 0 0 1px rgba(239,68,68,.16), 0 10px 24px rgba(239,68,68,.18) !important; animation:voicePulse 1.2s ease-in-out infinite; } .customerVoiceSmartBtn.is-recording::before{ background:conic-gradient( from var(--invoice-extract-angle, 0deg), rgba(239,68,68,.10), rgba(239,68,68,.95), rgba(248,113,113,.70), rgba(239,68,68,.10) ) !important; } @keyframes voicePulse{ 0%{box-shadow:0 0 0 0 rgba(239,68,68,.28), 0 10px 24px rgba(239,68,68,.16)} 70%{box-shadow:0 0 0 10px rgba(239,68,68,0), 0 10px 24px rgba(239,68,68,.22)} 100%{box-shadow:0 0 0 0 rgba(239,68,68,0), 0 10px 24px rgba(239,68,68,.16)} } @media (max-width:640px){ .customerVoiceSlot{ top:10px; left:12px; } .customerVoiceSmartBtn{ min-height:40px !important; padding:9px 14px !important; border-radius:18px !important; } .customerVoiceSmartBtn .voiceFillBtn__text{ font-size:13px; } } /* ---------------- v163: circular customer voice mic + Web Speech start fix ---------------- */ .customerVoiceSlot{ top:10px !important; left:18px !important; } .customerVoiceSmartBtn{ width:56px !important; min-width:56px !important; height:56px !important; min-height:56px !important; padding:0 !important; border-radius:999px !important; display:grid !important; place-items:center !important; overflow:visible !important; } .customerVoiceSmartBtn::before{ border-radius:999px !important; } .customerVoiceSmartBtn .voiceFillBtn__icon{ width:28px; height:28px; display:grid; place-items:center; color:currentColor; position:relative; z-index:1; } .customerVoiceSmartBtn .voiceFillBtn__icon svg{ width:26px; height:26px; display:block; fill:none; stroke:currentColor; stroke-width:2.15; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 6px 10px rgba(37,99,235,.20)); } .customerVoiceSmartBtn .voiceFillBtn__text{ position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; } .customerVoiceSmartBtn .voiceFillBtn__timer{ position:absolute; right:-6px; bottom:-6px; z-index:2; min-width:27px !important; height:27px !important; padding:0 6px !important; border-radius:999px !important; background:rgba(15,23,42,.94) !important; border:1px solid rgba(var(--accent-rgb),.38); color:#dbeafe; box-shadow:0 8px 18px rgba(0,0,0,.25); } .customerVoiceSmartBtn.is-recording .voiceFillBtn__icon svg{ animation:voiceMicNudge .9s ease-in-out infinite; } @keyframes voiceMicNudge{ 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-1px) scale(1.05)} } html[data-theme="light"] .customerVoiceSmartBtn .voiceFillBtn__timer, body.theme-light .customerVoiceSmartBtn .voiceFillBtn__timer{ background:#fff !important; color:#1e3a8a; border-color:#bfd5ff; box-shadow:0 8px 18px rgba(37,99,235,.14); } @media (max-width:640px){ .customerVoiceSlot{ top:8px !important; left:12px !important; } .customerVoiceSmartBtn{ width:50px !important; min-width:50px !important; height:50px !important; min-height:50px !important; } .customerVoiceSmartBtn .voiceFillBtn__icon{width:25px;height:25px;} .customerVoiceSmartBtn .voiceFillBtn__icon svg{width:24px;height:24px;} } .customerVoiceSmartBtn .voiceFillBtn__timer[hidden]{display:none !important;} /* ---------------- v164: smaller customer voice mic icon ---------------- */ .customerVoiceSmartBtn .voiceFillBtn__icon{ width:22px !important; height:22px !important; } .customerVoiceSmartBtn .voiceFillBtn__icon svg{ width:20px !important; height:20px !important; stroke-width:2 !important; } @media (max-width:640px){ .customerVoiceSmartBtn .voiceFillBtn__icon{ width:20px !important; height:20px !important; } .customerVoiceSmartBtn .voiceFillBtn__icon svg{ width:18px !important; height:18px !important; } } /* ---------------- v165: allow server microphone policy + smaller mic glyph ---------------- */ .customerVoiceSmartBtn .voiceFillBtn__icon{ width:19px !important; height:19px !important; } .customerVoiceSmartBtn .voiceFillBtn__icon svg{ width:17px !important; height:17px !important; stroke-width:1.9 !important; } @media (max-width:640px){ .customerVoiceSmartBtn .voiceFillBtn__icon{ width:17px !important; height:17px !important; } .customerVoiceSmartBtn .voiceFillBtn__icon svg{ width:15px !important; height:15px !important; } } /* ---------------- v166: smaller customer voice circle + inline voice guide ---------------- */ .customerVoiceSlot{ top:12px !important; left:20px !important; } .customerVoiceSmartBtn{ width:48px !important; min-width:48px !important; height:48px !important; min-height:48px !important; } .customerVoiceSmartBtn .voiceFillBtn__icon{ width:17px !important; height:17px !important; } .customerVoiceSmartBtn .voiceFillBtn__icon svg{ width:15px !important; height:15px !important; stroke-width:1.85 !important; } .customerVoiceSmartBtn .voiceFillBtn__timer{ right:-7px !important; bottom:-7px !important; min-width:25px !important; height:25px !important; font-size:11px !important; } .customerVoiceGuide{ margin:-4px 0 16px auto; max-width:720px; border:1px solid rgba(var(--accent-rgb),.32); background:linear-gradient(135deg, rgba(37,99,235,.13), rgba(14,165,233,.07)), rgba(15,23,42,.54); border-radius:18px; padding:14px 16px 13px; color:var(--text); box-shadow:0 18px 42px rgba(2,6,23,.24), inset 0 1px 0 rgba(255,255,255,.05); animation:customerVoiceGuideIn .18s ease-out both; } .customerVoiceGuide[hidden]{display:none !important;} .customerVoiceGuide__title{ font-size:14px; font-weight:950; margin-bottom:7px; color:#dbeafe; } .customerVoiceGuide__text{ font-size:12.5px; font-weight:750; line-height:1.9; color:var(--muted); } .customerVoiceGuide__example{ margin-top:9px; padding:10px 12px; border-radius:14px; background:rgba(2,6,23,.22); border:1px dashed rgba(var(--accent-rgb),.34); font-size:12px; font-weight:800; line-height:1.9; color:#bfdbfe; } @keyframes customerVoiceGuideIn{ from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:translateY(0)} } html[data-theme="light"] .customerVoiceGuide, body.theme-light .customerVoiceGuide{ background:linear-gradient(135deg, rgba(37,99,235,.10), rgba(14,165,233,.06)), #fff; border-color:#bfdbfe; box-shadow:0 14px 34px rgba(15,23,42,.10); } html[data-theme="light"] .customerVoiceGuide__title, body.theme-light .customerVoiceGuide__title{ color:#1d4ed8; } html[data-theme="light"] .customerVoiceGuide__example, body.theme-light .customerVoiceGuide__example{ background:#eff6ff; color:#1e3a8a; border-color:#bfdbfe; } @media (max-width:640px){ .customerVoiceSlot{ top:9px !important; left:12px !important; } .customerVoiceSmartBtn{ width:44px !important; min-width:44px !important; height:44px !important; min-height:44px !important; } .customerVoiceSmartBtn .voiceFillBtn__icon{ width:15px !important; height:15px !important; } .customerVoiceSmartBtn .voiceFillBtn__icon svg{ width:13px !important; height:13px !important; } .customerVoiceGuide{ margin-top:2px; border-radius:16px; padding:12px 13px; } } /* ---------------- v167: voice fill for item and invoice forms ---------------- */ .itemEditCard, .pageHead--voice{ position:relative; } .itemEditCard{ padding-top:18px; } .itemVoiceSlot, .invoiceVoiceSlot{ top:12px !important; left:20px !important; } .pageHead--voice{ min-height:58px; padding-left:74px; } .pageHead--voice .customerVoiceSlot{ top:4px !important; left:0 !important; } .pageHead--voice + .customerVoiceGuide, .itemEditCard .customerVoiceGuide{ margin-top:2px; margin-bottom:16px; } @media (max-width:640px){ .pageHead--voice{ min-height:52px; padding-left:58px; } .pageHead--voice .customerVoiceSlot{ top:2px !important; left:0 !important; } .itemVoiceSlot, .invoiceVoiceSlot{ top:9px !important; left:12px !important; } } /* ---------------- v168: move invoice voice mic into buyer card top-left ---------------- */ .invHeadCol--buyer{ position:relative; padding-top:8px; } .invoiceVoiceSlot--buyer{ position:absolute; top:8px !important; left:12px !important; z-index:5; } .invHeadCol--buyer .cardHeadRow{ min-height:44px; } #invoiceVoiceGuide{ margin-top:0; margin-bottom:14px; } @media (max-width:640px){ .invHeadCol--buyer{ padding-top:6px; } .invoiceVoiceSlot--buyer{ top:8px !important; left:10px !important; } } /* ---------------- v169: place invoice voice button in meta card and guide inside right panel ---------------- */ .invHeadCol--meta{ position:relative; padding-top:8px; } .invoiceVoiceSlot--meta{ position:absolute; top:8px !important; left:12px !important; z-index:5; } .invHeadCol--meta > .cardHeadRow{ min-height:44px; } .invHeadCol--meta .customerVoiceGuide--invoice{ margin:10px 0 0; max-width:none; min-height:104px; } @media (max-width:640px){ .invHeadCol--meta{ padding-top:6px; } .invoiceVoiceSlot--meta{ top:8px !important; left:10px !important; } .invHeadCol--meta .customerVoiceGuide--invoice{ min-height:0; } } /* ---------------- v170: roomier invoice voice guide ---------------- */ .invHeadCol--meta .customerVoiceGuide--invoice{ margin-top:14px; padding:18px 20px 17px; border-radius:20px; } .invHeadCol--meta .customerVoiceGuide--invoice .customerVoiceGuide__title{ margin-bottom:10px; } .invHeadCol--meta .customerVoiceGuide--invoice .customerVoiceGuide__text{ line-height:2.05; margin-bottom:10px; } .invHeadCol--meta .customerVoiceGuide--invoice .customerVoiceGuide__example{ margin-top:12px; padding:12px 14px; line-height:2.05; } /* ---------------- v171: voice guide spacing + mobile tax catalog scroll ---------------- */ .invHeadCol--meta .customerVoiceGuide--invoice{ margin-top:26px !important; } .taxCatalogLookupModal{ overflow:hidden !important; align-items:center !important; justify-content:center !important; } .taxCatalogLookupModal .taxCatalogLookupPanel{ display:flex !important; flex-direction:column !important; max-height:calc(100dvh - 24px) !important; overflow:hidden !important; } .taxCatalogLookupModal .taxCatalogLookupBody{ min-height:0 !important; overflow-y:auto !important; overflow-x:hidden !important; -webkit-overflow-scrolling:touch; padding-bottom:calc(18px + env(safe-area-inset-bottom)) !important; } .taxCatalogLookupModal .taxCatalogResults{ min-height:150px; } .taxCatalogLookupModal .taxCatalogTableWrap{ max-height:none !important; overflow:auto !important; -webkit-overflow-scrolling:touch; } @media (max-width:720px){ .taxCatalogLookupModal{ align-items:flex-start !important; padding:6px 0 !important; } .taxCatalogLookupModal .taxCatalogLookupPanel{ width:calc(100vw - 10px) !important; max-width:calc(100vw - 10px) !important; max-height:calc(100dvh - 12px) !important; border-radius:18px !important; } .taxCatalogLookupModal .taxCatalogLookupBody{ gap:8px !important; padding:10px 10px calc(22px + env(safe-area-inset-bottom)) !important; } .taxCatalogLookupModal .taxCatalogSearchActions, .taxCatalogLookupModal .taxCatalogSearchBar--smart{ align-items:stretch !important; } .taxCatalogLookupModal .taxCatalogFilters, .taxCatalogLookupModal .taxCatalogToolbar{ flex-shrink:0; } .taxCatalogLookupModal .taxCatalogResults{ min-height:180px !important; padding-bottom:18px !important; } } /* ---------------- v172: stronger mobile modal scroll + single-command voice guide spacing ---------------- */ body.tax-catalog-modal-open{ overflow:hidden !important; overscroll-behavior:contain !important; } .taxCatalogLookupModal:not([hidden]){ position:fixed !important; inset:0 !important; width:100vw !important; height:100dvh !important; display:flex !important; overflow:hidden !important; padding:8px !important; box-sizing:border-box !important; } .taxCatalogLookupModal .taxCatalogLookupPanel{ width:min(1040px, calc(100vw - 16px)) !important; max-height:calc(100dvh - 16px) !important; min-height:0 !important; } .taxCatalogLookupModal .taxCatalogLookupBody{ flex:1 1 auto !important; min-height:0 !important; max-height:none !important; overflow-y:auto !important; overscroll-behavior:contain !important; } .taxCatalogLookupModal .taxCatalogResults{ flex:0 0 auto !important; min-height:160px !important; padding-bottom:calc(28px + env(safe-area-inset-bottom)) !important; } .invHeadCol--meta .customerVoiceGuide--invoice{ margin-top:32px !important; } @media (max-width:720px){ .taxCatalogLookupModal:not([hidden]){ align-items:flex-start !important; padding:4px !important; } .taxCatalogLookupModal .taxCatalogLookupPanel{ width:calc(100vw - 8px) !important; max-width:calc(100vw - 8px) !important; max-height:calc(100dvh - 8px) !important; border-radius:16px !important; } .taxCatalogLookupModal .modal__header{ flex:0 0 auto !important; } .taxCatalogLookupModal .taxCatalogLookupBody{ max-height:calc(100dvh - 78px) !important; overflow-y:auto !important; } .taxCatalogLookupModal .taxCatalogTableWrap{ max-width:100% !important; overflow:auto !important; } } /* ---------------- v173: tax catalog reset button + safer mobile modal ---------------- */ .taxCatalogLookupModal .taxCatalogSearchActions{ flex-wrap:wrap; } .taxCatalogLookupModal .taxCatalogAiNote{ margin-bottom:10px; } @media (max-width:720px){ .taxCatalogLookupModal .taxCatalogSearchActions .btn{ min-width:0; flex:1 1 120px; } .taxCatalogLookupModal .taxCatalogLookupBody{ padding-bottom:calc(36px + env(safe-area-inset-bottom)) !important; } } /* v179: support phone label aligned correctly on login */ .loginGate__version{display:flex;align-items:center;justify-content:center;gap:6px;direction:rtl;unicode-bidi:plaintext;text-align:center;flex-wrap:wrap;} .loginGate__versionLabel{display:inline-block;} .loginGate__versionNumber{display:inline-block;direction:ltr;unicode-bidi:isolate;font-variant-numeric:tabular-nums;} /* ---------------- v187: opaque tax-catalog modal + single clean select arrow ---------------- */ .taxCatalogLookupModal .modal__backdrop{ background:rgba(2,6,23,.92) !important; backdrop-filter:blur(3px) !important; -webkit-backdrop-filter:blur(3px) !important; } .taxCatalogLookupModal .taxCatalogLookupPanel{ background:#0b1426 !important; opacity:1 !important; isolation:isolate !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; box-shadow:0 28px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.045) !important; } .taxCatalogLookupModal .modal__header{ background:#0d172b !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } .taxCatalogLookupModal .taxCatalogLookupBody{ background:#0b1426 !important; opacity:1 !important; } .taxCatalogLookupModal .taxCatalogSearchBar, .taxCatalogLookupModal .taxCatalogFilters, .taxCatalogLookupModal .taxCatalogToolbar, .taxCatalogLookupModal .taxCatalogResults, .taxCatalogLookupModal .taxCatalogTableWrap{ position:relative; z-index:1; } .taxCatalogLookupModal .taxCatalogFilters, .taxCatalogLookupModal .taxCatalogToolbar{ background:#101a2f !important; opacity:1 !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } .taxCatalogLookupModal .taxCatalogFilters select, .taxCatalogLookupModal .taxCatalogToolbar select{ appearance:none !important; -webkit-appearance:none !important; -moz-appearance:none !important; background-color:#111c31 !important; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important; background-repeat:no-repeat !important; background-position:left 13px center !important; background-size:14px 14px !important; padding-right:14px !important; padding-left:42px !important; color:#f8fafc !important; opacity:1 !important; } .taxCatalogLookupModal .taxCatalogFilters select::-ms-expand, .taxCatalogLookupModal .taxCatalogToolbar select::-ms-expand{ display:none; } .taxCatalogLookupModal .taxCatalogFilters .taxCatalogMultiToggle{ background:#111c31 !important; opacity:1 !important; } .taxCatalogLookupModal .taxCatalogResults, .taxCatalogLookupModal .taxCatalogTableWrap, .taxCatalogLookupModal .taxCatalogTable{ background:#0b1426 !important; } html[data-theme="light"] .taxCatalogLookupModal .modal__backdrop, body.theme-light .taxCatalogLookupModal .modal__backdrop{ background:rgba(15,23,42,.64) !important; } html[data-theme="light"] .taxCatalogLookupModal .taxCatalogLookupPanel, body.theme-light .taxCatalogLookupModal .taxCatalogLookupPanel, html[data-theme="light"] .taxCatalogLookupModal .taxCatalogLookupBody, body.theme-light .taxCatalogLookupModal .taxCatalogLookupBody, html[data-theme="light"] .taxCatalogLookupModal .taxCatalogResults, body.theme-light .taxCatalogLookupModal .taxCatalogResults, html[data-theme="light"] .taxCatalogLookupModal .taxCatalogTableWrap, body.theme-light .taxCatalogLookupModal .taxCatalogTableWrap, html[data-theme="light"] .taxCatalogLookupModal .taxCatalogTable, body.theme-light .taxCatalogLookupModal .taxCatalogTable{ background:#ffffff !important; } html[data-theme="light"] .taxCatalogLookupModal .modal__header, body.theme-light .taxCatalogLookupModal .modal__header, html[data-theme="light"] .taxCatalogLookupModal .taxCatalogFilters, body.theme-light .taxCatalogLookupModal .taxCatalogFilters, html[data-theme="light"] .taxCatalogLookupModal .taxCatalogToolbar, body.theme-light .taxCatalogLookupModal .taxCatalogToolbar{ background:#f8fafc !important; } html[data-theme="light"] .taxCatalogLookupModal .taxCatalogFilters select, body.theme-light .taxCatalogLookupModal .taxCatalogFilters select, html[data-theme="light"] .taxCatalogLookupModal .taxCatalogToolbar select, body.theme-light .taxCatalogLookupModal .taxCatalogToolbar select, html[data-theme="light"] .taxCatalogLookupModal .taxCatalogFilters .taxCatalogMultiToggle, body.theme-light .taxCatalogLookupModal .taxCatalogFilters .taxCatalogMultiToggle{ background-color:#ffffff !important; color:#0f172a !important; } /* v188: remove build tag display and keep identifier-type dropdown above lower toolbar */ .taxCatalogLookupModal .taxCatalogLookupBody, .taxCatalogLookupModal .taxCatalogFilters{overflow:visible !important;} .taxCatalogLookupModal .taxCatalogFilters{position:relative; z-index:20 !important;} .taxCatalogLookupModal .taxCatalogFilters .taxCatalogMultiFilter{position:relative; z-index:30;} .taxCatalogLookupModal .taxCatalogFilters .taxCatalogMultiFilter:focus-within{z-index:60;} .taxCatalogLookupModal .taxCatalogFilters .taxCatalogMultiMenu{z-index:120 !important;} .taxCatalogLookupModal .taxCatalogToolbar{position:relative; z-index:5 !important;} /* ---------------- v190: reliable modal scrolling + lightweight indexed filtered search ---------------- */ .taxCatalogLookupModal .taxCatalogLookupPanel{ display:flex !important; flex-direction:column !important; max-height:calc(100dvh - 16px) !important; min-height:0 !important; overflow:hidden !important; } .taxCatalogLookupModal .modal__header{ flex:0 0 auto !important; } .taxCatalogLookupModal .taxCatalogLookupBody{ flex:1 1 auto !important; min-height:0 !important; max-height:none !important; overflow-y:auto !important; overflow-x:hidden !important; overscroll-behavior:contain !important; scrollbar-gutter:stable; -webkit-overflow-scrolling:touch; padding-bottom:calc(34px + env(safe-area-inset-bottom)) !important; } .taxCatalogLookupModal .taxCatalogFilters{ overflow:visible !important; } .taxCatalogLookupModal .taxCatalogResults{ flex:0 0 auto !important; min-height:160px !important; padding-bottom:28px !important; } .taxCatalogLookupModal .taxCatalogPager{ margin-bottom:8px; } @media (max-width:720px){ .taxCatalogLookupModal .taxCatalogLookupPanel{ max-height:calc(100dvh - 8px) !important; } .taxCatalogLookupModal .taxCatalogLookupBody{ max-height:calc(100dvh - 72px) !important; padding-bottom:calc(44px + env(safe-area-inset-bottom)) !important; } .taxCatalogLookupModal .taxCatalogResults{ padding-bottom:36px !important; } } /* ---------------- v191: mobile-safe items list + compact subscription purchase ---------------- */ .table--items{width:100%;table-layout:fixed;} .table--items th,.table--items td{white-space:nowrap;vertical-align:middle;} .table--items thead th{text-align:right;} .table--items thead .sortHeadBtn{display:flex;width:100%;margin:0;justify-content:flex-start;} .table--items .c, .table--items .itemCol--fee, .table--items .itemCol--status, .table--items .itemCol--ops{ text-align:center; } .table--items col.itemCol--select{width:52px;} .table--items col.itemCol--code{width:116px;} .table--items col.itemCol--title{width:25%;} .table--items col.itemCol--type{width:88px;} .table--items col.itemCol--category{width:136px;} .table--items col.itemCol--warehouse{width:136px;} .table--items col.itemCol--unit{width:88px;} .table--items col.itemCol--fee{width:110px;} .table--items col.itemCol--status{width:100px;} .table--items col.itemCol--ops{width:98px;} .table--items .itemCol--code, .table--items .itemCol--unit, .table--items .itemCol--fee, .table--items .itemCol--vat, .table--items .itemCol--ops{} .table--items .itemCol--title{ width:auto; min-width:220px; white-space:normal !important; word-break:break-word; overflow-wrap:anywhere; line-height:1.75; } .table--items .itemCol--code{max-width:132px;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:right;} .table--items .itemCol--unit{max-width:110px;overflow:hidden;text-overflow:ellipsis;} .table--items .itemCol--fee,.table--items .itemCol--vat{min-width:84px;} .table--items .itemCol--ops{min-width:78px;text-align:center;} .table--items .itemCol--ops .opActions{justify-content:center;} @media(max-width:720px){ .page[data-page="items"], .page[data-page="items"] .grid2, .page[data-page="items"] .card, .page[data-page="items"] #itemsTable, .page[data-page="items"] .tablewrap{ min-width:0; max-width:100%; } .page[data-page="items"]{width:100%;overflow-x:hidden;} #itemsTable .tablewrap{ overflow-x:auto !important; overflow-y:hidden !important; -webkit-overflow-scrolling:touch; border:1px solid var(--border); border-radius:14px; max-width:100% !important; } #itemsTable .table--items{ min-width:640px !important; max-width:none !important; table-layout:auto !important; font-size:12px; } #itemsTable .table--items th, #itemsTable .table--items td{ padding:7px 8px !important; border-bottom:1px solid var(--border) !important; } #itemsTable .table--items .itemCol--title{ min-width:210px !important; max-width:300px !important; white-space:normal !important; word-break:break-word !important; overflow-wrap:anywhere !important; line-height:1.7; } #itemsTable .table--items .itemCol--code{max-width:120px;} #itemsTable .table--items .itemCol--unit{max-width:100px;} #itemsTable .table--items .itemCol--ops{ min-width:82px !important; width:82px !important; max-width:82px !important; text-align:center !important; } #itemsTable .table--items .itemCol--ops .opActions, #itemsTable .table--items .itemCol--ops .opActions--mini{ display:inline-flex !important; flex-direction:row !important; flex-wrap:nowrap !important; justify-content:center !important; gap:6px !important; width:max-content !important; max-width:none !important; } #itemsTable .table--items .itemCol--ops .btn, #itemsTable .table--items .itemCol--ops .btn--iconOnly{ flex:0 0 32px !important; width:32px !important; min-width:32px !important; max-width:32px !important; height:32px !important; min-height:32px !important; padding:0 !important; margin:0 !important; } #itemsTable .pager{justify-content:center;} } @media(max-width:420px){ #itemsTable .table--items{min-width:580px !important;} #itemsTable .bulkActions{justify-content:stretch !important;} #itemsTable .bulkActions .btn{flex:1 1 100% !important;width:100% !important;} } @media(max-width:720px){ .page[data-page="acc-plan"]{width:100%;overflow-x:hidden;} .page[data-page="acc-plan"] .card{padding:12px !important;border-radius:16px !important;} .page[data-page="acc-plan"] .planHero--current{margin-bottom:8px !important;} .page[data-page="acc-plan"] .planHero__text--current{padding:10px !important;border-radius:16px !important;} .page[data-page="acc-plan"] .planCurrentHero{gap:8px;} .page[data-page="acc-plan"] .planCurrentHero__head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start;} .page[data-page="acc-plan"] .planCurrentHero__head h1{font-size:17px;line-height:1.55;} .page[data-page="acc-plan"] .planCurrentHero__head p{display:none;} .page[data-page="acc-plan"] .planCurrentHero__empty{padding:10px;border-radius:14px;} .page[data-page="acc-plan"] .planCurrentHero__empty h1{font-size:17px;} .page[data-page="acc-plan"] .planCurrentHero__empty p{font-size:12px;line-height:1.6;} .page[data-page="acc-plan"] .planCurrentHero__status{padding:5px 9px;font-size:11px;} .page[data-page="acc-plan"] .planCurrentHero__metrics{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:7px !important;} .page[data-page="acc-plan"] .planCurrentHero__metrics > div{padding:8px;border-radius:13px;gap:2px;} .page[data-page="acc-plan"] .planCurrentHero__metrics span, .page[data-page="acc-plan"] .planCurrentHero__metrics small{font-size:10.8px;line-height:1.55;} .page[data-page="acc-plan"] .planCurrentHero__metrics strong{font-size:13px;line-height:1.6;} .page[data-page="acc-plan"] .planCurrentHero__features{max-height:70px;overflow:auto;gap:5px;padding-bottom:1px;} .page[data-page="acc-plan"] .planCurrentHero__features b{font-size:10.8px;padding:4px 7px;} .page[data-page="acc-plan"] .planLayout{gap:10px;} .page[data-page="acc-plan"] .planSectionHead{margin-bottom:8px;} .page[data-page="acc-plan"] .planSectionHead h2, .page[data-page="acc-plan"] .planCheckoutCard h2, .page[data-page="acc-plan"] .planHelpCard h2{font-size:15px;} .page[data-page="acc-plan"] .planCatalog{ display:grid !important; grid-template-columns:none !important; grid-auto-flow:column; grid-auto-columns:min(82vw,300px); gap:10px !important; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; padding:2px 2px 10px; margin-inline:-2px; } .page[data-page="acc-plan"] .planCatalog::-webkit-scrollbar{height:6px;} .page[data-page="acc-plan"] .planCard{ scroll-snap-align:start; min-height:0 !important; padding:11px !important; gap:8px !important; border-radius:16px !important; } .page[data-page="acc-plan"] .planCard__top{gap:8px;align-items:flex-start;} .page[data-page="acc-plan"] .planCard__title{font-size:14px;line-height:1.55;} .page[data-page="acc-plan"] .planCard__period, .page[data-page="acc-plan"] .planCard__price span{font-size:11px;line-height:1.55;} .page[data-page="acc-plan"] .planCard__price strong{font-size:16px;line-height:1.5;} .page[data-page="acc-plan"] .planCard__features{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; max-height:86px; overflow:auto; padding-inline-end:2px; } .page[data-page="acc-plan"] .planCard__features > div{font-size:11px;line-height:1.5;gap:5px;} .page[data-page="acc-plan"] .planFeatureDot{width:6px;height:6px;flex-basis:6px;box-shadow:0 0 0 2px color-mix(in oklab, var(--accent, #7c5cff) 16%, transparent);} .page[data-page="acc-plan"] .planCard__actions{margin-top:0;} .page[data-page="acc-plan"] .planAddonGrid{grid-template-columns:1fr !important;margin-top:8px;gap:8px;} .page[data-page="acc-plan"] .planAddonItem{padding:10px;border-radius:14px;gap:8px;} .page[data-page="acc-plan"] .planAddonItem--stepper{grid-template-columns:minmax(0,1fr);} .page[data-page="acc-plan"] .addonStepper{grid-template-columns:40px minmax(0,1fr) 40px;gap:6px;} .page[data-page="acc-plan"] .addonStepper__btn, .page[data-page="acc-plan"] .addonStepper__input{height:40px;} .page[data-page="acc-plan"] .addonStepper__btn{width:40px;border-radius:12px;} .page[data-page="acc-plan"] .planCheckoutCard{gap:9px !important;} .page[data-page="acc-plan"] .planCheckoutCard__head--stacked{gap:8px;} .page[data-page="acc-plan"] .planCouponBox{padding:8px;border-radius:14px;margin-top:4px;} .page[data-page="acc-plan"] .planCurrentRows{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;} .page[data-page="acc-plan"] .planCurrentRows > div{display:grid;align-items:start;gap:2px;padding:7px 8px;border-radius:12px;} .page[data-page="acc-plan"] .planCurrentRows span{font-size:10.8px;} .page[data-page="acc-plan"] .planCurrentRows strong{font-size:12px;text-align:right;} .page[data-page="acc-plan"] .planCurrentRows > div.is-final{grid-column:1/-1;} .page[data-page="acc-plan"] .planCurrentRows > div.is-final strong{font-size:20px;} .page[data-page="acc-plan"] .planSelectedBox{padding:9px;border-radius:14px;gap:2px;} .page[data-page="acc-plan"] .planSelectedBox strong{font-size:15px;} .page[data-page="acc-plan"] .planNoteField textarea{min-height:52px !important;height:52px !important;} .page[data-page="acc-plan"] .planInvoiceToggle, .page[data-page="acc-plan"] .planTermsAccept{border-radius:14px;} .page[data-page="acc-plan"] .planInvoiceToggle{padding:9px;} .page[data-page="acc-plan"] .planTermsAccept__label{align-items:flex-start;gap:8px;font-size:12px;line-height:1.8;} .page[data-page="acc-plan"] .planInvoiceFields{padding:9px;border-radius:14px;gap:8px;} } @media(max-width:390px){ .page[data-page="acc-plan"] .planCurrentHero__head{grid-template-columns:1fr;} .page[data-page="acc-plan"] .planCurrentHero__status{width:max-content;} .page[data-page="acc-plan"] .planCurrentHero__metrics{grid-template-columns:1fr !important;} .page[data-page="acc-plan"] .planCurrentRows{grid-template-columns:1fr;} } /* ---------------- v193: keep one outer card, remove only duplicate inner filter frame ---------------- */ section[data-page="invoices"] .card > .inv-toolbar2, section[data-page="jobs"] .card > .inv-toolbar2{ border:0 !important; background:transparent !important; box-shadow:none !important; padding:0 !important; border-radius:0 !important; margin-bottom:10px !important; } section[data-page="invoices"] .inv-toolbar2__row--top, section[data-page="jobs"] .inv-toolbar2__row--top{ border-bottom:0 !important; } @media(max-width:720px){ section[data-page="invoices"] .card > .inv-toolbar2, section[data-page="jobs"] .card > .inv-toolbar2{ padding:0 !important; border-radius:0 !important; margin-bottom:8px !important; } } /* ---------------- v195: mobile containment for subscription plans and add-on modules ---------------- */ @media (max-width:720px){ .page[data-page="acc-plan"], .page[data-page="acc-plan"] *, .page[data-page="acc-plan"] *::before, .page[data-page="acc-plan"] *::after{ box-sizing:border-box; } .page[data-page="acc-plan"], .page[data-page="acc-plan"] .planHero, .page[data-page="acc-plan"] .planLayout, .page[data-page="acc-plan"] .planMain, .page[data-page="acc-plan"] .planCatalogCard, .page[data-page="acc-plan"] .planAddonsCard, .page[data-page="acc-plan"] .planCheckoutCard, .page[data-page="acc-plan"] .planSectionHead, .page[data-page="acc-plan"] .planCurrentHero, .page[data-page="acc-plan"] .planCurrentHero__head, .page[data-page="acc-plan"] .planCurrentHero__metrics, .page[data-page="acc-plan"] .planCurrentRows, .page[data-page="acc-plan"] .planAddonGrid, .page[data-page="acc-plan"] .planAddonItem, .page[data-page="acc-plan"] .addonStepper, .page[data-page="acc-plan"] .planSelectedBox, .page[data-page="acc-plan"] .planCouponBox, .page[data-page="acc-plan"] .planCouponRow, .page[data-page="acc-plan"] .planInvoiceFields, .page[data-page="acc-plan"] .planTermsAccept, .page[data-page="acc-plan"] .planInvoiceToggle{ min-width:0 !important; max-width:100% !important; } .page[data-page="acc-plan"]{ overflow-x:hidden !important; padding-inline:0 !important; } .page[data-page="acc-plan"] .planLayout, .page[data-page="acc-plan"] .planMain{ width:100% !important; grid-template-columns:minmax(0,1fr) !important; } .page[data-page="acc-plan"] .planCatalogCard, .page[data-page="acc-plan"] .planAddonsCard, .page[data-page="acc-plan"] .planCheckoutCard{ width:100% !important; overflow:hidden !important; } .page[data-page="acc-plan"] #accPlanCatalog.planCatalog{ width:100% !important; max-width:100% !important; display:grid !important; grid-template-columns:none !important; grid-auto-flow:column !important; grid-auto-columns:minmax(244px, calc(100vw - 58px)) !important; overflow-x:auto !important; overflow-y:hidden !important; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; padding:2px 2px 12px !important; margin-inline:0 !important; scroll-padding-inline:2px; scrollbar-gutter:stable; } .page[data-page="acc-plan"] #accPlanCatalog .planCard{ width:100% !important; max-width:100% !important; min-width:0 !important; overflow:hidden !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__top, .page[data-page="acc-plan"] #accPlanCatalog .planCard__price, .page[data-page="acc-plan"] #accPlanCatalog .planCard__features, .page[data-page="acc-plan"] #accPlanCatalog .planCard__actions{ min-width:0 !important; max-width:100% !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__title, .page[data-page="acc-plan"] #accPlanCatalog .planCard__period, .page[data-page="acc-plan"] #accPlanCatalog .planCard__price, .page[data-page="acc-plan"] #accPlanCatalog .planCard__price strong, .page[data-page="acc-plan"] #accPlanCatalog .planCard__price span, .page[data-page="acc-plan"] #accPlanCatalog .planCard__features > div{ white-space:normal !important; overflow-wrap:anywhere !important; word-break:break-word !important; } .page[data-page="acc-plan"] #accPlanAddons.planAddonGrid{ display:grid !important; grid-template-columns:minmax(0,1fr) !important; width:100% !important; overflow:hidden !important; } .page[data-page="acc-plan"] #accPlanAddons .planAddonItem{ width:100% !important; overflow:hidden !important; } .page[data-page="acc-plan"] #accPlanAddons .planAddonItem__info, .page[data-page="acc-plan"] #accPlanAddons .planAddonItem__sum, .page[data-page="acc-plan"] #accPlanAddons .planAddonItem__permanent, .page[data-page="acc-plan"] #accPlanAddons .planAddonItem strong, .page[data-page="acc-plan"] #accPlanAddons .planAddonItem span{ min-width:0 !important; max-width:100% !important; white-space:normal !important; overflow-wrap:anywhere !important; word-break:break-word !important; } .page[data-page="acc-plan"] #accPlanAddons .addonStepper{ width:100% !important; grid-template-columns:38px minmax(0,1fr) 38px !important; gap:6px !important; } .page[data-page="acc-plan"] #accPlanAddons .addonStepper__btn{ width:38px !important; min-width:38px !important; max-width:38px !important; height:38px !important; border-radius:12px !important; } .page[data-page="acc-plan"] #accPlanAddons .addonStepper__input{ min-width:0 !important; width:100% !important; max-width:100% !important; height:38px !important; padding-inline:6px !important; } .page[data-page="acc-plan"] .planCheckoutCard input, .page[data-page="acc-plan"] .planCheckoutCard textarea, .page[data-page="acc-plan"] .planCheckoutCard button, .page[data-page="acc-plan"] .planCheckoutActions .btn{ max-width:100% !important; } } @media (max-width:390px){ .page[data-page="acc-plan"] #accPlanCatalog.planCatalog{ grid-auto-columns:minmax(226px, calc(100vw - 46px)) !important; } .page[data-page="acc-plan"] #accPlanAddons .addonStepper{ grid-template-columns:36px minmax(0,1fr) 36px !important; } .page[data-page="acc-plan"] #accPlanAddons .addonStepper__btn{ width:36px !important; min-width:36px !important; max-width:36px !important; } } /* ---------------- v196: mobile plans back to visible stacked cards (no horizontal scroll) ---------------- */ @media (max-width:720px){ .page[data-page="acc-plan"] .planCatalogCard{ overflow:visible !important; } .page[data-page="acc-plan"] #accPlanCatalog.planCatalog, .page[data-page="acc-plan"] .planCatalog{ display:grid !important; grid-template-columns:minmax(0,1fr) !important; grid-auto-flow:row !important; grid-auto-columns:auto !important; gap:10px !important; overflow:visible !important; overflow-x:visible !important; overflow-y:visible !important; -webkit-overflow-scrolling:auto !important; scroll-snap-type:none !important; padding:0 !important; margin:0 !important; width:100% !important; max-width:100% !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard, .page[data-page="acc-plan"] .planCatalog .planCard{ width:100% !important; max-width:100% !important; min-width:0 !important; min-height:0 !important; scroll-snap-align:unset !important; padding:12px !important; gap:9px !important; border-radius:16px !important; overflow:hidden !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__top, .page[data-page="acc-plan"] .planCatalog .planCard__top{ display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:6px !important; padding-top:2px !important; min-width:0 !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__title, .page[data-page="acc-plan"] .planCatalog .planCard__title{ font-size:15px !important; line-height:1.55 !important; white-space:normal !important; overflow-wrap:anywhere !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__price, .page[data-page="acc-plan"] .planCatalog .planCard__price{ display:flex !important; flex-wrap:wrap !important; align-items:baseline !important; gap:4px 8px !important; min-width:0 !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__price strong, .page[data-page="acc-plan"] .planCatalog .planCard__price strong{ font-size:17px !important; line-height:1.55 !important; display:inline !important; white-space:normal !important; overflow-wrap:anywhere !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__period, .page[data-page="acc-plan"] #accPlanCatalog .planCard__price span, .page[data-page="acc-plan"] .planCatalog .planCard__period, .page[data-page="acc-plan"] .planCatalog .planCard__price span{ font-size:11px !important; line-height:1.6 !important; white-space:normal !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__features, .page[data-page="acc-plan"] .planCatalog .planCard__features{ display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:6px !important; max-height:none !important; overflow:visible !important; padding-inline-end:0 !important; margin-top:0 !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__features > div, .page[data-page="acc-plan"] .planCatalog .planCard__features > div{ min-width:0 !important; font-size:11px !important; line-height:1.55 !important; white-space:normal !important; overflow-wrap:anywhere !important; align-items:flex-start !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__actions, .page[data-page="acc-plan"] .planCatalog .planCard__actions{ margin-top:0 !important; } .page[data-page="acc-plan"] #accPlanCatalog .planCard__actions .btn, .page[data-page="acc-plan"] .planCatalog .planCard__actions .btn{ width:100% !important; max-width:100% !important; } } @media (max-width:390px){ .page[data-page="acc-plan"] #accPlanCatalog .planCard__features, .page[data-page="acc-plan"] .planCatalog .planCard__features{ grid-template-columns:minmax(0,1fr) !important; } } /* v197: Guest mode notice cards */ .guestPromptBox{display:flex;flex-direction:column;gap:8px;align-items:flex-start;padding:14px;border:1px dashed var(--border,#d8e1ee);border-radius:16px;background:rgba(59,130,246,.06);color:var(--text,#111827);direction:rtl;text-align:right;line-height:1.8;max-width:100%;box-sizing:border-box;overflow-wrap:anywhere;} .guestPromptBox b{font-weight:900;} .guestPromptBox span{color:var(--muted,#64748b);font-size:.92rem;} .guestPromptBox .btn{margin-top:2px;} /* ---------------- v198: guest login button width + cleaner login gate ---------------- */ .sidebar__footer .footerControls__top.footerControls__top--guestAuth{ grid-template-areas: "clock clock clock" "timer timer theme" "buy buy buy" !important; } .sidebar__footer .footerControls__top.footerControls__top--guestAuth #btnFooterPlanBuy{ width:100% !important; min-width:0 !important; white-space:nowrap !important; justify-content:center !important; text-align:center !important; padding-inline:14px !important; } @media (max-width:360px){ .sidebar__footer .footerControls__top.footerControls__top--guestAuth{ grid-template-areas: "clock clock" "theme timer" "buy buy" !important; } } /* ---------------- v199: refresh guest prompts immediately after successful login ---------------- */ /* ---------------- v200: relaxed password policy + OTP autofill attributes ---------------- */ /* ---------------- v201: account profile change actions ---------------- */ .accountProfileActions{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; } .accountProfileActions .btn{ flex:1 1 140px; min-width:0; justify-content:center; white-space:normal; line-height:1.35; } .accountProfileHint{ margin-top:8px; } @media (max-width: 640px){ .accountProfileActions{ display:grid; grid-template-columns:1fr; } .accountProfileActions .btn{ width:100%; min-height:42px; } } /* ---------------- v202: profile edit buttons inline + in-app profile dialog ---------------- */ #accUserInfo .accountInfoItem--editable{ display:grid; grid-template-columns:auto minmax(0, 1fr) auto; align-items:center; gap:10px; } #accUserInfo .accountInfoItem--editable > span:not(.muted), #accUserInfo .accountInfoItem--editable > strong{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; direction:ltr; unicode-bidi:plaintext; text-align:left; } .accountInfoEditBtn{ min-width:72px; padding-inline:12px; justify-content:center; white-space:nowrap; } .accountProfileInputModal[hidden]{ display:none !important; } .accountProfileInputPanel{ width:min(440px, calc(100vw - 28px)); } .accountProfileInputBody{ display:grid; gap:14px; } .accountProfileInputField{ display:grid; gap:8px; } .accountProfileInputField input{ width:100%; box-sizing:border-box; min-height:44px; border:1px solid var(--border); border-radius:14px; background:var(--panel-2, rgba(255,255,255,.04)); color:var(--text); padding:10px 12px; outline:none; } .accountProfileInputField input:focus{ border-color:color-mix(in oklab, var(--accent, #7c5cff) 68%, var(--border)); box-shadow:0 0 0 3px color-mix(in oklab, var(--accent, #7c5cff) 18%, transparent); } .accountProfileInputActions{ display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap; } @media (max-width: 640px){ #accUserInfo .accountInfoItem--editable{ grid-template-columns:1fr auto; grid-template-areas: "label action" "value action"; align-items:center; } #accUserInfo .accountInfoItem--editable .muted{ grid-area:label; } #accUserInfo .accountInfoItem--editable > span:not(.muted), #accUserInfo .accountInfoItem--editable > strong{ grid-area:value; text-align:right; direction:rtl; } #accUserInfo .accountInfoItem--editable .accountInfoEditBtn{ grid-area:action; min-height:38px; } } /* ---------------- v214: mobile guide full text, no side scrollbar, compact controls ---------------- */ .accountGuideBtn{ border-color:rgba(94,234,212,.35); background:linear-gradient(135deg, rgba(20,184,166,.16), rgba(59,130,246,.10)); } .accountGuideBtn:hover{ filter:brightness(1.05); } .invoiceGuide[hidden]{ display:none !important; } .invoiceGuide{ position:fixed; inset:0; z-index:95; pointer-events:auto; direction:rtl; } .invoiceGuide__shade{ position:absolute; inset:0; z-index:95; pointer-events:none; } .invoiceGuide__shadePart{ position:absolute; background:rgba(3,7,18,.26); backdrop-filter:blur(1px); -webkit-backdrop-filter:blur(1px); transition:left .22s ease, top .22s ease, width .22s ease, height .22s ease; } .invoiceGuide__spot{ position:fixed; z-index:96; border:2px solid rgba(94,234,212,.96); border-radius:18px; box-shadow:0 0 0 8px rgba(94,234,212,.10), 0 12px 24px rgba(0,0,0,.14); transition:left .22s ease, top .22s ease, width .22s ease, height .22s ease; pointer-events:none; } .invoiceGuide__card{ position:fixed; z-index:97; background:rgba(15,23,42,.97); color:#fff; border:1px solid rgba(148,163,184,.32); border-radius:20px; box-shadow:0 24px 70px rgba(0,0,0,.42); padding:16px; max-width:calc(100vw - 28px); max-height:calc(100vh - 28px); overflow:auto; overscroll-behavior:contain; transition:left .22s ease, top .22s ease; } .invoiceGuide__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:10px; } .invoiceGuide__eyebrow{ display:inline-flex; align-items:center; gap:6px; font-size:11px; color:#99f6e4; border:1px solid rgba(45,212,191,.28); background:rgba(20,184,166,.12); border-radius:999px; padding:4px 9px; margin-bottom:8px; } .invoiceGuide__head h3{ margin:0; font-size:18px; line-height:1.55; } .invoiceGuide__close{ appearance:none; border:0; width:34px; height:34px; border-radius:12px; background:rgba(148,163,184,.13); color:#fff; font-size:24px; line-height:1; cursor:pointer; } .invoiceGuide__close:hover{ background:rgba(248,113,113,.22); } .invoiceGuide__text{ margin:0; color:rgba(255,255,255,.88); line-height:1.9; font-size:14px; } .invoiceGuide__tip{ margin-top:12px; padding:10px 12px; border-radius:14px; background:rgba(59,130,246,.14); border:1px solid rgba(96,165,250,.22); color:rgba(219,234,254,.95); font-size:12.5px; line-height:1.8; } .invoiceGuide__progress{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:14px; color:rgba(255,255,255,.72); font-size:12px; } .invoiceGuide__dots{ display:flex; gap:5px; direction:ltr; } .invoiceGuide__dot{ width:7px; height:7px; border-radius:999px; background:rgba(148,163,184,.45); } .invoiceGuide__dot.is-active{ width:20px; background:rgba(94,234,212,.96); } .invoiceGuide__actions{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px; } .invoiceGuide__navBtns{ display:flex; gap:8px; } .invoiceGuide__actions .btn[disabled]{ opacity:.55; cursor:not-allowed; } html[data-theme="light"] .invoiceGuide__card, body.theme-light .invoiceGuide__card{ background:rgba(255,255,255,.98); color:#0f172a; border-color:rgba(15,23,42,.12); } html[data-theme="light"] .invoiceGuide__text, body.theme-light .invoiceGuide__text{ color:rgba(15,23,42,.82); } html[data-theme="light"] .invoiceGuide__close, body.theme-light .invoiceGuide__close{ background:rgba(15,23,42,.06); color:#0f172a; } html[data-theme="light"] .invoiceGuide__progress, body.theme-light .invoiceGuide__progress{ color:rgba(15,23,42,.62); } @media (max-width:760px){ .invoiceGuide__card{ border-radius:12px; max-width:calc(100vw - 18px); max-height:none !important; overflow:visible !important; padding:9px 10px; box-shadow:0 12px 28px rgba(0,0,0,.28); } .invoiceGuide__head{ gap:6px; margin-bottom:5px; padding-left:30px; } .invoiceGuide__eyebrow{ font-size:9px; padding:2px 7px; margin-bottom:4px; } .invoiceGuide__head h3{ font-size:13.5px; line-height:1.35; } .invoiceGuide__close{ position:absolute; left:8px; top:8px; width:26px; height:26px; border-radius:9px; font-size:18px; } .invoiceGuide__text{ font-size:11.5px; line-height:1.55; } .invoiceGuide__tip{ margin-top:6px; padding:6px 8px; border-radius:10px; font-size:10.8px; line-height:1.45; } .invoiceGuide__dot{ width:5px; height:5px; } .invoiceGuide__dot.is-active{ width:14px; } .invoiceGuide__progress{ margin-top:6px; font-size:10px; gap:6px; } .invoiceGuide__actions{ margin-top:7px; display:grid; grid-template-columns:.75fr 1fr; gap:6px; align-items:stretch; } .invoiceGuide__navBtns{ display:grid; grid-template-columns:1fr 1fr; gap:6px; order:1; } .invoiceGuide__actions > [data-invoice-guide-skip]{ order:2; } .invoiceGuide__actions .btn{ width:100%; min-height:32px; padding:7px 8px; font-size:11.5px; } } /* ---------------- v219: plan source cleanup + footer gift badge position ---------------- */ .nav__item[data-nav="acc-plan"].nav__item--gift{ overflow:hidden; } .nav__item[data-nav="acc-plan"].nav__item--gift .navGiftBadge{ display:inline-flex !important; top:7px; right:14px; width:18px; height:18px; flex-basis:18px; background:rgba(239,68,68,.98); color:#fff; } .nav__item[data-nav="acc-plan"].nav__item--gift .nav__content{ padding-inline-end:26px !important; } html.sidebar-collapsed .nav__item[data-nav="acc-plan"] .navGiftBadge, body.sidebar-collapsed .nav__item[data-nav="acc-plan"] .navGiftBadge{ top:6px; right:6px; width:16px; height:16px; } /* v217: gift badge belongs to sidebar footer purchase button, not the submenu item */ .nav__item[data-nav="acc-plan"] .navGiftBadge{ display:none !important; } .sidebar__footer #btnFooterPlanBuy.footerLinkChip--gift .footerGiftBadge{ display:inline-grid !important; } /* ---------------- v220: footer purchase gift badge sits on the button itself ---------------- */ .nav__item[data-nav="acc-plan"] .navGiftBadge{ display:none !important; } .sidebar__footer #btnFooterPlanBuy.footerLinkChip--gift .footerGiftBadge{ display:inline-grid !important; top:4px !important; right:8px !important; width:18px !important; height:18px !important; } .sidebar__footer #btnFooterPlanBuy.footerLinkChip--gift .footerGiftBadge .giftIconSvg{ width:10px !important; height:10px !important; } /* ---------------- v221: mobile quick guide stays inside viewport for lower fields ---------------- */ @media (max-width:760px){ .invoiceGuide__card{ max-height:calc(100dvh - 24px) !important; overflow:auto !important; scrollbar-width:none; -ms-overflow-style:none; } .invoiceGuide__card::-webkit-scrollbar{ width:0 !important; height:0 !important; display:none !important; } } /* ---------------- v222: fixed mobile bottom nav instead of hamburger menu ---------------- */ .mobileBottomNav, .mobileMoreScrim, .mobileMoreSheet{ display:none; } @media (max-width: 980px){ /* The old hamburger/off-canvas menu is replaced with a fixed bottom navigation. */ .mobMenuBtn{ display:none !important; } .sidebarScrim{ display:none !important; } body.sidebar-open{ overflow:auto !important; } .layout{ display:block !important; } .sidebar{ display:none !important; pointer-events:none !important; } .main{ padding:16px 12px calc(112px + env(safe-area-inset-bottom, 0px)) !important; } .mobileBottomNav{ position:fixed; left:calc(env(safe-area-inset-left, 0px) + 10px); right:calc(env(safe-area-inset-right, 0px) + 10px); bottom:calc(env(safe-area-inset-bottom, 0px) + 10px); z-index:235; display:grid; grid-template-columns:1fr 1fr 1.18fr 1fr 1fr; align-items:end; gap:6px; padding:8px; min-height:74px; border:1px solid rgba(148,163,184,.24); border-radius:24px; background:linear-gradient(180deg, rgba(15,23,42,.88), rgba(15,23,42,.76)); box-shadow:0 18px 50px rgba(2,6,23,.34), inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); direction:ltr; } html[data-theme="light"] .mobileBottomNav, body.theme-light .mobileBottomNav{ background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(245,248,255,.94)); border-color:rgba(15,23,42,.10); box-shadow:0 18px 44px rgba(15,23,42,.14), inset 0 1px 0 rgba(255,255,255,.92); } .mobileBottomNav__item{ appearance:none; border:0; background:transparent; color:var(--muted); height:58px; min-width:0; padding:6px 2px 5px; border-radius:18px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; cursor:pointer; font:inherit; font-size:11px; font-weight:850; letter-spacing:-.02em; transition:transform .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease; -webkit-tap-highlight-color:transparent; direction:rtl; } .mobileBottomNav__item:active{ transform:translateY(1px) scale(.98); } .mobileBottomNav__item.is-active, .mobileBottomNav__item:hover{ color:var(--accent); background:rgba(var(--accent-rgb),.10); } .mobileBottomNav__ico{ width:24px; height:24px; display:grid; place-items:center; border-radius:14px; } .mobileBottomNav__ico svg{ width:22px; height:22px; display:block; } .mobileBottomNav__label{ max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height:1.1; } .mobileBottomNav__item--primary{ height:72px; margin-top:-20px; padding-top:7px; color:#fff !important; background:linear-gradient(180deg, rgba(var(--accent-rgb),1), rgba(var(--accent-rgb),.82)); border:1px solid rgba(255,255,255,.34); border-radius:24px; box-shadow:0 16px 32px rgba(var(--accent-rgb),.32), inset 0 1px 0 rgba(255,255,255,.28); } .mobileBottomNav__item--primary .mobileBottomNav__ico{ width:32px; height:32px; background:rgba(255,255,255,.18); } .mobileBottomNav__item--primary .mobileBottomNav__ico svg{ width:24px; height:24px; } .mobileBottomNav__item--primary .mobileBottomNav__label{ font-size:11.3px; font-weight:950; } .mobileMoreScrim{ position:fixed; inset:0; z-index:238; display:block; background:rgba(2,6,23,.46); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); } .mobileMoreScrim[hidden]{ display:none !important; } .mobileMoreSheet{ position:fixed; left:calc(env(safe-area-inset-left, 0px) + 10px); right:calc(env(safe-area-inset-right, 0px) + 10px); bottom:calc(env(safe-area-inset-bottom, 0px) + 92px); z-index:240; display:block; max-height:min(72dvh, 560px); overflow:auto; padding:10px; border:1px solid rgba(148,163,184,.24); border-radius:24px; background:linear-gradient(180deg, rgba(15,23,42,.96), rgba(15,23,42,.91)); box-shadow:0 22px 70px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); transform:translateY(0); direction:rtl; scrollbar-width:none; -ms-overflow-style:none; } .mobileMoreSheet::-webkit-scrollbar{ width:0; height:0; display:none; } .mobileMoreSheet[hidden]{ display:none !important; } html[data-theme="light"] .mobileMoreSheet, body.theme-light .mobileMoreSheet{ background:linear-gradient(180deg, rgba(255,255,255,.99), rgba(248,251,255,.96)); border-color:rgba(15,23,42,.10); box-shadow:0 22px 64px rgba(15,23,42,.16), inset 0 1px 0 rgba(255,255,255,.95); } html[data-theme="light"] .mobileMoreScrim, body.theme-light .mobileMoreScrim{ background:rgba(15,23,42,.20); } .mobileMoreSheet__handle{ width:42px; height:4px; border-radius:999px; background:rgba(148,163,184,.55); margin:2px auto 10px; } .mobileMoreSheet__head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:2px 2px 10px; } .mobileMoreSheet__head strong{ display:block; font-size:15px; font-weight:950; } .mobileMoreSheet__head span{ display:block; color:var(--muted); font-size:11.5px; margin-top:2px; } .mobileMoreSheet__close{ width:36px; height:36px; border-radius:14px; border:1px solid var(--border); background:rgba(255,255,255,.06); color:var(--text); font-size:22px; line-height:1; cursor:pointer; } html[data-theme="light"] .mobileMoreSheet__close, body.theme-light .mobileMoreSheet__close{ background:rgba(2,6,23,.035); } .mobileMoreSheet__grid{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; } .mobileMoreSheet__item{ appearance:none; border:1px solid var(--border); background:rgba(255,255,255,.045); color:var(--text); min-height:50px; border-radius:17px; padding:8px 10px; display:flex; align-items:center; justify-content:flex-start; gap:8px; cursor:pointer; font:inherit; font-size:12px; font-weight:850; text-align:right; min-width:0; transition:transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease; } html[data-theme="light"] .mobileMoreSheet__item, body.theme-light .mobileMoreSheet__item{ background:rgba(2,6,23,.025); } .mobileMoreSheet__item:hover, .mobileMoreSheet__item.is-active{ color:var(--accent); border-color:rgba(var(--accent-rgb),.38); background:rgba(var(--accent-rgb),.11); } .mobileMoreSheet__item:active{ transform:scale(.985); } .mobileMoreSheet__ico{ width:30px; height:30px; flex:0 0 30px; border-radius:13px; display:grid; place-items:center; background:rgba(var(--accent-rgb),.11); color:var(--accent); } .mobileMoreSheet__ico svg{ width:18px; height:18px; display:block; } .mobileMoreSheet__item span:last-child{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .mobileMoreSheet__item--gift .mobileMoreSheet__ico{ background:rgba(239,68,68,.13); color:#ef4444; } .mobileMoreSheet__actions{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin-top:10px; } .mobileMoreSheet__mini{ appearance:none; border:1px solid var(--border); background:rgba(255,255,255,.04); color:var(--text); min-height:40px; border-radius:15px; padding:8px 6px; font:inherit; font-size:11.3px; font-weight:850; cursor:pointer; } html[data-theme="light"] .mobileMoreSheet__mini, body.theme-light .mobileMoreSheet__mini{ background:rgba(2,6,23,.025); } .mobileMoreSheet__mini--danger{ color:#ef4444; } body.mobile-more-open{ overflow:hidden; } /* Keep floating widgets above the new navigation but out of its way. */ .supportChat{ bottom:calc(98px + env(safe-area-inset-bottom, 0px)) !important; } .annBell{ bottom:calc(100px + env(safe-area-inset-bottom, 0px)) !important; } } @media (max-width: 390px){ .mobileBottomNav{ left:calc(env(safe-area-inset-left, 0px) + 6px); right:calc(env(safe-area-inset-right, 0px) + 6px); gap:4px; padding:7px 6px; } .mobileBottomNav__item{ font-size:10.3px; } .mobileBottomNav__ico{ width:22px; height:22px; } .mobileBottomNav__ico svg{ width:20px; height:20px; } .mobileBottomNav__item--primary .mobileBottomNav__label{ font-size:10.6px; } .mobileMoreSheet__grid{ gap:7px; } .mobileMoreSheet__item{ padding:8px; font-size:11.6px; } .mobileMoreSheet__actions{ grid-template-columns:1fr; } } body.auth-pending .mobileBottomNav, body.auth-pending .mobileMoreScrim, body.auth-pending .mobileMoreSheet, body.login-locked .mobileBottomNav, body.login-locked .mobileMoreScrim, body.login-locked .mobileMoreSheet{ visibility:hidden !important; pointer-events:none !important; } /* ---------------- v223: refine floating mobile nav + restore sidebar drawer ---------------- */ @media (max-width: 980px){ /* Bring back the original hamburger + off-canvas sidebar. */ .mobMenuBtn{ display:inline-flex !important; align-items:center; justify-content:center; z-index:236; } .sidebarScrim{ display:block; } .sidebarScrim[hidden]{ display:none !important; } body.sidebar-open{ overflow:hidden !important; } .layout{ display:block !important; } .sidebar{ display:flex !important; pointer-events:auto !important; position:fixed; top:0; bottom:0; right:0; height:100dvh; width:min(340px, 88vw); transform:translateX(110%); transition:transform .18s ease; z-index:215; overflow:hidden; } .sidebar.is-open{ transform:translateX(0) !important; } .main{ padding:64px 12px calc(108px + env(safe-area-inset-bottom, 0px)) !important; } /* The temporary settings bottom-sheet is no longer used. */ .mobileMoreScrim, .mobileMoreSheet{ display:none !important; } body.mobile-more-open{ overflow:auto !important; } .mobileBottomNav{ left:calc(env(safe-area-inset-left, 0px) + 14px); right:calc(env(safe-area-inset-right, 0px) + 14px); bottom:calc(env(safe-area-inset-bottom, 0px) + 14px); gap:4px; padding:6px 8px; min-height:68px; border-radius:22px; border:1px solid rgba(148,163,184,.18); background:linear-gradient(180deg, #0b1429, #080f20); box-shadow:0 18px 44px rgba(2,6,23,.28), inset 0 1px 0 rgba(255,255,255,.06); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); } html[data-theme="light"] .mobileBottomNav, body.theme-light .mobileBottomNav{ background:linear-gradient(180deg, #fff, #f7faff); border-color:rgba(15,23,42,.09); box-shadow:0 18px 38px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.94); } .mobileBottomNav__item{ height:52px; padding:5px 2px 4px; border-radius:16px; gap:3px; font-size:10.6px; color:rgba(226,232,240,.88); transition:transform .16s ease, background-color .16s ease, color .16s ease, box-shadow .16s ease; } html[data-theme="light"] .mobileBottomNav__item, body.theme-light .mobileBottomNav__item{ color:#475569; } .mobileBottomNav__item:hover, .mobileBottomNav__item.is-active{ color:#fff; background:rgba(255,255,255,.05); } html[data-theme="light"] .mobileBottomNav__item:hover, html[data-theme="light"] .mobileBottomNav__item.is-active, body.theme-light .mobileBottomNav__item:hover, body.theme-light .mobileBottomNav__item.is-active{ color:var(--accent); background:rgba(var(--accent-rgb), .08); } .mobileBottomNav__item[data-mobile-nav="support"]:hover, .mobileBottomNav__item[data-mobile-nav="support"].is-active{ color:#fff; } html[data-theme="light"] .mobileBottomNav__item[data-mobile-nav="support"]:hover, html[data-theme="light"] .mobileBottomNav__item[data-mobile-nav="support"].is-active, body.theme-light .mobileBottomNav__item[data-mobile-nav="support"]:hover, body.theme-light .mobileBottomNav__item[data-mobile-nav="support"].is-active{ color:var(--accent); } .mobileBottomNav__ico{ width:22px; height:22px; border-radius:12px; } .mobileBottomNav__ico svg{ width:20px; height:20px; } .mobileBottomNav__item--primary{ height:62px; margin-top:-12px; padding-top:6px; border-radius:20px; border:1px solid rgba(255,255,255,.18); background:linear-gradient(180deg, rgba(var(--accent-rgb), .96), rgba(var(--accent-rgb), .82)); box-shadow:0 12px 24px rgba(var(--accent-rgb), .24), inset 0 1px 0 rgba(255,255,255,.18); color:#fff !important; } .mobileBottomNav__item--primary .mobileBottomNav__ico{ width:28px; height:28px; background:rgba(255,255,255,.14); } .mobileBottomNav__item--primary .mobileBottomNav__ico svg{ width:21px; height:21px; } .mobileBottomNav__item--primary .mobileBottomNav__label{ font-size:10.9px; font-weight:900; } .mobileBottomNav__item--primary:hover, .mobileBottomNav__item--primary.is-active, .mobileBottomNav__item--primary:focus-visible{ color:#fff !important; background:linear-gradient(180deg, rgba(var(--accent-rgb), .98), rgba(var(--accent-rgb), .86)) !important; box-shadow:0 14px 26px rgba(var(--accent-rgb), .26), inset 0 1px 0 rgba(255,255,255,.22) !important; } html[data-theme="light"] .mobileBottomNav__item--primary, body.theme-light .mobileBottomNav__item--primary, html[data-theme="light"] .mobileBottomNav__item--primary:hover, html[data-theme="light"] .mobileBottomNav__item--primary.is-active, html[data-theme="light"] .mobileBottomNav__item--primary:focus-visible, body.theme-light .mobileBottomNav__item--primary:hover, body.theme-light .mobileBottomNav__item--primary.is-active, body.theme-light .mobileBottomNav__item--primary:focus-visible{ color:#fff !important; } .supportChat{ bottom:calc(94px + env(safe-area-inset-bottom, 0px)) !important; } .annBell{ bottom:calc(96px + env(safe-area-inset-bottom, 0px)) !important; } } @media (max-width: 390px){ .mobileBottomNav{ left:calc(env(safe-area-inset-left, 0px) + 10px); right:calc(env(safe-area-inset-right, 0px) + 10px); bottom:calc(env(safe-area-inset-bottom, 0px) + 10px); padding:6px 6px; } .mobileBottomNav__item{ font-size:10px; } .mobileBottomNav__item--primary{ margin-top:-10px; } } /* ---------------- v224: mobile drawer overlap polish + compact print settings ---------------- */ @media (max-width: 980px){ /* When the right drawer is open, hide the bottom nav to prevent overlap/touch conflicts. */ body.sidebar-open .mobileBottomNav{ opacity:0; pointer-events:none; transform:translateY(16px) scale(.985); } body.sidebar-open .supportChat, body.sidebar-open .annBell{ opacity:0; pointer-events:none; } /* Keep the sidebar logo clear from the floating menu button. */ .sidebar .brandRow{ padding-top:4px; padding-right:56px; padding-left:4px; min-height:48px; } .sidebar .brandLogoImg{ width:min(100%, 190px); height:44px; object-position:right center; } /* Mobile print settings: more compact and minimal. */ .printActionBtns{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; align-items:start; } .printActionBtns .btn, .filepick .btn{ min-height:40px; padding:8px 10px; border-radius:12px; font-size:13px; box-shadow:none; } .printActionBtns .btn::after, .filepick .btn::after{ display:none; } .printActionBtns .muted.small{ grid-column:1 / -1; font-size:11.5px; line-height:1.5; } .filepick{ gap:8px; align-items:center; } .filepick__name{ font-size:11.5px; line-height:1.45; } .printActions--split{ gap:10px; } .printActions--split .printPreviews, .printPreviews.is-show{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:8px !important; } .printPreviewCard{ position:relative; min-height:76px; } .printPreviewCard[hidden]{ display:none !important; } .printPreviewCard .imgPreview{ display:block; width:100%; max-width:none; height:76px; max-height:none; object-fit:contain; padding:8px; border-radius:14px; } .printPreviewCard__remove{ position:absolute; top:6px; left:6px; z-index:2; width:24px; height:24px; border:1px solid rgba(239,68,68,.24); border-radius:999px; background:rgba(255,255,255,.92); color:#ef4444; font-size:17px; line-height:1; display:grid; place-items:center; box-shadow:0 6px 16px rgba(15,23,42,.14); cursor:pointer; } html[data-theme="dark"] .printPreviewCard__remove{ background:rgba(15,23,42,.92); box-shadow:0 6px 16px rgba(0,0,0,.28); } } @media (max-width: 640px){ .sidebar .brandRow{ padding-right:52px; } .sidebar .brandLogoImg{ width:min(100%, 172px); height:40px; } .printActionBtns{ grid-template-columns:1fr; } .printActionBtns .btn{ width:100%; } .filepick{ flex-direction:column; align-items:stretch; } .filepick .btn{ width:100%; } .printActions--split .printPreviews, .printPreviews.is-show{ grid-template-columns:1fr 1fr !important; } } /* ---------------- v225: fix print preview label flow + lift bottom notifications above mobile nav ---------------- */ /* Bottom floating status messages should stay above the floating mobile nav. */ @media (max-width: 980px){ .statusbar{ bottom:calc(92px + env(safe-area-inset-bottom, 0px)) !important; z-index:260 !important; max-width:min(calc(100vw - 24px), 720px); } } /* Print preview block: hide fully until an asset exists, and show as its own row. */ .printActions--split .printPreviews{ display:none !important; } .printActions--split .printPreviews.is-show{ display:grid !important; } @media (max-width: 980px){ .printActions--split{ flex-wrap:wrap !important; align-items:stretch !important; } .printActionBtns{ flex:1 1 100% !important; width:100% !important; } .printActions--split .printPreviews.is-show{ flex:1 1 100% !important; width:100% !important; margin-top:2px; } .printActions--split .printPreviews .muted.small{ grid-column:1 / -1 !important; display:block !important; text-align:right; margin:0 0 2px 0; } } @media (max-width: 640px){ .printActions--split .printPreviews.is-show{ grid-template-columns:1fr !important; } .printPreviewCard{ width:100%; } } /* ---------------- v226: desktop/mobile preview remove buttons + unified capsule alerts ---------------- */ /* Hide old separate remove buttons everywhere; use corner remove buttons on previews instead. */ #printActions .btn{} #printActions .btn{} #printActions{} #btnClearLogo, #btnClearSignature{ display:none !important; } /* Print preview cards: keep remove button clear from the image on both desktop and mobile. */ .printActions--split .printPreviews.is-show{ align-items:stretch !important; } .printPreviewCard{ position:relative; display:flex; align-items:center; justify-content:center; min-height:108px; padding:20px 12px 12px; border:1px solid var(--border); border-radius:16px; background:rgba(255,255,255,.04); overflow:hidden; } html[data-theme="light"] .printPreviewCard, body.theme-light .printPreviewCard{ background:rgba(255,255,255,.92); border-color:rgba(15,23,42,.10); box-shadow:0 8px 20px rgba(15,23,42,.05); } .printPreviewCard .imgPreview{ display:block; width:100%; max-width:100%; height:72px; max-height:72px; object-fit:contain; padding:0; border:0; background:transparent; box-shadow:none; } .printPreviewCard__remove{ top:8px !important; left:8px !important; width:26px !important; height:26px !important; font-size:18px !important; } @media (max-width: 980px){ .printPreviewCard{ min-height:98px; padding:22px 10px 10px; } .printPreviewCard .imgPreview{ height:64px; max-height:64px; } } /* Make all floating alerts appear as capsule boxes, including errors. */ .statusbar{ white-space:normal !important; text-align:center !important; justify-content:center !important; line-height:1.55; padding:10px 16px !important; border-radius:999px !important; } .statusbar.statusbar--ok{ background:rgba(34,197,94,.94) !important; border-color:rgba(34,197,94,.38) !important; box-shadow:0 12px 28px rgba(22,163,74,.22) !important; color:#fff !important; text-shadow:none !important; } .statusbar.statusbar--err{ background:rgba(220,38,38,.94) !important; border-color:rgba(220,38,38,.40) !important; box-shadow:0 12px 28px rgba(220,38,38,.20) !important; color:#fff !important; text-shadow:none !important; font-weight:800 !important; } :root[data-theme="light"] .statusbar.statusbar--ok, html.theme-light .statusbar.statusbar--ok, body.theme-light .statusbar.statusbar--ok{ background:rgba(34,197,94,.96) !important; border-color:rgba(22,163,74,.34) !important; color:#fff !important; box-shadow:0 12px 28px rgba(22,163,74,.20) !important; } :root[data-theme="light"] .statusbar.statusbar--err, html.theme-light .statusbar.statusbar--err, body.theme-light .statusbar.statusbar--err{ background:rgba(220,38,38,.96) !important; border-color:rgba(220,38,38,.34) !important; color:#fff !important; box-shadow:0 12px 28px rgba(220,38,38,.18) !important; } /* ---------------- v228: desktop remove button parity + red alerts fully pill-shaped ---------------- */ /* Ensure the inline remove button looks the same on desktop as mobile. */ .printPreviewCard__remove{ position:absolute !important; top:8px !important; left:8px !important; z-index:3 !important; width:26px !important; height:26px !important; min-width:26px !important; min-height:26px !important; padding:0 !important; border:1px solid rgba(239,68,68,.24) !important; border-radius:999px !important; background:rgba(255,255,255,.94) !important; color:#ef4444 !important; font-size:18px !important; line-height:1 !important; display:grid !important; place-items:center !important; box-shadow:0 6px 16px rgba(15,23,42,.14) !important; cursor:pointer !important; appearance:none; -webkit-appearance:none; } html[data-theme="dark"] .printPreviewCard__remove{ background:rgba(15,23,42,.92) !important; box-shadow:0 6px 16px rgba(0,0,0,.28) !important; } /* Make success and error alerts use the exact same capsule geometry. */ .statusbar{ width:max-content !important; max-width:min(calc(100vw - 24px), 720px) !important; min-height:46px !important; padding:10px 18px !important; border-radius:9999px !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; } .statusbar.statusbar--ok, .statusbar.statusbar--err{ border-radius:9999px !important; } @media (max-width: 640px){ .statusbar{ max-width:calc(100vw - 20px) !important; min-height:44px !important; padding:10px 16px !important; } } /* ---------------- v229: private-key file chooser inside the field ---------------- */ .keyInputField{ display:flex; flex-direction:column; gap:8px; } .keyInputField .keyInlinePick{ width:100%; min-height:46px; padding:6px 8px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.04); display:flex; align-items:center; gap:8px; flex-wrap:nowrap; box-sizing:border-box; } .keyInputField .keyInlinePick[hidden]{ display:none !important; } .keyInputField .keyInlinePick .btn{ min-height:34px; padding:7px 10px; border-radius:11px; box-shadow:none; flex:0 0 auto; } .keyInputField .keyInlinePick .filepick__name{ flex:1 1 auto; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .keyInputField .keyInlinePick #btnClearKeyFile{ min-width:34px; width:34px; padding:0; font-size:18px; line-height:1; } .keyInputField.is-file-mode > input{ display:none !important; } html[data-theme="light"] .keyInputField .keyInlinePick, body.theme-light .keyInputField .keyInlinePick{ background:rgba(255,255,255,.96); box-shadow:0 8px 18px rgba(15,23,42,.05); } .keyFileRow{ margin-top:-2px; } @media (max-width: 640px){ .keyInputField .keyInlinePick{ padding:6px; gap:6px; } .keyInputField .keyInlinePick .btn{ min-height:32px; padding:6px 9px; } } /* ---------------- v230: always-on private-key file button inside the field ---------------- */ .keyInputField{ display:flex; flex-direction:column; gap:8px; } .keyInputInline{ position:relative; width:100%; } .keyInputInline > input{ width:100%; padding-left:138px !important; box-sizing:border-box; } .keyInputInline__actions{ position:absolute; left:8px; top:50%; transform:translateY(-50%); display:flex; align-items:center; gap:6px; z-index:2; direction:ltr; } .keyInputInline__pick, .keyInputInline__clear{ min-height:32px !important; height:32px !important; border-radius:10px !important; box-shadow:none !important; } .keyInputInline__pick{ padding:6px 10px !important; white-space:nowrap; } .keyInputInline__clear{ width:32px !important; min-width:32px !important; padding:0 !important; font-size:18px !important; line-height:1 !important; } /* Remove old file-row spacing if present */ .keyFileRow{ display:none !important; } @media (max-width: 640px){ .keyInputInline > input{ padding-left:126px !important; } .keyInputInline__actions{ left:6px; gap:5px; } .keyInputInline__pick, .keyInputInline__clear{ min-height:30px !important; height:30px !important; } .keyInputInline__pick{ padding:5px 9px !important; font-size:12px !important; } .keyInputInline__clear{ width:30px !important; min-width:30px !important; } } /* ---------------- v231: mobile compact status messages ---------------- */ @media (max-width: 640px) { .statusbar { max-width: calc(100vw - 20px) !important; min-height: 44px !important; padding: 10px 14px !important; font-size: 12px !important; line-height: 1.5 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } } /* ---------------- v233: narrower mobile side drawer + reliable outside close ---------------- */ @media (max-width: 980px) { .sidebar { width: min(292px, 78vw) !important; } .sidebarScrim { cursor: pointer; } } @media (max-width: 390px) { .sidebar { width: min(276px, 76vw) !important; } } /* ---------------- v234: mobile paired fields in settings ---------------- */ @media (max-width: 980px) { .form--pro > label.sm-12 { grid-column: span 12 !important; } .form--pro > label.sm-6 { grid-column: span 6 !important; } } /* ---------------- v244: clean extraction header after removing decorative AI icons ---------------- */ #invoiceExtractModal .invoiceExtractModal__titleWrap > div{ min-width:0; } #invoiceExtractModal .invoiceExtractHero{ display:block; } @media (max-width:640px){ #invoiceExtractModal .invoiceExtractModal__titleWrap{ display:flex !important; align-items:center !important; flex-wrap:wrap !important; gap:8px !important; } #invoiceExtractModal .invoiceExtractModal__titleWrap > div{ flex:1 1 180px; } #invoiceExtractModal .invoiceExtractModal__beta{ grid-column:auto !important; justify-self:auto !important; margin-top:0 !important; } } /* ---------------- v245: dashboard guest entry + plain extraction modal ---------------- */ .dashGuestWelcome{ display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:16px; padding:16px 18px; border:1px solid var(--dash-line, var(--border)); border-radius:20px; background:var(--card); box-shadow:0 12px 30px rgba(2,6,23,.10); } .dashGuestWelcome__text{ display:grid; gap:5px; min-width:0; } .dashGuestWelcome__text strong{ color:var(--text); font-size:15px; font-weight:900; } .dashGuestWelcome__text span{ color:var(--muted); font-size:13px; line-height:1.8; } .dashGuestWelcome__actions{ display:flex; align-items:center; gap:8px; flex:0 0 auto; } .dashGuestWelcome__actions .btn{ min-width:108px; } @media (max-width:640px){ .dashGuestWelcome{ align-items:stretch; flex-direction:column; padding:14px; } .dashGuestWelcome__actions{ display:grid; grid-template-columns:1fr 1fr; } .dashGuestWelcome__actions .btn{ min-width:0; width:100%; } } #invoiceExtractModal .invoiceExtractModal__panel--pro{ background:var(--panel) !important; background-image:none !important; border-color:var(--border) !important; box-shadow:var(--shadow) !important; } #invoiceExtractModal .invoiceExtractModal__header--pro{ background:var(--panel) !important; background-image:none !important; border-bottom-color:var(--border) !important; } #invoiceExtractModal .invoiceExtractHero, #invoiceExtractModal .invoiceExtractSteps > div, #invoiceExtractModal .invoiceExtractFields, #invoiceExtractModal .invoiceExtractField, #invoiceExtractModal .invoiceExtractModal__note, #invoiceExtractModal .invoiceCameraStage{ background:var(--card) !important; background-image:none !important; border-color:var(--border) !important; box-shadow:none !important; } #invoiceExtractModal .invoiceExtractField:has(input:checked){ background:rgba(var(--accent-rgb),.12) !important; border-color:rgba(var(--accent-rgb),.38) !important; } #invoiceExtractModal .invoiceExtractModal__actions--pro, #invoiceExtractModal .invoiceCameraStage__actions{ background:var(--panel) !important; background-image:none !important; } /* v247: keep the mobile side drawer fully opaque over page content. */ @media (max-width:980px){ .sidebar, html[data-theme="dark"] .sidebar, body.theme-dark .sidebar{ background:#0b1220 !important; background-image:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } html[data-theme="light"] .sidebar, body.theme-light .sidebar{ background:#fff !important; background-image:none !important; } } /* v250: the launcher is independent from the full support panel. */ .supportChat[data-collapsed="1"]{ display:none !important; } .supportChatLauncher{ appearance:none; -webkit-appearance:none; position:fixed; left:24px; right:auto; bottom:18px; z-index:71; display:grid; place-items:center; width:64px; min-width:64px; height:64px; margin:0; padding:0; overflow:visible; cursor:pointer; line-height:0; color:inherit; background:transparent; background-color:transparent; background-image:none; border:0; border-radius:0; box-shadow:none; filter:none; backdrop-filter:none; -webkit-backdrop-filter:none; -webkit-tap-highlight-color:transparent; } .supportChatLauncher[hidden], body.login-locked .supportChatLauncher{ display:none !important; } .supportChatLauncher__img{ display:block; width:60px; height:60px; object-fit:contain; object-position:center; margin:0; padding:0; background:transparent; border:0; border-radius:0; box-shadow:none; filter:none; transform:none; transition:transform .16s ease; pointer-events:none; user-select:none; } .supportChatLauncher:hover .supportChatLauncher__img{ transform:translateY(-2px) scale(1.035); } .supportChatLauncher:focus-visible{ outline:2px solid rgba(59,130,246,.72); outline-offset:3px; border-radius:16px; } .supportChatLauncher.has-support-reply::after{ content:""; position:absolute; top:4px; right:3px; width:9px; height:9px; border-radius:999px; background:#ef4444; box-shadow:0 0 0 2px var(--bg); pointer-events:none; } body.sidebar-open .supportChatLauncher, body.mobile-more-open .supportChatLauncher{ opacity:0; pointer-events:none; } @media (max-width:980px){ .supportChatLauncher{ left:12px; right:auto; bottom:calc(94px + env(safe-area-inset-bottom, 0px)); } } /* ========================= Accounting module ========================= */ .accountingPage{ --accounting-surface:var(--card); --accounting-surface-soft:rgba(255,255,255,.035); --accounting-line:var(--border); display:flex; flex-direction:column; gap:14px; } .accountingHero{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0; border:0; border-radius:0; background:transparent; } .accountingHero h1{margin:0 0 5px;font-size:24px} .accountingHero p, .accountingCard__head p{margin:0;color:var(--muted);font-size:12px;line-height:1.8} .accountingMessage{ padding:11px 14px; border:1px solid var(--accounting-line); border-radius:13px; background:var(--accounting-surface); font-size:13px; line-height:1.8; } .accountingMessage--info{border-color:rgba(var(--accent-rgb),.35)} .accountingMessage--success{border-color:rgba(34,197,94,.48);color:#4ade80} .accountingMessage--error{border-color:rgba(var(--danger-rgb),.48);color:#fca5a5} html[data-theme="light"] .accountingMessage--success, body.theme-light .accountingMessage--success{color:#15803d} html[data-theme="light"] .accountingMessage--error, body.theme-light .accountingMessage--error{color:#b91c1c} .accountingStats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; } .accountingStat{ min-width:0; padding:14px 15px; border:1px solid var(--accounting-line); border-radius:15px; background:var(--accounting-surface); } .accountingStat span{display:block;color:var(--muted);font-size:12px;margin-bottom:7px} .accountingStat strong{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:18px; } .accountingTabs{ display:flex; gap:5px; padding:5px; width:max-content; max-width:100%; overflow:auto; border:1px solid var(--accounting-line); border-radius:14px; background:var(--accounting-surface); } .accountingTab{ border:1px solid transparent; border-radius:10px; padding:9px 14px; background:transparent; color:var(--muted); cursor:pointer; white-space:nowrap; font-weight:800; } .accountingTab:hover{color:var(--text);background:rgba(var(--accent-rgb),.06)} .accountingTab.is-active{ color:var(--accent); background:rgba(var(--accent-rgb),.12); border-color:rgba(var(--accent-rgb),.28); } .accountingPanel{display:block} .accountingSplit{ display:grid; grid-template-columns:minmax(300px,.72fr) minmax(0,1.45fr); gap:14px; align-items:start; } .accountingPage .accountingCard{ background:var(--accounting-surface); backdrop-filter:none; box-shadow:0 10px 28px rgba(0,0,0,.14); margin-bottom:14px; } .accountingCard__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:14px; } .accountingCard__head h2{margin:0 0 4px;font-size:16px} .accountingForm{display:grid;gap:12px} .accountingForm label, .accountingToolbar label, .accountingEntryMeta label{ display:flex; flex-direction:column; gap:6px; min-width:0; color:var(--muted); font-size:12px; font-weight:700; } .accountingForm input, .accountingForm select, .accountingToolbar input, .accountingToolbar select, .accountingEntryMeta input, .accountingEntryMeta select, .accountingEntryLines input, .accountingEntryLines select{ width:100%; min-height:40px; border:1px solid var(--accounting-line); border-radius:11px; padding:8px 10px; background:var(--panel); color:var(--text); outline:none; } .accountingForm input:focus, .accountingForm select:focus, .accountingToolbar input:focus, .accountingToolbar select:focus, .accountingEntryMeta input:focus, .accountingEntryMeta select:focus, .accountingEntryLines input:focus, .accountingEntryLines select:focus{ border-color:rgba(var(--accent-rgb),.65); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.10); } .accountingForm input:disabled, .accountingForm select:disabled, .accountingEntryMeta input:disabled, .accountingEntryMeta select:disabled, .accountingEntryLines input:disabled, .accountingEntryLines select:disabled{ opacity:.74; cursor:not-allowed; } .accountingForm__two{ display:grid; grid-template-columns:1fr 1fr; gap:10px; } .accountingForm--account{grid-template-columns:repeat(2,minmax(0,1fr))} .accountingForm__span2{grid-column:1/-1} .accountingForm__actions{display:flex;justify-content:flex-end} .accountingCheck{ display:flex !important; flex-direction:row !important; align-items:center; gap:8px !important; color:var(--text) !important; cursor:pointer; } .accountingCheck input{ width:18px !important; height:18px !important; min-height:18px !important; flex:0 0 18px; accent-color:var(--accent); } .accountingCheck--inline{align-self:end;min-height:40px} .accountingToolbarCard{padding:13px 15px !important} .accountingToolbar{ display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; } .accountingSearch{flex:1 1 280px} .accountingToolbar__actions{ display:flex; align-items:center; justify-content:flex-end; gap:8px; margin-inline-start:auto; } .accountingToolbar--entries > label{flex:1 1 170px} .accountingToolbar--entries > label:first-child{flex:0 1 180px} .accountingCount{ display:inline-flex; align-items:center; min-height:30px; padding:4px 9px; border:1px solid var(--accounting-line); border-radius:999px; color:var(--muted); font-size:12px; white-space:nowrap; } .accountingListState{min-height:80px} .accountingEmpty{ display:flex; min-height:110px; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:20px; text-align:center; color:var(--muted); border:1px dashed var(--accounting-line); border-radius:13px; } .accountingEmpty strong{color:var(--text)} .accountingEmpty span{font-size:12px} .accountingTable{min-width:720px} .accountingTable th{white-space:nowrap} .accountingTable td{vertical-align:middle} .accountingTable tbody tr:hover{background:rgba(var(--accent-rgb),.035)} .accountingTable tr.is-inactive{opacity:.62} .accountingTable--accounts{min-width:820px} .accountingTable--entries{min-width:980px} .accountingDateRange{display:flex;align-items:center;gap:7px;white-space:nowrap} .accountingCode{ direction:ltr; text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; } .accountingAmount{ direction:ltr; text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; } .accountingAccountTitle{ display:flex; flex-direction:column; gap:2px; padding-inline-start:calc(var(--account-depth, 0) * 18px); } .accountingAccountTitle small, .accountingCellHint{display:block;color:var(--muted);font-size:11px;margin-top:3px} .accountingBadges, .accountingRowActions{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; } .accountingBadge{ display:inline-flex; align-items:center; min-height:25px; padding:3px 8px; border:1px solid var(--accounting-line); border-radius:999px; background:rgba(255,255,255,.03); color:var(--muted); font-size:11px; white-space:nowrap; } .accountingBadge--primary{border-color:rgba(var(--accent-rgb),.38);background:rgba(var(--accent-rgb),.10);color:var(--primary-200)} .accountingBadge--ok{border-color:rgba(34,197,94,.38);background:rgba(34,197,94,.09);color:#4ade80} .accountingBadge--danger{border-color:rgba(var(--danger-rgb),.42);background:rgba(var(--danger-rgb),.09);color:#fca5a5} .accountingBadge--muted{color:var(--muted)} .accountingDangerText{color:#fca5a5 !important;border-color:rgba(var(--danger-rgb),.3) !important} html[data-theme="light"] .accountingBadge--ok, body.theme-light .accountingBadge--ok{color:#15803d} html[data-theme="light"] .accountingBadge--danger, body.theme-light .accountingBadge--danger, html[data-theme="light"] .accountingDangerText, body.theme-light .accountingDangerText{color:#b91c1c !important} .accountingEntryEditor{scroll-margin-top:12px} .accountingEntryTitleRow{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .accountingEntryTitleRow h2{margin:0} .accountingEntryMeta{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; margin-bottom:14px; } .accountingEntryMeta__description{grid-column:1/-1} .accountingEntryLinesWrap{ border:1px solid var(--accounting-line); border-radius:13px; } .accountingEntryLines{min-width:930px} .accountingEntryLines th, .accountingEntryLines td{padding:8px 6px} .accountingEntryLines th:first-child, .accountingEntryLines td:first-child{width:52px;text-align:center} .accountingEntryLines td:nth-child(2){min-width:240px} .accountingEntryLines td:nth-child(2) .selectx.open{z-index:120} .accountingEntryLines td:nth-child(2) .selectx-btn{min-height:46px} .accountingEntryLines td:nth-child(3){min-width:220px} .accountingEntryLines td:nth-child(4), .accountingEntryLines td:nth-child(5){width:150px} .accountingMoneyInput{font-variant-numeric:tabular-nums;text-align:left} .accountingLineRemove{ width:31px; height:31px; border:1px solid rgba(var(--danger-rgb),.34); border-radius:9px; background:rgba(var(--danger-rgb),.07); color:#fca5a5; cursor:pointer; font-size:19px; } .accountingEntryFooter{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px; margin-top:13px; } .accountingEntryTotals{ display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; } .accountingEntryTotals > span{ display:inline-flex; gap:5px; padding:6px 9px; border:1px solid var(--accounting-line); border-radius:10px; color:var(--muted); font-size:12px; } .accountingEntryTotals strong{color:var(--text)} .accountingEntryDifference{color:#fca5a5 !important} .accountingEntryDifference.is-balanced{color:#4ade80 !important;border-color:rgba(34,197,94,.34)} .accountingEntryFooter__actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap} .accountingReportFilters{ display:grid; grid-template-columns:repeat(5,minmax(150px,1fr)); gap:12px; align-items:end; } .accountingReportFilters label{ display:flex; min-width:0; flex-direction:column; gap:6px; color:var(--muted); font-size:12px; font-weight:700; } .accountingReportFilters input, .accountingReportFilters select{ width:100%; min-height:40px; border:1px solid var(--accounting-line); border-radius:11px; padding:8px 10px; background:var(--panel); color:var(--text); outline:none; } .accountingReportFilters input:focus, .accountingReportFilters select:focus{ border-color:rgba(var(--accent-rgb),.65); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.10); } .accountingReportDraftCheck{align-self:end} .accountingReportActions{ grid-column:1/-1; margin-inline-start:0; justify-content:flex-start; } .accountingReportMeta{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; } .accountingReportMeta > span{ display:inline-flex; align-items:center; min-height:32px; padding:5px 10px; border:1px solid var(--accounting-line); border-radius:999px; background:var(--accounting-surface); color:var(--muted); font-size:12px; } .accountingReportMeta strong{color:var(--text)} .accountingReportResultCard{min-height:210px} .accountingReportTableWrap{max-height:68vh;overflow:auto} .accountingReportTable{min-width:980px} .accountingReportTable thead th{ position:sticky; top:0; z-index:2; background:var(--accounting-surface); } .accountingReportTable thead tr:nth-child(2) th{top:38px} .accountingReportTable tfoot th, .accountingReportTable tfoot td{ background:rgba(var(--accent-rgb),.08); color:var(--text); font-weight:900; } .accountingTrialTable{min-width:1080px} .accountingJournalBookTable{min-width:1180px} .accountingLedgerSummaryTable{min-width:1050px} .accountingLedgerTable{min-width:1180px} .accountingMoney{ direction:ltr; text-align:left; white-space:nowrap; font-variant-numeric:tabular-nums; } .accountingLedgerTable td small{ display:block; margin-top:4px; color:var(--muted); font-size:11px; } .accountingLedgerHeading{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:14px; padding:12px 13px; border:1px solid var(--accounting-line); border-radius:13px; background:rgba(var(--accent-rgb),.045); } .accountingLedgerHeading > div:first-child{display:flex;flex-direction:column;gap:4px} .accountingLedgerHeading span{color:var(--muted);font-size:12px} .accountingLedgerBalances{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end} .accountingLedgerBalances > span{ padding:5px 9px; border:1px solid var(--accounting-line); border-radius:10px; background:var(--accounting-surface); } .accountingPager{ display:flex; align-items:center; justify-content:center; gap:10px; margin-top:13px; color:var(--muted); font-size:12px; } .accountingModal{ position:fixed; inset:0; z-index:1300; display:grid; place-items:center; padding:18px; } .accountingModal__scrim{ position:absolute; inset:0; background:rgba(2,6,23,.72); } .accountingModal__panel{ position:relative; width:min(520px,100%); padding:18px; border:1px solid var(--accounting-line); border-radius:17px; background:var(--panel); box-shadow:0 22px 70px rgba(0,0,0,.42); } html[data-theme="light"] .accountingPage, body.theme-light .accountingPage{ --accounting-surface:#fff; --accounting-surface-soft:rgba(15,23,42,.025); } html[data-theme="light"] .accountingForm input, html[data-theme="light"] .accountingForm select, html[data-theme="light"] .accountingToolbar input, html[data-theme="light"] .accountingToolbar select, html[data-theme="light"] .accountingEntryMeta input, html[data-theme="light"] .accountingEntryMeta select, html[data-theme="light"] .accountingEntryLines input, html[data-theme="light"] .accountingEntryLines select, html[data-theme="light"] .accountingReportFilters input, html[data-theme="light"] .accountingReportFilters select, body.theme-light .accountingForm input, body.theme-light .accountingForm select, body.theme-light .accountingToolbar input, body.theme-light .accountingToolbar select, body.theme-light .accountingEntryMeta input, body.theme-light .accountingEntryMeta select, body.theme-light .accountingEntryLines input, body.theme-light .accountingEntryLines select, body.theme-light .accountingReportFilters input, body.theme-light .accountingReportFilters select{background:#fff} @media (max-width:1100px){ .accountingSplit{grid-template-columns:1fr} .accountingStats{grid-template-columns:repeat(2,minmax(0,1fr))} .accountingEntryFooter{grid-template-columns:1fr} .accountingEntryFooter__left, .accountingEntryFooter__actions{justify-content:center} .accountingReportFilters{grid-template-columns:repeat(3,minmax(150px,1fr))} } @media (max-width:700px){ .accountingPage{gap:10px} .accountingHero{align-items:flex-start;padding:0;flex-direction:column} .accountingHero .btn{width:100%} .accountingHero h1{font-size:21px} .accountingStats{gap:7px} .accountingStat{padding:11px} .accountingStat strong{font-size:15px} .accountingTabs{width:100%} .accountingTab{flex:1 0 auto;padding:8px 10px} .accountingPage .accountingCard{padding:13px;margin-bottom:10px} .accountingCard__head{flex-direction:column;gap:8px} .accountingCard__head > .btn{align-self:stretch} .accountingForm__two, .accountingForm--account, .accountingEntryMeta{grid-template-columns:1fr} .accountingForm__span2, .accountingEntryMeta__description{grid-column:auto} .accountingToolbar, .accountingToolbar--entries{display:grid;grid-template-columns:1fr;width:100%} .accountingToolbar__actions{display:grid;grid-template-columns:1fr 1fr;width:100%;margin:0} .accountingToolbar__actions .btn{width:100%} .accountingCheck--inline{align-self:auto} .accountingDateRange{flex-wrap:wrap} .accountingEntryTotals{justify-content:flex-start} .accountingEntryFooter__left, .accountingEntryFooter__actions{justify-content:stretch} .accountingEntryFooter__left .btn, .accountingEntryFooter__actions .btn{width:100%} .accountingEntryFooter__actions{display:grid;grid-template-columns:1fr} .accountingReportFilters{grid-template-columns:1fr} .accountingReportActions{display:grid;grid-template-columns:1fr} .accountingLedgerHeading{flex-direction:column} .accountingLedgerBalances{justify-content:flex-start} .accountingReportTableWrap{max-height:none} } @media (max-width:420px){ .accountingStats{grid-template-columns:1fr 1fr} .accountingStat span{font-size:11px} .accountingToolbar__actions{grid-template-columns:1fr} } /* Settings tabs */ .settingsPage{ display:flex; flex-direction:column; gap:14px; } .settingsPage__head{ padding:0; border:0; border-radius:0; background:transparent; } .settingsPage__head h1{margin:0 0 4px;font-size:18px} .settingsPage__head p{margin:0;color:var(--muted);font-size:13px;line-height:1.8} .settingsTabs{ display:flex; align-items:center; gap:4px; width:100%; max-width:100%; padding:0; overflow:auto; border:0; border-bottom:1px solid var(--border); border-radius:0; background:transparent; } .settingsTab{ flex:0 0 auto; padding:9px 14px; border:0; border-bottom:2px solid transparent; border-radius:0; background:transparent; color:var(--muted); cursor:pointer; white-space:nowrap; font-weight:800; } .settingsTab:hover{color:var(--text);background:transparent} .settingsTab.is-active{ color:var(--text); border-bottom-color:var(--accent); background:transparent; } .settingsPanel{min-width:0} .settingsFiscalPanel .accountingCard{ background:var(--card); backdrop-filter:none; box-shadow:0 10px 28px rgba(0,0,0,.14); } .settingsFiscalPanel .accountingMessage{margin-bottom:14px} .performanceSettingsCard{ width:min(720px,100%); padding:18px; } .performanceSettingsCard__head h2{margin:0 0 5px;font-size:17px} .performanceSettingsCard__head p{ margin:0; color:var(--muted); font-size:13px; line-height:1.8; } .performanceSettingsList{ display:grid; gap:0; margin-top:14px; border-top:1px solid var(--border); } .performanceSetting{ display:flex; align-items:center; justify-content:space-between; gap:18px; padding:14px 2px; border-bottom:1px solid var(--border); cursor:pointer; } .performanceSetting > span{display:grid;gap:4px} .performanceSetting strong{font-size:14px} .performanceSetting small{color:var(--muted);font-size:12px;line-height:1.7} .performanceSetting input{ width:42px; height:23px; flex:0 0 auto; accent-color:var(--accent); cursor:pointer; } .performanceSettingsNote{ margin:13px 0 0; color:var(--muted); font-size:12px; line-height:1.8; } @media (max-width:700px){ .settingsPage{gap:10px} .settingsPage__head{padding:0} .settingsPage__head h1{font-size:18px} .settingsTabs{width:100%} .settingsTab{flex:1 0 auto;text-align:center;padding:8px 10px} .performanceSettingsCard{padding:14px} } /* v258: compact master/detail pages and sales navigation */ .entityPage{ display:grid; gap:14px; } .entitySplit{ align-items:start; } @media (min-width:981px){ .entitySplit--items{ grid-template-columns:minmax(360px,.86fr) minmax(430px,1.14fr); } } /* v262: compact Excel actions inside existing list toolbars */ .listToolbar__actions{ display:flex; flex:0 0 auto; flex-wrap:nowrap; align-items:flex-end; gap:8px; } .listToolbar__actions > .listToolbar__btn{ width:auto; min-width:106px; flex:0 0 auto; } .listExcel{ position:relative; flex:0 0 auto; } .listExcel > summary{ list-style:none; cursor:pointer; user-select:none; } .listExcel > summary::-webkit-details-marker{display:none} .listExcel__trigger{ width:40px; min-width:40px; height:40px; padding:8px; } .listExcel__trigger svg{ width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; } .listExcel[open] > summary{ border-color:rgba(var(--accent-rgb),.36); color:var(--accent); } .listExcel__menu{ position:absolute; z-index:80; inset-inline-end:0; top:calc(100% + 7px); min-width:210px; padding:6px; border:1px solid var(--border); border-radius:12px; background:var(--card); box-shadow:0 16px 38px rgba(0,0,0,.24); } .listExcel__menu button{ display:block; width:100%; padding:10px 11px; border:0; border-radius:8px; background:transparent; color:var(--text); text-align:right; cursor:pointer; font:inherit; font-size:12px; } .listExcel__menu button:hover{ background:rgba(var(--accent-rgb),.1); color:var(--accent); } @media (max-width:700px){ .listToolbar__actions{ width:100%; display:grid; grid-template-columns:minmax(0,1fr) 40px; align-items:end; } .listToolbar__actions > .listToolbar__btn{ width:100%; min-width:0; } .listExcel__menu{ position:fixed; inset-inline:14px; top:auto; bottom:calc(76px + env(safe-area-inset-bottom)); min-width:0; } } /* Optional light mode for low-power devices. */ html[data-ui-motion="off"], html[data-ui-motion="off"] body{ scroll-behavior:auto !important; } html[data-ui-motion="off"] *, html[data-ui-motion="off"] *::before, html[data-ui-motion="off"] *::after{ animation-duration:.001ms !important; animation-delay:0ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; transition-delay:0ms !important; } html[data-ui-effects="off"] *, html[data-ui-effects="off"] *::before, html[data-ui-effects="off"] *::after{ box-shadow:none !important; text-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } /* v263: one consistent register/list pattern for master data pages. */ .entityTabs{ width:100%; margin:0; } .entityTabbedPanels{ display:block; min-width:0; } .entityTabPanel{ min-width:0; width:100%; } .entityTabbedPanels--customers .entityTabPanel--editor{ max-width:1080px; margin-inline:auto; } .entityTabbedPanels--items .entityTabPanel--editor{ max-width:none; margin-inline:0; } .entityTabbedPanels--items .itemEditCard > .form{ max-width:none; margin-inline:auto; } .entityTabbedPanels .entityTabPanel--list{ width:100%; } @media (max-width:700px){ .entityTabbedPanels--customers .entityTabPanel--editor, .entityTabbedPanels--items .entityTabPanel--editor, .entityTabbedPanels--items .itemEditCard > .form{ max-width:none; } } /* Category creation remains available while the v264 item layout is restored. */ .itemCategoryField{ position:relative; z-index:0; } .itemCategoryField:has(.selectx.open){ z-index:30; } .itemCategorySelectControl{ display:grid; grid-template-columns:minmax(0,1fr) 42px; align-items:stretch; gap:7px; width:100%; min-width:0; } .itemCategorySelectControl > select, .itemCategorySelectControl > .selectx{ width:100%; min-width:0; } .itemCategorySelectControl__add{ width:42px; min-width:42px; min-height:42px !important; height:42px; padding:0 !important; border-color:color-mix(in srgb,var(--accent) 34%,var(--border) 66%) !important; background:color-mix(in srgb,var(--accent) 11%,transparent) !important; color:color-mix(in srgb,var(--accent) 78%,#fff 22%) !important; font-size:22px; font-weight:700; line-height:1; box-shadow:none !important; } .itemCategorySelectControl__add:hover{ border-color:color-mix(in srgb,var(--accent) 56%,var(--border) 44%) !important; background:color-mix(in srgb,var(--accent) 17%,transparent) !important; } .itemCategoryNew{ display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:6px; align-items:center; margin-top:7px; } .itemCategoryNew input{ min-width:0; width:100%; } .itemCategoryNew .btn{ min-height:40px; padding-inline:12px; border-radius:10px; box-shadow:none; } @media (max-width:700px){ .itemCategorySelectControl{ grid-template-columns:minmax(0,1fr) 40px; } .itemCategorySelectControl__add{ width:40px; min-width:40px; height:40px; min-height:40px !important; } .itemCategoryNew{ grid-template-columns:1fr 1fr; } .itemCategoryNew input{ grid-column:1 / -1; } } /* v264: purchase-style, lighter master-data editors. */ .masterDataEditor{ padding:16px; background:var(--card); backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:none; } .masterDataEditor__head{ min-height:48px; padding-bottom:10px; border-bottom:1px solid var(--border); } .masterDataEditor__head h2{ margin:0; font-size:17px; } .masterDataForm{ margin-top:14px; gap:12px; align-items:start; } .masterDataForm > label, .masterDataForm > .row, .masterDataForm > .formmsg{ align-self:start; } .masterDataForm .masterDataSection{ margin:2px 0 0; padding:10px 0 5px; border:0; border-top:1px solid var(--border); border-radius:0; background:transparent; color:var(--muted); font-size:12px; font-weight:850; } .masterDataForm .masterDataSection:first-child{ padding-top:0; border-top:0; } .masterDataForm label{ color:var(--muted); font-size:12px; } .masterDataForm input, .masterDataForm select, .masterDataForm .selectx-btn{ min-height:42px; } .itemCatalogForm .inputAction--moadian{ min-height:42px; } /* v267: full-width item editor with one restrained surface palette. */ body:has(.page[data-page="items"]:not([hidden])){ background:var(--bg); } .page[data-page="items"]{ --item-editor-surface:color-mix(in srgb,var(--bg) 76%,var(--card)); --item-field-surface:color-mix(in srgb,var(--bg) 18%,var(--panel)); --item-editor-border:rgba(var(--border-rgb),.24); } .page[data-page="items"] .itemEditCard{ width:100%; background:var(--item-editor-surface); border-color:var(--item-editor-border); box-shadow:none; } .page[data-page="items"] .itemEditCard .masterDataEditor__head, .page[data-page="items"] .itemEditCard .masterDataSection{ border-color:var(--item-editor-border); } .page[data-page="items"] .itemCatalogForm input, .page[data-page="items"] .itemCatalogForm select, .page[data-page="items"] .itemCatalogForm .selectx-btn{ background:var(--item-field-surface); border-color:var(--item-editor-border); box-shadow:none; } .page[data-page="items"] .itemCatalogForm .inputAction--moadian{ background:transparent; } .page[data-page="items"] .itemCategoryField .selectx.open{ z-index:5; } .page[data-page="items"] .itemCategorySelectControl .selectx-menu{ top:calc(100% + 8px); right:0; left:0; margin-top:0; padding:6px; z-index:5000; max-height:280px; background:var(--app-menu-surface,var(--item-field-surface)); border-color:var(--app-surface-border,var(--item-editor-border)); border-radius:12px; box-shadow:0 10px 24px rgba(0,0,0,.20); } .page[data-page="items"] .itemCategoryField .selectx-item{ padding:10px 12px; } .page[data-page="items"] .itemCategoryField .selectx-item:hover{ background:color-mix(in srgb,var(--app-field-surface,var(--item-field-surface)) 92%,var(--text)); } .page[data-page="items"] .itemCategoryField .selectx-item.is-selected{ background:var(--app-selected-surface,color-mix(in srgb,var(--item-field-surface) 86%,var(--accent))); } .page[data-page="items"] .itemCategoryField .selectx-item[data-value="__new__"]{ margin-top:4px; box-shadow:inset 0 1px var(--item-editor-border); } .table--items .itemCol--type, .table--items .itemCol--status{ min-width:72px; white-space:nowrap; } .table--items .itemCol--category{ min-width:120px; max-width:180px; overflow:hidden; text-overflow:ellipsis; } @media (max-width:700px){ .masterDataEditor{padding:13px} .masterDataEditor__head{min-height:44px} .itemCatalogForm > label{ grid-column:span 12 !important; } } /* v269: shared surface hierarchy for every internal page, in dark and light themes. */ body{ background:var(--bg); } .main .page{ --app-card-surface:var(--card); --app-field-surface:color-mix(in srgb,var(--bg) 18%,var(--panel)); --app-menu-surface:color-mix(in srgb,var(--bg) 10%,var(--panel)); --app-surface-border:rgba(var(--border-rgb),.24); --app-selected-surface:color-mix(in srgb,var(--app-field-surface) 86%,var(--accent)); } :root[data-theme="light"] .main .page, html.theme-light .main .page, body.theme-light .main .page{ --app-card-surface:#ffffff; --app-field-surface:#f1f4f8; --app-menu-surface:#ffffff; --app-surface-border:rgba(15,23,42,.16); --app-selected-surface:rgba(var(--accent-rgb),.10); } .main .page .card{ background:var(--app-card-surface); border-color:var(--app-surface-border); box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; } .main .page input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), .main .page select, .main .page textarea, .main .page .selectx-btn{ background:var(--app-field-surface); border-color:var(--app-surface-border); box-shadow:none; } .main .page .selectx-menu{ background:var(--app-menu-surface); border-color:var(--app-surface-border); box-shadow:0 10px 24px rgba(0,0,0,.20); } .main .page .selectx-searchWrap{ background:var(--app-menu-surface); border-color:var(--app-surface-border); } .main .page .selectx-item:hover{ background:color-mix(in srgb,var(--app-field-surface) 92%,var(--text)); } .main .page .selectx-item.is-selected{ background:var(--app-selected-surface); } .main .page .inventoryTabs, .main .page .settingsTabs, .main .page .masterDataEditor__head, .main .page .masterDataSection, .main .page .inventoryLines{ border-color:var(--app-surface-border); } .main .page .accountingTabs{ background:var(--app-card-surface); border-color:var(--app-surface-border); } /* v273: dark canvas follows the exact light-theme gradient structure. */ html[data-theme="dark"] body{ background:linear-gradient(180deg, var(--bg) 0%, var(--bg2) 100%); } /* v274: remove only redundant full-width editor lines; keep titled dividers. */ .main .page .masterDataEditor__head{ border-bottom:0; } .main .page .masterDataSection, .main .page .inventoryLines{ border-top:0; } /* v275: purchase lines follow the compact sales-invoice table language. */ .inventoryPurchaseLinesTable{ width:100%; min-width:1320px; font-size:12px; table-layout:auto; } .inventoryPurchaseLinesTable th, .inventoryPurchaseLinesTable td{ padding:9px 6px; white-space:nowrap; vertical-align:middle; } .inventoryPurchaseLinesTable tbody tr{ transition:background-color .12s ease; } .inventoryPurchaseLinesTable tbody tr:hover{ background:color-mix(in srgb,var(--app-field-surface) 52%,transparent); } .inventoryPurchaseLinesTable input, .inventoryPurchaseLinesTable select, .inventoryPurchaseLinesTable .selectx-btn{ min-height:38px; border-radius:10px; box-shadow:none !important; } .inventoryPurchaseLinesTable .inventoryPurchaseLine__index{ width:38px; min-width:38px; text-align:center; font-variant-numeric:tabular-nums; } .inventoryPurchaseLinesTable .inventoryPurchaseLine__item{ width:100%; min-width:300px; } .inventoryPurchaseLinesTable .inventoryPurchaseLine__item select, .inventoryPurchaseLinesTable .inventoryPurchaseLine__item .selectx{ width:100%; min-width:290px; } .inventoryPurchaseLinesTable .inventoryPurchaseLine__expense{ min-width:230px; } .inventoryPurchaseLinesTable .inventoryPurchaseLine__expense select{ width:100%; min-width:220px; } .inventoryPurchaseLinesTable .inventoryPurchaseLine__number input{ width:120px; min-width:108px; } .inventoryPurchaseLinesTable .inventoryPurchaseLine__vat input{ width:82px; min-width:72px; } .inventoryPurchaseLinesTable .inventoryPurchaseLine__number input, .inventoryPurchaseLinesTable .inventoryPurchaseLine__vat input{ direction:ltr; text-align:left; } .inventoryPurchaseLinesTable .inventoryPurchaseLine__total{ min-width:130px; text-align:center; font-weight:800; font-variant-numeric:tabular-nums; } .inventoryPurchaseLinesTable .inventoryPurchaseLine__actions{ width:54px; min-width:54px; text-align:center; } .inventoryLineRemove, .page--send .invoiceLineRemove{ display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; min-width:34px; min-height:34px; padding:0; border:1px solid color-mix(in srgb,var(--danger) 32%,var(--app-surface-border)); border-radius:10px; background:transparent; color:var(--danger); font-size:19px; line-height:1; cursor:pointer; box-shadow:none !important; transition:background-color .12s ease,border-color .12s ease,color .12s ease; } .inventoryLineRemove:hover, .page--send .invoiceLineRemove:hover{ border-color:color-mix(in srgb,var(--danger) 58%,var(--app-surface-border)); background:color-mix(in srgb,var(--danger) 10%,transparent); } .inventoryLineRemove:focus-visible, .page--send .invoiceLineRemove:focus-visible{ outline:2px solid color-mix(in srgb,var(--danger) 62%,transparent); outline-offset:2px; } .page--send .table--lines .invoiceLineRemove{ flex:0 0 34px; } /* v276: always-visible purchase row, full-width grid and sales-inspired totals. */ .inventoryPurchaseSummary{ width:100%; margin-top:18px; padding-top:16px; border-top:1px solid var(--app-surface-border); } .inventoryPurchaseSummary__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; } .inventoryPurchaseSummary__head strong{ font-size:14px; font-weight:900; } .inventoryPurchaseSummary .inventoryTotals{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin-top:0; color:inherit; } .inventoryPurchaseSummary .inventoryTotals .totals__row{ display:grid; grid-template-columns:1fr; align-content:center; gap:5px; min-width:0; min-height:68px; padding:10px 12px; border:1px solid rgba(148,163,184,.14); border-radius:14px; background:linear-gradient(180deg,rgba(255,255,255,.030),rgba(255,255,255,.014)); } .inventoryPurchaseSummary .inventoryTotals .totals__row span{ color:var(--muted); font-size:12px; font-weight:750; white-space:nowrap; } .inventoryPurchaseSummary .inventoryTotals .totals__row b{ direction:ltr; unicode-bidi:isolate; overflow:hidden; color:var(--text); font-size:15px; font-weight:900; font-variant-numeric:tabular-nums; text-overflow:ellipsis; white-space:nowrap; } .inventoryPurchaseSummary .inventoryTotals .totals__pay{ border-color:rgba(var(--accent-rgb),.28); background:linear-gradient(180deg,rgba(var(--accent-rgb),.15),rgba(var(--accent-rgb),.075)); box-shadow:inset 0 1px 0 rgba(255,255,255,.055); } .inventoryPurchaseSummary .inventoryTotals .totals__pay b{ color:#fff; font-size:17px; } :root[data-theme="light"] .inventoryPurchaseSummary .inventoryTotals .totals__row, html.theme-light .inventoryPurchaseSummary .inventoryTotals .totals__row, body.theme-light .inventoryPurchaseSummary .inventoryTotals .totals__row{ border-color:rgba(15,23,42,.08); background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.88)); box-shadow:0 8px 18px rgba(2,6,23,.035); } :root[data-theme="light"] .inventoryPurchaseSummary .inventoryTotals .totals__pay, html.theme-light .inventoryPurchaseSummary .inventoryTotals .totals__pay, body.theme-light .inventoryPurchaseSummary .inventoryTotals .totals__pay{ border-color:rgba(var(--accent-rgb),.20); background:linear-gradient(180deg,rgba(var(--accent-rgb),.11),rgba(var(--accent-rgb),.055)); } :root[data-theme="light"] .inventoryPurchaseSummary .inventoryTotals .totals__pay b, html.theme-light .inventoryPurchaseSummary .inventoryTotals .totals__pay b, body.theme-light .inventoryPurchaseSummary .inventoryTotals .totals__pay b{ color:var(--text); } @media (max-width:1100px){ .inventoryPurchaseSummary .inventoryTotals{ grid-template-columns:repeat(3,minmax(0,1fr)); } } @media (max-width:640px){ .inventoryPurchaseSummary .inventoryTotals{ grid-template-columns:1fr 1fr; } .inventoryPurchaseSummary .inventoryTotals .totals__pay{ grid-column:1 / -1; } } /* v287: treasury sections use the same two-tab pattern as master-data pages */ .treasuryContextTabs{ margin-top:0; margin-bottom:12px; } .treasuryContextTabs[hidden]{display:none!important;} .treasuryPage .treasuryPanel[hidden]{display:none!important;} @media (max-width:720px){ .treasuryContextTabs{width:100%;} .treasuryContextTabs .inventoryTab{flex:1 1 0;justify-content:center;} } /* v299: warehouse pictogram at actual sidebar icon sizes */ .nav__ico--warehouse{ width:22px!important; height:22px!important; flex:0 0 22px!important; opacity:1!important; overflow:visible; } .mobileMoreSheet__warehouse{ width:22px!important; height:22px!important; overflow:visible; } /* v301: Settings > Plugins (display-only / coming soon) */ .pluginsSettingsPanel{ min-width:0; } .pluginsIntroCard{ display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 20px; margin-bottom:14px; border:1px solid var(--border); border-radius:18px; background:var(--card); } .pluginsIntroCard h2{ margin:0 0 5px; font-size:18px; } .pluginsIntroCard p{ margin:0; color:var(--muted); line-height:1.85; font-size:13px; } .pluginsGrid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; } .pluginCard{ position:relative; min-width:0; min-height:248px; display:flex; flex-direction:column; padding:16px; border:1px solid var(--border); border-radius:18px; background:var(--card); box-shadow:0 10px 28px rgba(0,0,0,.08); overflow:hidden; } .pluginCard__head{ display:flex; align-items:flex-start; justify-content:flex-end; gap:10px; margin-bottom:13px; } .pluginCard__status{ display:inline-flex; align-items:center; min-height:28px; padding:4px 10px; border:1px solid rgba(239,68,68,.22); border-radius:999px; background:rgba(239,68,68,.08); color:#ef4444; font-size:11px; font-weight:850; white-space:nowrap; } .pluginCard h3{ margin:0 0 7px; font-size:15px; } .pluginCard p{ margin:0; color:var(--muted); font-size:12px; line-height:1.85; } html[data-theme="light"] .pluginCard, body.theme-light .pluginCard, html[data-theme="light"] .pluginsIntroCard, body.theme-light .pluginsIntroCard{ box-shadow:0 10px 26px rgba(15,23,42,.06); } @media (max-width:1050px){ .pluginsGrid{grid-template-columns:repeat(2,minmax(0,1fr));} } @media (max-width:680px){ .pluginsIntroCard{align-items:flex-start;flex-direction:column;} .pluginsGrid{grid-template-columns:1fr;} .pluginCard{min-height:220px;} .pluginCard__actions{justify-content:stretch;} .pluginCard__actions .btn{flex:1 1 0;min-width:0;} } .pluginCard__form{ margin-top:auto; padding-top:14px; display:grid; gap:12px; } .pluginCard__field{ display:grid; gap:6px; } .pluginCard__field span{ font-size:12px; font-weight:780; color:var(--text); } .pluginCard__field .input{ min-height:40px; } .pluginCard__actions{ display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; } .pluginCard__actions .btn{ min-width:104px; } /* ---------------- v307: party/accounting icons + comprehensive party ledger ---------------- */ .navGroup[data-group="customers"] > .navGroup__btn .nav__ico, .navGroup[data-group="accounting"] > .navGroup__btn .nav__ico{ display:block !important; flex:0 0 21px; width:21px; height:21px; } .navGroup[data-group="customers"] .nav__item--sub .nav__ico, .navGroup[data-group="accounting"] .nav__item--sub .nav__ico{ display:block; width:18px; height:18px; flex:0 0 18px; opacity:.88; } .partyLedgerPage{display:grid;gap:14px;min-width:0} .partyLedgerToolbar{display:grid;grid-template-columns:minmax(220px,1.2fr) minmax(260px,1fr) auto;gap:14px;align-items:end;padding:16px} .partyLedgerToolbar__party{display:grid;gap:4px;min-width:0} .partyLedgerToolbar__label{color:var(--muted);font-size:12px;font-weight:800} .partyLedgerToolbar__party strong{font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .partyLedgerToolbar__party small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .partyLedgerToolbar__filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .partyLedgerToolbar__filters label{display:grid;gap:6px;color:var(--muted);font-size:12px;font-weight:800} .partyLedgerToolbar__filters input{width:100%;border:1px solid var(--border);background:var(--input-bg,var(--card));color:var(--text);border-radius:12px;padding:10px 12px;outline:none} .partyLedgerToolbar__filters input:focus{border-color:rgba(var(--accent-rgb),.65);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.1)} .partyLedgerToolbar__actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end} .partyLedgerMessage{border:1px solid var(--border);border-radius:14px;padding:11px 13px;background:var(--card)} .partyLedgerMessage--error{border-color:rgba(var(--danger-rgb),.45);color:#fca5a5} .partyLedgerContent{display:grid;gap:14px;min-width:0} .partyLedgerEmpty{display:grid;justify-items:center;text-align:center;gap:10px;padding:38px 20px} .partyLedgerEmpty svg{width:54px;height:54px;color:var(--accent);opacity:.82} .partyLedgerEmpty h2,.partyLedgerEmpty p{margin:0} .partyLedgerEmpty p{max-width:720px;color:var(--muted);line-height:1.9} .partyLedgerIdentity{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px} .partyLedgerIdentity h2{margin:0 0 9px;font-size:21px} .partyLedgerIdentity__chips{display:flex;flex-wrap:wrap;gap:7px} .partyLedgerIdentity__chips span{border:1px solid var(--border);background:rgba(148,163,184,.055);border-radius:999px;padding:5px 9px;color:var(--muted);font-size:12px} .partyLedgerBalance{min-width:180px;border:1px solid var(--border);border-radius:16px;padding:13px 16px;text-align:center;background:rgba(148,163,184,.045)} .partyLedgerBalance span,.partyLedgerBalance b{display:block} .partyLedgerBalance span{font-size:12px;color:var(--muted)} .partyLedgerBalance strong{display:block;font-size:23px;line-height:1.6} .partyLedgerBalance.is-debit{border-color:rgba(245,158,11,.45)} .partyLedgerBalance.is-credit{border-color:rgba(34,197,94,.42)} .partyLedgerStats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px} .partyLedgerStats article{padding:13px;min-width:0} .partyLedgerStats span{display:block;color:var(--muted);font-size:11.5px;font-weight:800;margin-bottom:6px} .partyLedgerStats strong{display:block;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .partyLedgerSection{padding:0;overflow:hidden;min-width:0} .partyLedgerSection__head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--border)} .partyLedgerSection__head h2{margin:0 0 4px;font-size:16px} .partyLedgerSection__head p{margin:0;color:var(--muted);font-size:12px} .partyLedgerSection .tablewrap{border:0;border-radius:0;margin:0;max-height:430px;overflow:auto} .partyLedgerTable{min-width:760px} .partyLedgerTable--wide{min-width:980px} .partyLedgerTable td small{display:block;margin-top:3px;color:var(--muted);font-size:11px;line-height:1.5} .partyLedgerGrid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;min-width:0} .partyLedgerLimit{margin:0;padding:9px 14px;border-top:1px solid var(--border);color:var(--muted);font-size:12px} .partyLedgerPrintHead{display:none} @media (max-width:1180px){ .partyLedgerToolbar{grid-template-columns:1fr 1fr} .partyLedgerToolbar__actions{grid-column:1/-1;justify-content:flex-start} .partyLedgerStats{grid-template-columns:repeat(3,minmax(0,1fr))} } @media (max-width:820px){ .partyLedgerToolbar{grid-template-columns:1fr;padding:12px} .partyLedgerToolbar__filters{grid-template-columns:1fr 1fr} .partyLedgerToolbar__actions{grid-column:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))} .partyLedgerToolbar__actions .btn{width:100%} .partyLedgerIdentity{align-items:stretch;display:grid;padding:12px} .partyLedgerBalance{min-width:0} .partyLedgerStats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .partyLedgerStats article{padding:10px} .partyLedgerGrid2{grid-template-columns:1fr} .partyLedgerSection__head{padding:12px} } @media (max-width:480px){ .partyLedgerToolbar__filters{grid-template-columns:1fr} .partyLedgerIdentity__chips span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} } @media print{ body.party-ledger-printing *{visibility:hidden !important} body.party-ledger-printing #partyLedgerPage, body.party-ledger-printing #partyLedgerPage *{visibility:visible !important} body.party-ledger-printing #partyLedgerPage{position:absolute;inset:0;width:100%;display:block;background:#fff;color:#000;padding:0} body.party-ledger-printing .partyLedgerToolbar, body.party-ledger-printing .partyLedgerMessage, body.party-ledger-printing button{display:none !important} body.party-ledger-printing .partyLedgerPrintHead{display:block;margin-bottom:12px} body.party-ledger-printing .partyLedgerPrintHead h1{margin:0 0 4px;font-size:20px} body.party-ledger-printing .partyLedgerPrintHead p{margin:0} body.party-ledger-printing .partyLedgerContent{display:block} body.party-ledger-printing .partyLedgerContent > *{break-inside:avoid;margin-bottom:12px;border:1px solid #bbb !important;box-shadow:none !important} body.party-ledger-printing .partyLedgerSection .tablewrap{max-height:none;overflow:visible} body.party-ledger-printing .partyLedgerTable{min-width:0;width:100%;font-size:9px} body.party-ledger-printing .partyLedgerStats{grid-template-columns:repeat(3,1fr)} body.party-ledger-printing .partyLedgerGrid2{display:block} body.party-ledger-printing .partyLedgerGrid2 > *{margin-bottom:12px} } /* V308 - unified party finder controls */ .partyPickerControl{ display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:8px; align-items:center; margin-top:6px; } .partyPickerControl input[readonly]{ min-width:0; cursor:default; background:var(--surface-soft,#f8fafc); } .partyPickerControl__pick{white-space:nowrap} .partyPickerControl__clear{ width:36px; min-width:36px; padding-inline:0; font-size:20px; line-height:1; } .partyPickerControl__clear[hidden]{display:none!important} @media (max-width:720px){ .partyPickerControl{grid-template-columns:minmax(0,1fr) auto} .partyPickerControl__clear{grid-column:2} .partyPickerControl__pick{font-size:12px;padding-inline:10px} } /* ---------------- V309: simple paged party ledger ---------------- */ .partyLedgerSimpleHead{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px} .partyLedgerSimpleHead h2{margin:0 0 5px;font-size:20px} .partyLedgerSimpleHead p{margin:0;color:var(--muted);font-size:12px} .partyLedgerSimpleHead > span{flex:0 0 auto;border:1px solid var(--border);border-radius:999px;padding:6px 10px;color:var(--muted);font-size:12px;font-weight:800} .partyLedgerStats--simple{grid-template-columns:repeat(4,minmax(0,1fr)) !important} .partyLedgerStats--simple article{padding:14px} .partyLedgerStats--simple strong small{font-size:11px;font-weight:800;color:var(--muted)} .partyLedgerStats--simple article.is-debit{border-color:rgba(245,158,11,.45)} .partyLedgerStats--simple article.is-credit{border-color:rgba(34,197,94,.42)} .partyLedgerSection--single .tablewrap{max-height:none;overflow-x:auto;overflow-y:visible} .partyLedgerTable--ledger{min-width:920px} .partyLedgerTable--ledger th,.partyLedgerTable--ledger td{vertical-align:middle} .partyLedgerTable--ledger td:nth-child(5){min-width:240px;white-space:normal} .partyLedgerTransfer td{background:rgba(148,163,184,.07);font-weight:800;border-bottom:1px solid var(--border)} .partyLedgerPager{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;border-top:1px solid var(--border);background:rgba(148,163,184,.025)} .partyLedgerPager__info{color:var(--muted);font-size:12px;font-weight:700} .partyLedgerPager__buttons{display:flex;align-items:center;gap:7px;flex-wrap:wrap} .partyLedgerPager__buttons > span{min-width:92px;text-align:center;color:var(--muted);font-size:12px;font-weight:800} @media(max-width:820px){ .partyLedgerSimpleHead{display:grid;padding:12px} .partyLedgerSimpleHead > span{justify-self:start} .partyLedgerStats--simple{grid-template-columns:repeat(2,minmax(0,1fr)) !important} .partyLedgerPager{display:grid;justify-items:center} .partyLedgerPager__buttons{justify-content:center} } @media(max-width:430px){ .partyLedgerPager__buttons .btn{padding-inline:8px} .partyLedgerPager__buttons > span{order:-1;flex:1 0 100%} } @media print{ body.party-ledger-printing .partyLedgerPager{display:none !important} body.party-ledger-printing .partyLedgerSimpleHead{display:none !important} body.party-ledger-printing .partyLedgerStats--simple{grid-template-columns:repeat(4,1fr) !important} } /* ---------------- v311: account submenu + lightweight account page polish ---------------- */ .accountPage{ max-width:1180px; margin-inline:auto; } .accountPage__head{ display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:14px; padding:16px 18px; border:1px solid var(--border); border-radius:18px; background:var(--card); } .accountPage__identity{ display:flex; align-items:center; gap:13px; min-width:0; } .accountPage__avatar{ width:48px; height:48px; flex:0 0 48px; display:grid; place-items:center; border-radius:15px; color:var(--accent); background:color-mix(in oklab, var(--accent) 10%, var(--panel)); border:1px solid color-mix(in oklab, var(--accent) 24%, var(--border)); } .accountPage__avatar svg{width:25px;height:25px} .accountPage__head h1{margin:0 0 4px;font-size:23px;line-height:1.35} .accountPage__head p{margin:0;color:var(--muted);font-size:12px;line-height:1.8} .accountPage__headActions{display:flex;align-items:center;gap:8px;flex:0 0 auto} .accountPage__quickLinks{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:14px; } .accountQuickLink{ appearance:none; width:100%; min-width:0; display:flex; align-items:center; gap:11px; text-align:right; color:var(--text); background:var(--card); border:1px solid var(--border); border-radius:16px; padding:11px 13px; cursor:pointer; font:inherit; transition:border-color .16s ease,background .16s ease,transform .16s ease; } .accountQuickLink:hover{ transform:translateY(-1px); border-color:color-mix(in oklab, var(--accent) 40%, var(--border)); background:color-mix(in oklab, var(--card) 94%, var(--accent) 6%); } .accountQuickLink--danger:hover{border-color:color-mix(in oklab, var(--danger) 42%, var(--border))} .accountQuickLink__ico{ width:35px; height:35px; flex:0 0 35px; display:grid; place-items:center; border-radius:11px; background:color-mix(in oklab, var(--accent) 10%, var(--panel)); color:var(--accent); } .accountQuickLink--danger .accountQuickLink__ico{ color:var(--danger); background:color-mix(in oklab, var(--danger) 9%, var(--panel)); } .accountQuickLink__ico svg{width:18px;height:18px} .accountQuickLink > span:last-child{display:grid;gap:2px;min-width:0} .accountQuickLink b{font-size:13px} .accountQuickLink small{font-size:11px;color:var(--muted)} .accountGrid--clean{ display:grid; grid-template-columns:minmax(0,1.35fr) minmax(300px,.8fr); gap:14px; align-items:stretch !important; } .accountGrid--clean > .accountCard{ padding:16px; border-radius:18px; box-shadow:none; } .accountCard__head{ display:flex; align-items:center; gap:10px; padding-bottom:12px; margin-bottom:2px; border-bottom:1px solid color-mix(in oklab, var(--border) 88%, transparent); } .accountCard__headIcon{ width:35px; height:35px; flex:0 0 35px; display:grid; place-items:center; border-radius:11px; color:var(--accent); background:color-mix(in oklab, var(--accent) 9%, var(--panel)); } .accountCard__headIcon svg{width:18px;height:18px} .accountCard__head h2{margin:0 0 3px;font-size:16px} .accountCard__head p{margin:0;color:var(--muted);font-size:11px} .accountCard__head--split{justify-content:space-between} .accountCard__headMain{display:flex;align-items:center;gap:10px;min-width:0} .accountPage #accUserInfo.accountInfoList{gap:7px;margin-top:12px} .accountPage #accUserInfo .accountInfoItem{ min-height:44px; padding:8px 10px; border-radius:12px; background:color-mix(in oklab, var(--panel) 94%, var(--accent) 6%); } .accountPage .accountInfoEditBtn{ min-width:60px; min-height:32px; padding-inline:10px; } .accountPlanBox{display:grid;gap:7px;margin-top:12px} .accountPlanRow{ min-height:44px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 11px; border:1px solid var(--border); border-radius:12px; background:color-mix(in oklab, var(--panel) 95%, var(--accent) 5%); } .accountPlanRow > :last-child{min-width:0;text-align:left;overflow-wrap:anywhere} .accountPlanLimits{ margin-top:2px; padding:11px; border:1px dashed var(--border); border-radius:12px; display:grid; gap:7px; } .accountPlanActions{display:flex;justify-content:flex-end;margin-top:3px} .accountLogsCard{ margin-top:14px; padding:16px; border-radius:18px; box-shadow:none; } .accountLogList{margin-top:12px;display:grid;gap:8px} .accountPage .accountLogItem{ border:1px solid var(--border); background:color-mix(in oklab, var(--panel) 96%, var(--accent) 4%); padding:10px 12px; box-shadow:none; } html[data-theme="light"] .accountPage__head, body.theme-light .accountPage__head, html[data-theme="light"] .accountQuickLink, body.theme-light .accountQuickLink{ background:#fff; } @media (max-width:900px){ .accountPage__head{align-items:flex-start} .accountPage__headActions{flex-wrap:wrap;justify-content:flex-end} .accountGrid--clean{grid-template-columns:1fr} } @media (max-width:640px){ .accountPage__head{display:grid;padding:13px} .accountPage__headActions{display:grid;grid-template-columns:1fr 1fr;width:100%} .accountPage__headActions .btn{width:100%;justify-content:center;min-height:40px} .accountPage__quickLinks{grid-template-columns:1fr} .accountPage__identity{align-items:flex-start} .accountPage__avatar{width:42px;height:42px;flex-basis:42px;border-radius:13px} .accountPage__head h1{font-size:20px} .accountGrid--clean > .accountCard,.accountLogsCard{padding:13px;border-radius:15px} .accountCard__head--split{align-items:center} .accountCard__head--split > .btn{flex:0 0 auto} .accountPlanActions .btn{width:100%;justify-content:center} } /* ---------------- v312: simpler account page, no decorative icons or heavy cards ---------------- */ .accountPage{ max-width:1080px; } .accountPage__head{ padding:0 0 14px; margin-bottom:12px; border:0; border-bottom:1px solid var(--border); border-radius:0; background:transparent !important; box-shadow:none !important; } .accountPage__identity{display:block} .accountPage__avatar{display:none !important} .accountPage__head h1{font-size:21px;margin-bottom:3px} .accountPage__head p{font-size:11px} .accountPage__headActions{gap:6px} .accountPage__headActions .btn{box-shadow:none !important} .accountPage__quickLinks{ display:flex; justify-content:flex-start; gap:6px; margin:0 0 12px; } .accountPage__quickLinks .btn{ width:auto; min-height:34px; border-radius:8px; box-shadow:none !important; } .accountQuickLink__ico{display:none !important} .accountQuickLink--danger{ color:var(--danger); border-color:color-mix(in oklab, var(--danger) 26%, var(--border)) !important; } .accountGrid--clean{ grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr); gap:12px; } .accountGrid--clean > .accountCard, .accountLogsCard{ padding:14px; border-radius:10px; border:1px solid var(--border); background:var(--card); box-shadow:none !important; } .accountCard__head{ padding:0 0 9px; margin:0 0 4px; gap:0; border-bottom:1px solid var(--border); } .accountCard__headIcon{display:none !important} .accountCard__headMain{gap:0} .accountCard__head h2{font-size:15px;margin-bottom:2px} .accountCard__head p{font-size:10px} .accountPage #accUserInfo.accountInfoList{ gap:0; margin-top:4px; } .accountPage #accUserInfo .accountInfoItem{ min-height:42px; padding:9px 0; border:0; border-bottom:1px solid color-mix(in oklab, var(--border) 76%, transparent); border-radius:0; background:transparent !important; } .accountPage #accUserInfo .accountInfoItem:last-child{border-bottom:0} .accountPage .accountInfoEditBtn{ min-height:30px; min-width:54px; border-radius:7px; box-shadow:none !important; } .accountPlanBox{gap:0;margin-top:4px} .accountPlanRow{ min-height:42px; padding:9px 0; border:0; border-bottom:1px solid color-mix(in oklab, var(--border) 76%, transparent); border-radius:0; background:transparent !important; } .accountPlanLimits{ margin:0; padding:10px 0; border:0; border-bottom:1px solid color-mix(in oklab, var(--border) 76%, transparent); border-radius:0; } .accountPlanActions{margin-top:10px} .accountPlanActions .btn{box-shadow:none !important} .accountLogsCard{margin-top:12px} .accountLogList{margin-top:4px;gap:0} .accountPage .accountLogItem{ padding:10px 0; border:0; border-bottom:1px solid color-mix(in oklab, var(--border) 76%, transparent); border-radius:0; background:transparent !important; box-shadow:none !important; } .accountPage .accountLogItem:last-child{border-bottom:0} @media (max-width:900px){ .accountGrid--clean{grid-template-columns:1fr} } @media (max-width:640px){ .accountPage__head{display:grid;padding:0 0 12px} .accountPage__headActions{display:flex;width:100%;flex-wrap:wrap} .accountPage__headActions .btn{width:auto;min-height:36px} .accountPage__quickLinks{flex-wrap:wrap} .accountGrid--clean > .accountCard,.accountLogsCard{padding:12px;border-radius:9px} } /* ---------------- v313: full-width account page + simpler feedback layout ---------------- */ .accountPage{ max-width:none; width:100%; } .accountPage__head{ margin-bottom:14px; } .accountPage__quickLinks{ margin-bottom:14px; } .accountGrid--clean{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px; } .accountGrid--clean > .accountCard, .accountLogsCard{ padding:14px 16px; } .accountLogsCard .accountCard__head h2{margin-bottom:0} .feedbackPage{ max-width:none; width:100%; } .feedbackPage__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; padding:0 0 14px; border-bottom:1px solid var(--border); } .feedbackPage__head h1{ margin:0 0 4px; font-size:22px; line-height:1.4; } .feedbackPage__head p{ margin:0; color:var(--muted); font-size:12px; line-height:1.9; } .feedbackPage__headActions{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; } .feedbackGrid--clean{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr); gap:14px; align-items:start; } .feedbackCard{ padding:14px 16px; border-radius:10px; box-shadow:none !important; } .feedbackCard__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--border); } .feedbackCard__head h2{ margin:0 0 3px; font-size:16px; } .feedbackCard__head p{ margin:0; color:var(--muted); font-size:11px; line-height:1.8; } .feedbackFormGrid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 12px; } .feedbackCard .field{ display:grid; gap:6px; } .feedbackField--full{ margin-top:10px; } .feedbackCard textarea, .feedbackCard input, .feedbackCard select{ box-shadow:none !important; } .feedbackActions{ display:flex; justify-content:flex-end; gap:8px; margin-top:12px; flex-wrap:wrap; } .feedbackLogList{ display:grid; gap:8px; margin-top:4px; } .feedbackLogList > *{ box-shadow:none !important; } @media (max-width:980px){ .feedbackGrid--clean, .accountGrid--clean{ grid-template-columns:1fr; } } @media (max-width:700px){ .feedbackPage__head{ display:grid; } .feedbackPage__headActions, .accountPage__headActions{ width:100%; } .feedbackFormGrid{ grid-template-columns:1fr; } .feedbackCard, .accountGrid--clean > .accountCard, .accountLogsCard{ padding:12px; } } /* ---------------- v314: account/feedback button spacing + simpler plan page ---------------- */ .accountPage__headActions{ margin-top:10px; align-self:flex-start; } .accountPage__quickLinks{ margin-top:8px; } .feedbackPage__headActions{ margin-top:10px; align-self:flex-start; } .feedbackActions{ margin-top:16px; } .planPage{ max-width:none; width:100%; } .planHero{ grid-template-columns:1fr; gap:12px; margin-bottom:14px; } .planHero__text, .planHero__meta, .planCatalogCard, .planHelpCard, .planCheckoutCard{ background:var(--card); border:1px solid var(--border); box-shadow:none !important; } .planHero__text{ min-height:auto; padding:16px 18px; border-radius:14px; background:var(--card) !important; } .planHero__text h1, .planCurrentHero__empty h1, .planCurrentHero__head h1{ font-size:24px; } .planHero__text p, .planCurrentHero__empty p, .planCurrentHero__head p{ font-size:12px; } .planCurrentHero__loading, .planCurrentHero__empty, .planCurrentHero{ gap:10px; } .planCurrentHero__metrics{ grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px; } .planCurrentHero__metrics > div, .planCurrentRows > div, .planLimitGrid > div{ background:transparent; border:1px solid color-mix(in oklab, var(--border) 78%, transparent); border-radius:10px; box-shadow:none; } .planLayout{ grid-template-columns:minmax(0, 1fr) minmax(320px, 380px); gap:14px; } .planMain{ gap:14px; } .planCatalogCard, .planHelpCard, .planCheckoutCard{ padding:14px 16px; border-radius:12px; } .planSectionHead{ margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid color-mix(in oklab, var(--border) 74%, transparent); } .planSectionHead h2, .planCheckoutCard h2, .planHelpCard h2{ font-size:18px; } .planSectionHead p, .planCheckoutCard__hint{ margin:5px 0 0; color:var(--muted); font-size:11px; line-height:1.9; } .planCatalog{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; } .planCard{ min-height:220px; padding:13px; border-radius:12px; background:transparent; border:1px solid color-mix(in oklab, var(--border) 74%, transparent); box-shadow:none !important; transform:none !important; } .planCard:hover{ transform:none; border-color:color-mix(in oklab, var(--accent, #7c5cff) 34%, var(--border) 66%); box-shadow:none; } .planCard.is-selected{ background:color-mix(in oklab, var(--panel) 90%, var(--accent) 10%); border-color:color-mix(in oklab, var(--accent, #7c5cff) 62%, var(--border) 38%); } .planCard.is-popular{ box-shadow:none !important; } .planCard__top{ gap:10px; } .planCard__title{ font-size:17px; } .planCard__price strong{ font-size:19px; } .planCard__features{ gap:7px; } .planCard__features > div{ font-size:11px; } .planCard__actions{ margin-top:6px; } .planHelpGrid, .planAddonGrid{ gap:10px; } .planCheckoutCard{ position:sticky; top:14px; gap:12px; } .planCheckoutCard__head{ padding-bottom:10px; border-bottom:1px solid color-mix(in oklab, var(--border) 74%, transparent); } .planCouponBox, .planSelectedBox, .planInvoiceToggle, .planTermsAccept, .planInvoiceFields{ border-radius:10px; box-shadow:none !important; } .planCouponBox, .planSelectedBox, .planInvoiceToggle, .planTermsAccept{ background:transparent; border:1px solid color-mix(in oklab, var(--border) 74%, transparent); } .planCouponBox{ padding:10px; } .planCouponBox > span{ font-size:11px; } .planCouponRow input{ min-height:38px; } .planSelectedBox{ padding:11px; } .planSelectedBox strong{ font-size:17px; } .planNoteField textarea, .planInvoiceFields textarea, .planInvoiceFields input, .planCouponRow input{ box-shadow:none !important; } .planInvoiceToggle, .planTermsAccept{ padding:10px 12px; } .planCheckoutActions{ margin-top:4px; } .planCheckoutActions .btn{ min-height:40px; box-shadow:none !important; } #accPlanInlineMsg{ min-height:22px; font-size:12px; line-height:1.8; } @media (max-width:1180px){ .planCatalog{ grid-template-columns:repeat(2, minmax(0,1fr)); } .planCurrentHero__metrics{ grid-template-columns:repeat(2, minmax(0,1fr)); } } @media (max-width:900px){ .planLayout{ grid-template-columns:1fr; } .planCheckoutCard{ position:static; } } @media (max-width:700px){ .accountPage__headActions, .feedbackPage__headActions{ margin-top:6px; } .planCatalog{ grid-template-columns:1fr; } .planCurrentHero__metrics{ grid-template-columns:1fr; } .planCatalogCard, .planHelpCard, .planCheckoutCard{ padding:12px; } } /* ---------------- v316: compact, clearer discount-code section ---------------- */ .planCheckoutCard__head--stacked{ gap:0; } .planCouponBox--compact{ display:grid; gap:9px; padding:11px 0 12px; margin:0; border:0; border-top:1px solid color-mix(in oklab, var(--border) 70%, transparent); border-bottom:1px solid color-mix(in oklab, var(--border) 70%, transparent); border-radius:0; background:transparent !important; box-shadow:none !important; } .planCouponBox__head{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; } .planCouponBox__head strong{ color:var(--text); font-size:12px; font-weight:900; } .planCouponBox__head span{ color:var(--muted); font-size:10px; line-height:1.7; text-align:left; } .planCouponBox--compact .planCouponRow{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px; align-items:stretch; } .planCouponBox--compact .planCouponRow input{ width:100%; height:39px; min-height:39px; padding-inline:11px; border-radius:8px; background:var(--app-field-surface, var(--panel)); border-color:color-mix(in oklab, var(--border) 82%, transparent); font-size:12px; font-weight:750; letter-spacing:.02em; text-transform:uppercase; } .planCouponBox--compact .planCouponRow input:focus{ border-color:color-mix(in oklab, var(--accent) 58%, var(--border)); box-shadow:0 0 0 2px color-mix(in oklab, var(--accent) 12%, transparent) !important; } .planCouponBox--compact .planCouponRow .btn{ height:39px; min-height:39px; padding-inline:13px; border-radius:8px; box-shadow:none !important; } .planCouponBox--compact .planCouponMsg{ min-height:0; margin:0; font-size:10px; line-height:1.7; } .planCouponBox--compact .planCouponMsg:empty{ display:none; } .planCouponBox--compact .planCouponApplied{ margin-top:0; border-radius:7px; } @media (max-width:520px){ .planCouponBox__head{ display:grid; gap:2px; } .planCouponBox__head span{ text-align:right; } .planCouponBox--compact .planCouponRow{ grid-template-columns:1fr; } .planCouponBox--compact .planCouponRow .btn{ width:100%; } } /* ---------------- v317: keep account/feedback header buttons clear of top-left notify icon ---------------- */ .accountPage__headActions, .feedbackPage__headActions{ margin-left:92px; } .feedbackPage__headActions{ margin-top:14px; } .accountPage__headActions{ margin-top:12px; } @media (max-width:980px){ .accountPage__headActions, .feedbackPage__headActions{ margin-left:0; } } @media (max-width:700px){ .accountPage__headActions, .feedbackPage__headActions{ margin-top:6px; margin-left:0; } } /* ---------------- v318: remove account support action and fine-tune feedback header buttons ---------------- */ .feedbackPage__headActions{ margin-left:48px; } .accountPage__headActions{ margin-left:0; } @media (max-width:980px){ .feedbackPage__headActions{ margin-left:0; } } /* ---------------- v319: customer opening balance + cleaner inventory report party picker ---------------- */ .customerOpeningHint{ margin-top:-4px; color:var(--muted); font-size:11px; line-height:1.8; } .customerForm #cust_openingBalance{ direction:ltr; text-align:left; font-variant-numeric:tabular-nums; } .partyPickerControl--inventoryReport{ grid-template-columns:minmax(0,1fr) 72px 36px; gap:6px; margin-top:6px; padding:3px; border:1px solid var(--app-surface-border,var(--border)); border-radius:10px; background:var(--app-field-surface,var(--panel)); } .partyPickerControl--inventoryReport input[readonly]{ min-height:36px; padding-inline:9px; border:0 !important; background:transparent !important; box-shadow:none !important; } .partyPickerControl--inventoryReport .partyPickerControl__pick, .partyPickerControl--inventoryReport .partyPickerControl__clear{ min-height:36px; height:36px; border-radius:7px; box-shadow:none !important; } .partyPickerControl--inventoryReport .partyPickerControl__pick{ padding-inline:10px; font-size:12px; } .partyPickerControl--inventoryReport .partyPickerControl__clear{ width:36px; min-width:36px; border-color:transparent; } @media(max-width:720px){ .partyPickerControl--inventoryReport{ grid-template-columns:minmax(0,1fr) 68px 36px; } .partyPickerControl--inventoryReport .partyPickerControl__clear{ grid-column:auto; } } /* v320: lightweight inventory opening-balance option */ .inventoryOpeningCheck{align-self:end;min-height:42px;margin:0;padding:9px 0;} .inventoryOpeningCheck input{width:auto;} /* v320: simple profit/loss and balance-sheet reports */ .accountingStatementSummary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}.accountingStatementSummary>div{border:1px solid var(--border);border-radius:10px;padding:11px 12px;display:grid;gap:5px}.accountingStatementSummary span{color:var(--muted);font-size:11px}.accountingStatementSummary strong{font-size:16px}.accountingStatementSummary .is-positive strong{color:var(--ok)}.accountingStatementSummary .is-negative strong{color:var(--danger)}.accountingStatementGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}@media(max-width:900px){.accountingStatementSummary{grid-template-columns:repeat(2,minmax(0,1fr))}.accountingStatementGrid{grid-template-columns:1fr}} /* ---------------- v321: cheque lifecycle and cheque lists ---------------- */ .treasuryChequeLifecycle{ display:grid; gap:12px; padding:14px; border:1px solid var(--border); border-radius:12px; background:var(--card); } .treasuryChequeLifecycle__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:10px; border-bottom:1px solid var(--border); } .treasuryChequeLifecycle__head > div{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; } .treasuryChequeLifecycle__head span, .treasuryChequeLifecycle__head small{ color:var(--muted); font-size:11px; } .treasuryChequeLifecycle__form{ display:grid; grid-template-columns:minmax(160px,.45fr) minmax(220px,.7fr) minmax(260px,1.2fr); gap:10px; } .treasuryChequeLifecycle__form label{ display:grid; gap:6px; color:var(--muted); font-size:12px; font-weight:800; } .treasuryChequeLifecycle__form input{ min-height:42px; } .treasuryChequeLifecycle__actions{ display:flex; align-items:center; justify-content:flex-start; gap:8px; flex-wrap:wrap; } .treasuryChequeState{ display:inline-flex; align-items:center; min-height:27px; padding:3px 10px; border:1px solid var(--border); border-radius:999px; font-size:11px; font-weight:900; } .treasuryChequeState--inhand, .treasuryChequeState--issued{ border-color:color-mix(in oklab,var(--accent) 34%,var(--border)); background:color-mix(in oklab,var(--accent) 8%,transparent); } .treasuryChequeState--deposited{ border-color:color-mix(in oklab,#f59e0b 38%,var(--border)); background:color-mix(in oklab,#f59e0b 9%,transparent); } .treasuryChequeState--collected, .treasuryChequeState--cleared{ border-color:color-mix(in oklab,#22c55e 38%,var(--border)); background:color-mix(in oklab,#22c55e 9%,transparent); } .treasuryChequeState--returned{ border-color:color-mix(in oklab,var(--danger) 42%,var(--border)); background:color-mix(in oklab,var(--danger) 9%,transparent); } .treasuryFilters{ grid-template-columns:minmax(210px,1.35fr) repeat(3,minmax(135px,.65fr)) auto auto; } .treasuryTable{ min-width:1120px; } @media(max-width:900px){ .treasuryChequeLifecycle__form{grid-template-columns:1fr} } @media(max-width:700px){ .treasuryChequeLifecycle{padding:12px} .treasuryChequeLifecycle__head{align-items:flex-start;display:grid} .treasuryChequeLifecycle__actions .btn{width:100%;justify-content:center} } /* ---------------- v322: party active state + warehouse definitions ---------------- */ .customerStatus{ display:inline-flex; align-items:center; justify-content:center; min-width:58px; padding:4px 9px; border-radius:999px; font-size:11px; font-weight:850; border:1px solid var(--border); } .customerStatus--active{ color:var(--ok); background:color-mix(in oklab,var(--ok) 9%,transparent); border-color:color-mix(in oklab,var(--ok) 30%,var(--border)); } .customerStatus--inactive{ color:var(--muted); background:color-mix(in oklab,var(--muted) 8%,transparent); } .warehouseDefinitionGrid{ display:grid; grid-template-columns:minmax(290px,.72fr) minmax(0,1.28fr); gap:14px; align-items:start; } .warehouseEditor, .warehouseDefinitionGrid .inventoryListCard{ padding:15px; border-radius:12px; box-shadow:none !important; } .warehouseForm{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; margin-top:12px; } .warehouseForm label:not(.accountingCheck){ display:grid; gap:6px; color:var(--muted); font-size:12px; } .warehouseForm__wide{grid-column:1/-1} .warehouseForm .accountingCheck{ min-height:42px; align-self:end; } .warehouseTable td:nth-child(2){min-width:180px} .warehouseTable td:nth-child(2) small{ display:block; margin-top:4px; color:var(--muted); font-size:10px; } .warehouseRow--inactive{opacity:.72} .warehouseDefaultBadge{ display:inline-flex; padding:4px 8px; border-radius:999px; color:var(--accent); background:color-mix(in oklab,var(--accent) 10%,transparent); border:1px solid color-mix(in oklab,var(--accent) 28%,var(--border)); font-size:10px; font-weight:900; } .warehouseDefaultHint{margin:4px 0 0} @media(max-width:980px){ .warehouseDefinitionGrid{grid-template-columns:1fr} } @media(max-width:620px){ .warehouseForm{grid-template-columns:1fr} .warehouseForm__wide{grid-column:auto} } /* ---------------- v324: inline warehouse registration + item default warehouse ---------------- */ .warehouseSelectControl{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px; align-items:stretch; width:100%; } .warehouseSelectControl > select, .warehouseSelectControl > .selectx{ min-width:0; width:100%; } .warehouseSelectControl__add{ min-height:42px; padding-inline:11px; border-radius:9px; white-space:nowrap; box-shadow:none !important; } .itemWarehouseField > small{ display:block; margin-top:5px; line-height:1.7; } .itemCol--warehouse{ min-width:120px; max-width:170px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .warehouseQuickModal__panel{ width:min(570px,calc(100vw - 28px)); } .warehouseQuickModal__body{ display:grid; gap:14px; } .warehouseQuickGrid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .warehouseQuickGrid__wide{ grid-column:1/-1; } .warehouseQuickActions{ display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap; } @media (max-width:760px){ .warehouseSelectControl{ grid-template-columns:1fr; } .warehouseSelectControl__add{ width:100%; } .warehouseQuickGrid{ grid-template-columns:1fr; } .warehouseQuickGrid__wide{ grid-column:auto; } } /* ---------------- v325: unified UI system (excludes invoice registration, settings and admin) ---------------- */ .uiUnifiedPage{ --ui-card-radius:12px; --ui-control-radius:9px; --ui-tab-radius:9px; --ui-control-height:40px; --ui-section-gap:14px; --ui-soft-line:color-mix(in oklab,var(--border) 78%,transparent); --ui-soft-surface:color-mix(in oklab,var(--card) 96%,var(--panel) 4%); width:100%; max-width:none; min-width:0; } /* one page-heading language */ .uiUnifiedPage :is(.inventoryPage__head,.treasuryHero,.accountingHero,.accountPage__head,.feedbackPage__head){ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin:0 0 var(--ui-section-gap); padding:0 0 13px; min-height:auto; border:0; border-bottom:1px solid var(--ui-soft-line); border-radius:0; background:transparent !important; box-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } .uiUnifiedPage > h1{ margin:0 0 var(--ui-section-gap); padding:0 0 13px; border-bottom:1px solid var(--ui-soft-line); font-size:22px; line-height:1.45; } .uiUnifiedPage :is(.inventoryPage__head,.treasuryHero,.accountingHero,.accountPage__head,.feedbackPage__head) h1{ margin:0 0 4px; font-size:22px; line-height:1.45; } .uiUnifiedPage :is(.inventoryPage__head,.treasuryHero,.accountingHero,.accountPage__head,.feedbackPage__head) p{ margin:0; color:var(--muted); font-size:12px; line-height:1.85; } /* shared surfaces */ .uiUnifiedPage .card{ border:1px solid var(--ui-soft-line); border-radius:var(--ui-card-radius); background:var(--card); box-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } .uiUnifiedPage :is(.inventoryEditor,.inventoryListCard,.accountingCard,.treasuryCard,.csrCard,.feedbackCard,.accountCard,.planCatalogCard,.planHelpCard,.planCheckoutCard,.reportCard,.excelGuideCard,.excelImportCard,.excelExportCard){ border-radius:var(--ui-card-radius); box-shadow:none !important; } .uiUnifiedPage :is(.masterDataEditor__head,.accountingCard__head,.accountCard__head,.feedbackCard__head,.planSectionHead){ margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--ui-soft-line); } .uiUnifiedPage :is(.masterDataEditor__head,.accountingCard__head,.accountCard__head,.feedbackCard__head,.planSectionHead) h2{ margin:0 0 3px; font-size:16px; line-height:1.5; } .uiUnifiedPage :is(.masterDataEditor__head,.accountingCard__head,.accountCard__head,.feedbackCard__head,.planSectionHead) p{ margin:0; color:var(--muted); font-size:11px; line-height:1.8; } /* shared controls */ .uiUnifiedPage :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),select,.selectx-btn){ min-height:var(--ui-control-height); border-radius:var(--ui-control-radius); box-shadow:none !important; } .uiUnifiedPage textarea{ border-radius:var(--ui-control-radius); box-shadow:none !important; } .uiUnifiedPage .field{ gap:6px; } .uiUnifiedPage .field > span, .uiUnifiedPage .form > label, .uiUnifiedPage label.field > span{ font-size:12px; line-height:1.7; } .uiUnifiedPage .btn:not(.btn--icon):not(.topIconBtn){ min-height:38px; border-radius:var(--ui-control-radius); box-shadow:none !important; } .uiUnifiedPage .btn--sm:not(.btn--icon){ min-height:36px; } .uiUnifiedPage .btn--xs:not(.btn--icon){ min-height:32px; border-radius:8px; } /* tabs use the same container, spacing and selected state */ .uiUnifiedPage :is(.inventoryTabs,.accountingTabs){ display:flex; align-items:center; gap:4px; width:100%; margin:0 0 var(--ui-section-gap); padding:4px; border:1px solid var(--ui-soft-line); border-radius:12px; background:var(--card); box-shadow:none !important; overflow-x:auto; scrollbar-width:thin; } .uiUnifiedPage :is(.inventoryTab,.accountingTab){ min-height:38px; padding:8px 13px; border:0; border-radius:var(--ui-tab-radius); background:transparent; box-shadow:none !important; white-space:nowrap; } .uiUnifiedPage :is(.inventoryTab,.accountingTab):hover{ background:color-mix(in oklab,var(--panel) 88%,var(--text) 12%); } .uiUnifiedPage :is(.inventoryTab,.accountingTab).is-active{ background:color-mix(in oklab,var(--panel) 86%,var(--accent) 14%); color:var(--text); box-shadow:none !important; } /* toolbars and filter bands */ .uiUnifiedPage :is(.listToolbar,.partyLedgerToolbar,.accountingToolbar,.inventoryReportFilters,.reportToolbar,.treasuryAccountToolbar){ gap:10px; border-color:var(--ui-soft-line); border-radius:var(--ui-card-radius); box-shadow:none !important; } .uiUnifiedPage :is(.listToolbar__actions,.partyLedgerToolbar__actions,.accountingToolbar__actions,.feedbackActions,.accountPage__headActions,.feedbackPage__headActions){ gap:8px; } /* one table language */ .uiUnifiedPage .tablewrap{ border:1px solid var(--ui-soft-line); border-radius:10px; background:var(--card); box-shadow:none !important; overflow:auto; } .uiUnifiedPage .tablewrap > table{ margin:0; border-collapse:separate; border-spacing:0; } .uiUnifiedPage .tablewrap th{ background:color-mix(in oklab,var(--card) 90%,var(--panel) 10%); border-bottom:1px solid var(--ui-soft-line); font-size:11px; font-weight:850; } .uiUnifiedPage .tablewrap td{ border-bottom-color:var(--ui-soft-line); font-size:12px; } .uiUnifiedPage .tablewrap tbody tr:last-child td{ border-bottom:0; } /* compact, consistent stat cards */ .uiUnifiedPage :is(.inventoryReportStat,.accountingStat,.partyLedgerStat,.adminMiniStat){ border:1px solid var(--ui-soft-line); border-radius:10px; background:var(--card); box-shadow:none !important; } /* plan page keeps its logic but follows the common surfaces */ .uiUnifiedPage.planPage .planHero__text, .uiUnifiedPage.planPage .planCurrentHero__metrics > div, .uiUnifiedPage.planPage .planCard, .uiUnifiedPage.planPage :is(.planCouponBox,.planSelectedBox,.planInvoiceToggle,.planTermsAccept){ border-radius:10px; box-shadow:none !important; } .uiUnifiedPage.planPage .planCard{ transform:none !important; } /* consistent vertical rhythm */ .uiUnifiedPage :is(.inventoryPanel,.treasuryPanel,.accountingPanel,.entityTabbedPanels,.planLayout,.feedbackGrid--clean){ min-width:0; } .uiUnifiedPage :is(.inventoryStats,.accountingStats,.partyLedgerStats,.feedbackGrid--clean,.planLayout){ gap:var(--ui-section-gap); } @media (max-width:900px){ .uiUnifiedPage :is(.inventoryPage__head,.treasuryHero,.accountingHero,.accountPage__head,.feedbackPage__head){ display:grid; gap:10px; } .uiUnifiedPage :is(.accountPage__headActions,.feedbackPage__headActions){ width:100%; margin:0; justify-content:flex-start; } } @media (max-width:640px){ .uiUnifiedPage{ --ui-section-gap:12px; --ui-card-radius:10px; --ui-control-radius:8px; } .uiUnifiedPage > h1, .uiUnifiedPage :is(.inventoryPage__head,.treasuryHero,.accountingHero,.accountPage__head,.feedbackPage__head){ padding-bottom:11px; } .uiUnifiedPage :is(.inventoryTabs,.accountingTabs){ padding:3px; } .uiUnifiedPage :is(.inventoryTab,.accountingTab){ min-height:36px; padding-inline:11px; } .uiUnifiedPage .btn:not(.btn--icon):not(.topIconBtn){ min-height:36px; } } /* ---------------- v326: restore simple dual tabs + normalize toolbar/button sizes ---------------- */ /* ثبت/فهرست و تب‌های دوگانه مثل قبل ساده و خطی باشند */ .uiUnifiedPage .entityTabs{ display:flex; align-items:center; gap:10px; width:100%; margin:0 0 var(--ui-section-gap); padding:0; border:0; border-bottom:1px solid var(--border); border-radius:0; background:transparent; box-shadow:none !important; overflow:visible; } .uiUnifiedPage .entityTabs .inventoryTab{ min-height:auto; padding:9px 14px; border:0; border-bottom:2px solid transparent; border-radius:0; background:transparent; color:var(--muted); box-shadow:none !important; } .uiUnifiedPage .entityTabs .inventoryTab:hover{ background:transparent; color:var(--text); } .uiUnifiedPage .entityTabs .inventoryTab.is-active{ background:transparent; color:var(--text); border-bottom-color:var(--accent); } /* هم‌قد شدن دکمه‌ها و فیلدهای نوارهای جستجو/فیلتر */ .uiUnifiedPage :is(.listToolbar,.inventoryFilters,.partyLedgerToolbar,.accountingToolbar,.inventoryReportFilters,.reportToolbar,.treasuryAccountToolbar) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),select,.selectx-btn){ min-height:42px; } .uiUnifiedPage :is(.listToolbar__actions,.inventoryEditor__actions,.inventoryPage__head,.inventoryFilters,.partyLedgerToolbar__actions,.accountingToolbar__actions,.feedbackActions,.accountPage__headActions,.feedbackPage__headActions) .btn:not(.btn--xs){ min-height:42px; } .uiUnifiedPage .btn.btn--icon, .uiUnifiedPage .listExcel__trigger, .uiUnifiedPage .topIconBtn{ min-width:42px; min-height:42px; width:42px; height:42px; padding:0; border-radius:12px; } .uiUnifiedPage .btn--sm:not(.btn--icon){ min-height:40px; padding-block:7px; } .uiUnifiedPage .btn--xs:not(.btn--icon){ min-height:30px; } /* هم‌ترازی بهتر جزئیات نوارهای فهرست */ .uiUnifiedPage .listToolbar{ align-items:end; } .uiUnifiedPage .listToolbar__fields{ align-items:end; } .uiUnifiedPage .listToolbar__actions{ align-items:end; } .uiUnifiedPage .listToolbar .form, .uiUnifiedPage .inventoryFilters .form, .uiUnifiedPage .partyLedgerToolbar .form, .uiUnifiedPage .accountingToolbar .form{ margin:0; } /* دکمه‌های بالای صفحات عملیاتی با هم هم‌سایز شوند */ .uiUnifiedPage .inventoryPage__head .btn, .uiUnifiedPage .inventoryEditor__head .btn, .uiUnifiedPage .inventoryLines__head .btn{ min-height:42px; } @media (max-width:640px){ .uiUnifiedPage .entityTabs{ gap:8px; overflow-x:auto; } .uiUnifiedPage .entityTabs .inventoryTab{ padding:8px 12px; white-space:nowrap; } .uiUnifiedPage :is(.listToolbar,.inventoryFilters,.partyLedgerToolbar,.accountingToolbar,.inventoryReportFilters,.reportToolbar,.treasuryAccountToolbar) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),select,.selectx-btn), .uiUnifiedPage :is(.listToolbar__actions,.inventoryEditor__actions,.inventoryPage__head,.inventoryFilters,.partyLedgerToolbar__actions,.accountingToolbar__actions,.feedbackActions,.accountPage__headActions,.feedbackPage__headActions) .btn:not(.btn--xs){ min-height:40px; } .uiUnifiedPage .btn.btn--icon, .uiUnifiedPage .listExcel__trigger, .uiUnifiedPage .topIconBtn{ min-width:40px; min-height:40px; width:40px; height:40px; } } /* ---------------- v328: inline action controls inside field + slightly rounder purchase inputs/buttons ---------------- */ .inventoryEditor .inventoryFormGrid > label > input, .inventoryEditor .inventoryFormGrid > label > select, .inventoryEditor .inventoryFormGrid > label > textarea, .inventoryEditor .inventoryFormGrid > label > .selectx, .inventoryEditor .inventoryFormGrid > label > .selectx-btn{ border-radius:14px; } .inventoryEditor .inventoryFormGrid > label > input, .inventoryEditor .inventoryFormGrid > label > select, .inventoryEditor .inventoryFormGrid > label > .selectx-btn{ min-height:48px; } .inventoryEditor .inventoryFormGrid .partyPickerControl, .inventoryEditor .inventoryFormGrid .warehouseSelectControl{ display:flex; align-items:stretch; gap:0; width:100%; margin-top:6px; border:1px solid var(--border); border-radius:16px; background:var(--card); overflow:hidden; } .inventoryEditor .inventoryFormGrid .partyPickerControl input[readonly], .inventoryEditor .inventoryFormGrid .warehouseSelectControl > select, .inventoryEditor .inventoryFormGrid .warehouseSelectControl > .selectx, .inventoryEditor .inventoryFormGrid .warehouseSelectControl > .selectx-btn{ border:none !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; min-height:48px; } .inventoryEditor .inventoryFormGrid .partyPickerControl input[readonly]{ flex:1 1 auto; min-width:0; border:none !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; padding-inline:14px; min-height:48px; } .inventoryEditor .inventoryFormGrid .warehouseSelectControl > select, .inventoryEditor .inventoryFormGrid .warehouseSelectControl > .selectx, .inventoryEditor .inventoryFormGrid .warehouseSelectControl > .selectx-btn{ flex:1 1 auto; min-width:0; } .inventoryEditor .inventoryFormGrid .partyPickerControl__pick, .inventoryEditor .inventoryFormGrid .warehouseSelectControl__add{ flex:0 0 auto; min-height:48px; border:none !important; border-right:1px solid color-mix(in srgb, var(--border) 86%, transparent); border-radius:0 !important; background:color-mix(in srgb, var(--panel) 88%, transparent) !important; box-shadow:none !important; padding-inline:14px; white-space:nowrap; } .inventoryEditor .inventoryFormGrid .partyPickerControl__pick:hover, .inventoryEditor .inventoryFormGrid .warehouseSelectControl__add:hover{ background:color-mix(in srgb, var(--panel) 76%, var(--accent) 24%) !important; } .inventoryEditor .inventoryFormGrid .partyPickerControl__clear{ min-width:44px; width:44px; min-height:48px; border:none !important; border-right:1px solid color-mix(in srgb, var(--border) 86%, transparent); border-radius:0 !important; background:color-mix(in srgb, var(--panel) 88%, transparent) !important; box-shadow:none !important; } .inventoryEditor .inventoryFormGrid .partyPickerControl:focus-within, .inventoryEditor .inventoryFormGrid .warehouseSelectControl:focus-within{ border-color:color-mix(in srgb, var(--accent) 50%, var(--border) 50%); box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 16%, transparent); } .inventoryEditor .inventoryEditor__head .btn, .inventoryEditor .inventoryLines__head .btn, .inventoryEditor .inventoryEditor__actions .btn, .inventoryEditor .inventoryFormGrid .btn{ border-radius:14px; } @media (max-width:760px){ .inventoryEditor .inventoryFormGrid .partyPickerControl, .inventoryEditor .inventoryFormGrid .warehouseSelectControl{ display:grid; grid-template-columns:minmax(0,1fr) auto; } .inventoryEditor .inventoryFormGrid .partyPickerControl__pick, .inventoryEditor .inventoryFormGrid .warehouseSelectControl__add, .inventoryEditor .inventoryFormGrid .partyPickerControl__clear{ border-right:1px solid color-mix(in srgb, var(--border) 86%, transparent); } } /* ---------------- v329: inset action buttons inside fields + slightly rounder boxes system-wide ---------------- */ :root{ --radius:20px; } :root[data-theme="light"], html.theme-light, body.theme-light{ --radius:20px; } /* باکس‌ها و فیلدها کمی گردتر */ .card, .modal__panel, .uploadModal__panel, .tablewrap, .tableShell, .inventoryEditor, .inventoryListCard, .activebox, .navGroup__menu, .formmsg, input, select, textarea, .in, .out, .selectx-btn, .selectx, .pickerField, .warehouseSelectControl, .partyPickerControl{ border-radius:14px; } .btn, .btn--sm, .btn--xs, .btn--icon, .listExcel__trigger, .topIconBtn{ border-radius:14px; } /* ظاهر inset برای دکمه داخل باکس در فرم خرید */ .inventoryEditor .inventoryFormGrid .partyPickerControl, .inventoryEditor .inventoryFormGrid .warehouseSelectControl{ display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:6px; width:100%; margin-top:6px; padding:4px; border:1px solid var(--border); border-radius:16px; background:color-mix(in srgb, var(--card) 96%, transparent); overflow:hidden; } .inventoryEditor .inventoryFormGrid .partyPickerControl input[readonly], .inventoryEditor .inventoryFormGrid .warehouseSelectControl > select, .inventoryEditor .inventoryFormGrid .warehouseSelectControl > .selectx, .inventoryEditor .inventoryFormGrid .warehouseSelectControl > .selectx-btn{ min-width:0; min-height:44px; border:none !important; border-radius:12px !important; background:transparent !important; box-shadow:none !important; } .inventoryEditor .inventoryFormGrid .partyPickerControl input[readonly]{ padding-inline:12px; } .inventoryEditor .inventoryFormGrid .partyPickerControl__pick, .inventoryEditor .inventoryFormGrid .warehouseSelectControl__add, .inventoryEditor .inventoryFormGrid .partyPickerControl__clear{ min-height:36px; align-self:center; border:1px solid color-mix(in srgb, var(--accent) 28%, var(--border) 72%) !important; border-radius:12px !important; background:color-mix(in srgb, var(--panel) 82%, var(--accent) 18%) !important; box-shadow:none !important; } .inventoryEditor .inventoryFormGrid .partyPickerControl__pick, .inventoryEditor .inventoryFormGrid .warehouseSelectControl__add{ padding-inline:14px; } .inventoryEditor .inventoryFormGrid .partyPickerControl__clear{ min-width:36px; width:36px; padding:0; } .inventoryEditor .inventoryFormGrid .partyPickerControl:focus-within, .inventoryEditor .inventoryFormGrid .warehouseSelectControl:focus-within{ border-color:color-mix(in srgb, var(--accent) 52%, var(--border) 48%); box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 14%, transparent); } /* فیلدهای فرم خرید هم نرم‌تر شوند */ .inventoryEditor .inventoryFormGrid > label > input, .inventoryEditor .inventoryFormGrid > label > select, .inventoryEditor .inventoryFormGrid > label > textarea, .inventoryEditor .inventoryFormGrid > label > .selectx-btn, .inventoryEditor .inventoryFormGrid > label > .selectx{ border-radius:14px; } @media (max-width:760px){ .inventoryEditor .inventoryFormGrid .partyPickerControl, .inventoryEditor .inventoryFormGrid .warehouseSelectControl{ grid-template-columns:minmax(0,1fr) auto; } .inventoryEditor .inventoryFormGrid .partyPickerControl__pick, .inventoryEditor .inventoryFormGrid .warehouseSelectControl__add{ padding-inline:12px; font-size:12px; } } /* ---------------- v330: more rounded UI + better alignment + unify send/settings appearance ---------------- */ :root{ --radius:22px; } :root[data-theme="light"], html.theme-light, body.theme-light{ --radius:22px; } /* گردی کلی یک‌پله بیشتر */ .card, .modal__panel, .uploadModal__panel, .tablewrap, .tableShell, .inventoryEditor, .inventoryListCard, .activebox, .navGroup__menu, .formmsg, input, select, textarea, .in, .out, .input--sm, .selectx-btn, .selectx, .pickerField, .warehouseSelectControl, .partyPickerControl, .filepick, .metricCard, .statCard, .topMetric, .dashMetric{ border-radius:16px; } .btn, .btn--sm, .btn--xs, .btn--icon, .listExcel__trigger, .topIconBtn, .iconbtn{ border-radius:16px; } /* تراز پایه‌ی دکمه‌ها و فیلدها */ input, select, textarea, .in, .out, .input--sm, .selectx-btn, .btn:not(.btn--xs), .iconbtn, .filepick{ min-height:44px; } .btn--xs{min-height:30px;} label > input, label > select, label > textarea, label > .selectx, label > .selectx-btn{ width:100%; } .form, .form--pro, .inventoryFormGrid, .inventoryFilters, .invTopGrid{ align-items:end; } .form label, .form--pro label, .inventoryFormGrid label, .inventoryFilters label, .invTopGrid label{ display:grid; gap:6px; } /* صفحه ثبت فاکتور فروش: یکپارچه با بقیه صفحات */ .page--send .inventoryPage__head, .settingsPage__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; padding:0 0 14px; border-bottom:1px solid var(--border); } .page--send .inventoryPage__head h1, .settingsPage__head h1{ margin:0 0 4px; font-size:22px; line-height:1.4; } .page--send .inventoryPage__head p, .settingsPage__head p{ margin:0; color:var(--muted); font-size:12px; line-height:1.9; } .page--send .inventoryTabs, .settingsTabs{ display:flex; align-items:center; gap:8px; width:100%; margin:0 0 14px; padding:0; overflow:auto; border:0; border-bottom:1px solid var(--border); border-radius:0; background:transparent; box-shadow:none !important; } .page--send .inventoryTab, .settingsTab{ flex:0 0 auto; padding:10px 14px; min-height:auto; border:0; border-bottom:2px solid transparent; border-radius:0; background:transparent; color:var(--muted); white-space:nowrap; font-weight:800; box-shadow:none !important; } .page--send .inventoryTab:hover, .settingsTab:hover{color:var(--text);background:transparent;} .page--send .inventoryTab.is-active, .settingsTab.is-active{ color:var(--text); border-bottom-color:var(--accent); background:transparent; } .page--send .invCard, .page--send .card, .settingsPage .card, .settingsPage .performanceSettingsCard, .settingsPage .settingsFiscalPanel .accountingCard{ border-radius:18px; box-shadow:0 10px 28px rgba(0,0,0,.16); } .page--send .input--sm, .page--send .selectx-btn, .settingsPage input, .settingsPage select, .settingsPage textarea, .settingsPage .selectx-btn, .settingsPage .in, .settingsPage .out{ min-height:46px; border-radius:16px; } .page--send textarea.input--sm, .settingsPage textarea{ min-height:110px; } .page--send .btn, .settingsPage .btn, .settingsPage .filepick, .page--send .filepick{ min-height:44px; border-radius:16px; } .page--send .cardHeadRow, .settingsPage .accountCard > h2, .settingsPage .performanceSettingsCard__head{ margin-bottom:12px; } .page--send .invHeadGrid, .settingsPage .grid2, .settingsPage .form--pro{ align-items:start; } .page--send .customerVoiceSlot, .page--send .invoiceVoiceSlot{ top:10px !important; left:16px !important; } /* کنترل‌های داخل باکس در خرید: inset تمیزتر و گردتر */ .inventoryEditor .inventoryFormGrid .partyPickerControl, .inventoryEditor .inventoryFormGrid .warehouseSelectControl{ padding:5px; gap:7px; border-radius:18px; } .inventoryEditor .inventoryFormGrid .partyPickerControl input[readonly], .inventoryEditor .inventoryFormGrid .warehouseSelectControl > select, .inventoryEditor .inventoryFormGrid .warehouseSelectControl > .selectx, .inventoryEditor .inventoryFormGrid .warehouseSelectControl > .selectx-btn{ min-height:46px; border-radius:13px !important; } .inventoryEditor .inventoryFormGrid .partyPickerControl__pick, .inventoryEditor .inventoryFormGrid .warehouseSelectControl__add, .inventoryEditor .inventoryFormGrid .partyPickerControl__clear{ min-height:38px; border-radius:13px !important; } .inventoryEditor .inventoryFormGrid .partyPickerControl__clear{ min-width:38px; width:38px; } /* تنظیمات: فرم‌ها و تب‌ها منظم‌تر و هم‌سایزتر */ .settingsPage{ display:grid; gap:14px; } .settingsPage .settingsPanel{ min-width:0; } .settingsPage .form--pro{ gap:14px 16px; } .settingsPage .keyInputField .keyInputRow, .settingsPage .certFields, .settingsPage .filepick{ align-items:center; } /* هم‌ترازی بهتر نوارهای جستجو و فیلتر */ .uiUnifiedPage .listToolbar, .uiUnifiedPage .inventoryFilters, .uiUnifiedPage .partyLedgerToolbar, .uiUnifiedPage .accountingToolbar, .page--send .inv-toolbar2__row, .settingsPage .row{ align-items:end; } @media (max-width:900px){ .page--send .inventoryPage__head, .settingsPage__head{ display:grid; } } @media (max-width:700px){ input, select, textarea, .in, .out, .input--sm, .selectx-btn, .btn:not(.btn--xs), .iconbtn, .filepick{ min-height:42px; } .page--send .inventoryPage__head h1, .settingsPage__head h1{ font-size:20px; } .page--send .inventoryTab, .settingsTab{ padding:9px 12px; } } /* ---------------- v331: rounder surfaces + exact control alignment (visual only) ---------------- */ :root{ --radius:24px; --ui-card-radius:21px; --ui-control-radius:18px; --ui-inner-radius:14px; --ui-control-height:46px; } :root[data-theme="light"], html.theme-light, body.theme-light{ --radius:24px; } /* تمام سطوح اصلی یک زبان گردی مشترک داشته باشند. */ .card, .modal__panel, .uploadModal__panel, .tablewrap, .tableWrap, .tableShell, .inventoryEditor, .inventoryListCard, .activebox, .navGroup__menu, .formmsg, .fieldbox, .filter-mini, .filepick, .metricCard, .statCard, .topMetric, .dashMetric, .accountingCard, .accountingModal__panel, .accountingEmpty, .pluginCard, .pluginsIntroCard, .performanceSettingsCard, .buyerFacts, .invBottomCol, .sendDock{ border-radius:var(--ui-card-radius) !important; } input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), select, textarea, .in, .out, .input--sm, .selectx, .selectx-btn, .pickerField, .warehouseSelectControl, .partyPickerControl{ border-radius:var(--ui-control-radius); } .btn, .btn--sm, .btn--xs, .btn--icon, .listExcel__trigger, .topIconBtn, .iconbtn{ border-radius:var(--ui-control-radius); } /* ارتفاع، box-sizing و خط مبنا برای فیلد و دکمه یکسان است. */ input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), select, .in, .out, .input--sm, .selectx-btn, .btn:not(.btn--xs), .iconbtn{ min-height:var(--ui-control-height); height:var(--ui-control-height); box-sizing:border-box; } textarea{ min-height:96px; height:auto; } .btn{ display:inline-flex; align-items:center; justify-content:center; line-height:1.2; } .btn--xs{ min-height:32px; height:32px; border-radius:13px; } .invActionBtn.btn--iconOnly, .inputAction--moadian .inputAction__btn, .page--send .lineTitlePick > .inAffix__btn, .page--send .lineTitlePick > button[data-act="pickItem"]{ border-radius:14px !important; } .fact, .totals__row, .payrow, .inventoryReportStat, .partyLedgerStat{ border-radius:16px !important; } /* گریدهای فرمی و ردیف عملیات روی یک خط مبنا بنشینند. */ .form, .form--pro, .inventoryFormGrid, .inventoryFilters, .invTopGrid, .accountingForm, .accountingForm__two{ align-items:end; } .form > .row, .form > .actions, .inventoryEditor__actions, .inventoryLines__head, .inventoryFilters, .listToolbar__actions, .accountingForm__actions{ align-items:center; } .form label, .form--pro label, .inventoryFormGrid label, .inventoryFilters label, .invTopGrid label, .accountingForm label{ gap:7px; } /* کنترل‌های دکمه‌دار خرید/انبار دقیقاً هم‌قد فیلدهای ساده باشند. */ .inventoryEditor .inventoryFormGrid .partyPickerControl, .inventoryEditor .inventoryFormGrid .warehouseSelectControl{ min-height:var(--ui-control-height); height:var(--ui-control-height); margin-top:0; padding:4px; gap:6px; border-radius:var(--ui-control-radius); } .inventoryEditor .inventoryFormGrid .partyPickerControl input[readonly], .inventoryEditor .inventoryFormGrid .warehouseSelectControl > select, .inventoryEditor .inventoryFormGrid .warehouseSelectControl > .selectx, .inventoryEditor .inventoryFormGrid .warehouseSelectControl > .selectx-btn{ min-height:36px; height:36px; border-radius:var(--ui-inner-radius) !important; } .inventoryEditor .inventoryFormGrid .partyPickerControl__pick, .inventoryEditor .inventoryFormGrid .warehouseSelectControl__add, .inventoryEditor .inventoryFormGrid .partyPickerControl__clear{ min-height:36px; height:36px; align-self:center; border-radius:var(--ui-inner-radius) !important; } .inventoryEditor .inventoryFormGrid .partyPickerControl__clear{ min-width:36px; width:36px; } /* ثبت فاکتور: کارت‌ها، ستون‌ها و کنترل خریدار هم‌شکل و هم‌تراز شوند. */ .page--send .invCard, .page--send .card{ border-radius:var(--ui-card-radius); } .page--send .invHeadGrid, .page--send .invBottomGrid{ align-items:stretch; } .page--send .invHeadCol{ min-width:0; } .page--send .cardHeadRow{ min-height:42px; align-items:center; } .page--send .input--sm, .page--send .selectx-btn, .page--send .btn:not(.btn--xs){ min-height:var(--ui-control-height); height:var(--ui-control-height); border-radius:var(--ui-control-radius); } .page--send .invSend--v2 .invHeadCol--buyer .fact{ border-radius:16px; } .page--send .invHeadCol--buyer .buyerCodeControl{ min-height:var(--ui-control-height); height:var(--ui-control-height); padding:4px; gap:6px; border:1px solid var(--border); border-radius:var(--ui-control-radius); background:color-mix(in srgb, var(--card) 96%, transparent); overflow:hidden; } .page--send .invHeadCol--buyer .buyerCodeControl > input, .page--send .invHeadCol--buyer .buyerCodeControl #buyerCode{ min-height:36px !important; height:36px !important; border:0 !important; border-radius:var(--ui-inner-radius) !important; background:transparent !important; box-shadow:none !important; } .page--send .invHeadCol--buyer .buyerCodeControl__find, .page--send .invHeadCol--buyer .buyerCodeControl__clear, .page--send .invHeadCol--buyer #btnBuyerLookup, .page--send .invHeadCol--buyer #btnBuyerClear{ min-height:36px !important; height:36px !important; align-self:center !important; border-radius:var(--ui-inner-radius) !important; } .page--send .invHeadCol--buyer .buyerCodeControl:focus-within{ border-color:color-mix(in srgb, var(--accent) 52%, var(--border) 48%); box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 14%, transparent); } .page--send .sendDock{ padding:10px; border:1px solid var(--border); } .page--send .sendDock__btn, .page--send .sendDock__btn--primary{ min-height:42px !important; height:42px; border-radius:15px !important; } /* تنظیمات: تمام تب‌ها یک ساختار سطح، فاصله و ارتفاع کنترل مشترک دارند. */ .settingsPage{ gap:16px; } .settingsPage .card, .settingsPage .performanceSettingsCard, .settingsPage .settingsFiscalPanel .accountingCard, .settingsPage .pluginCard, .settingsPage .pluginsIntroCard{ border:1px solid var(--border); border-radius:var(--ui-card-radius); background:var(--card); box-shadow:0 10px 28px rgba(0,0,0,.14); } .settingsPage .grid2{ align-items:stretch; } .settingsPage .grid2 > .card{ height:100%; } .settingsPage .form--pro, .settingsPage .accountingForm{ align-items:end; } .settingsPage input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), .settingsPage select, .settingsPage .selectx-btn, .settingsPage .in, .settingsPage .out, .settingsPage .btn:not(.btn--xs){ min-height:var(--ui-control-height); height:var(--ui-control-height); border-radius:var(--ui-control-radius); } .settingsPage textarea{ min-height:110px; height:auto; border-radius:var(--ui-control-radius); } .settingsPage .row, .settingsPage .actions, .settingsPage .pluginCard__actions, .settingsPage .printActionBtns{ align-items:center; } .settingsPage .filepick{ min-height:var(--ui-control-height); height:auto; padding:4px 6px; border-radius:var(--ui-control-radius); } .settingsPage .filepick .btn, .settingsPage .keyInputInline__pick, .settingsPage .keyInputInline__clear{ min-height:36px !important; height:36px !important; border-radius:var(--ui-inner-radius) !important; } .settingsPage .keyInputInline__actions{ left:6px; } .settingsPage .performanceSetting{ min-height:66px; } .settingsPage .pluginCard__actions .btn{ min-width:110px; } @media (max-width:700px){ :root{ --ui-card-radius:19px; --ui-control-radius:17px; --ui-control-height:44px; } .page--send .sendDock__btn, .page--send .sendDock__btn--primary{ min-height:40px !important; height:40px; border-radius:14px !important; } .page--send .invHeadCol--buyer .buyerCodeControl{ min-height:var(--ui-control-height); height:var(--ui-control-height); } .page--send .invHeadCol--buyer .buyerCodeControl > input, .page--send .invHeadCol--buyer .buyerCodeControl #buyerCode, .page--send .invHeadCol--buyer .buyerCodeControl__find, .page--send .invHeadCol--buyer .buyerCodeControl__clear, .page--send .invHeadCol--buyer #btnBuyerLookup, .page--send .invHeadCol--buyer #btnBuyerClear{ min-height:34px !important; height:34px !important; } } /* ---------------- v332: one pill-style tab system across all application modules ---------------- */ /* مدل منتخب: قاب گرد + پس‌زمینه مشخص برای تب فعال */ .main .page :is( .inventoryTabs, .settingsTabs, .accountingTabs, .treasuryTabs, .adminTabs ){ display:flex; align-items:center; gap:4px; width:max-content; max-width:100%; min-height:52px; margin:0 0 14px; padding:4px; overflow-x:auto; overflow-y:hidden; border:1px solid var(--border) !important; border-radius:18px !important; background:color-mix(in srgb, var(--card) 96%, transparent) !important; box-shadow:none !important; scrollbar-width:thin; } .main .page :is( .inventoryTab, .settingsTab, .accountingTab, .treasuryTab, .adminTab ){ flex:0 0 auto; min-height:42px; padding:9px 16px; border:1px solid transparent !important; border-radius:14px !important; background:transparent !important; color:var(--muted); box-shadow:none !important; font:inherit; font-size:13px; font-weight:850; line-height:1.4; text-align:center; white-space:nowrap; cursor:pointer; transition: color .16s ease, background-color .16s ease, border-color .16s ease; } .main .page :is( .inventoryTab, .settingsTab, .accountingTab, .treasuryTab, .adminTab ):hover{ border-color:transparent !important; background:color-mix(in srgb, var(--panel) 90%, var(--text) 10%) !important; color:var(--text); } .main .page :is( .inventoryTab, .settingsTab, .accountingTab, .treasuryTab, .adminTab ).is-active{ border-color:color-mix(in srgb, var(--accent) 24%, transparent) !important; background:color-mix(in srgb, var(--panel) 76%, var(--accent) 24%) !important; color:var(--text) !important; box-shadow:none !important; } /* خنثی‌سازی کامل مدل خطی قبلی در تب‌های ثبت/فهرست و فروش/تنظیمات */ .main .page .entityTabs, .main .page .salesModuleTabs, .main .page .settingsTabs{ border-bottom:1px solid var(--border) !important; } .main .page .entityTabs .inventoryTab, .main .page .salesModuleTabs .inventoryTab, .main .page .settingsTabs .settingsTab{ border-bottom-color:transparent !important; } @media (max-width:700px){ .main .page :is( .inventoryTabs, .settingsTabs, .accountingTabs, .treasuryTabs, .adminTabs ){ width:100%; min-height:50px; margin-bottom:12px; padding:4px; border-radius:17px !important; } .main .page :is( .inventoryTab, .settingsTab, .accountingTab, .treasuryTab, .adminTab ){ min-height:40px; padding:8px 14px; border-radius:13px !important; } } /* ---------------- v333: underline tabs + cleaner purchase field layout (visual only) ---------------- */ /* بازگشت همه تب‌های اصلی به مدل سبک با خط آبی زیر تب فعال */ .main .page :is( .inventoryTabs, .settingsTabs, .accountingTabs, .treasuryTabs, .adminTabs ){ display:flex; align-items:flex-end; flex-wrap:nowrap; gap:10px; width:100%; max-width:100%; min-height:0; margin:0 0 18px; padding:0; overflow-x:auto; overflow-y:hidden; border:0 !important; border-bottom:1px solid var(--border) !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; scrollbar-width:thin; } .main .page :is( .inventoryTab, .settingsTab, .accountingTab, .treasuryTab, .adminTab ){ flex:0 0 auto; min-height:42px; padding:10px 15px 11px; border:0 !important; border-bottom:3px solid transparent !important; border-radius:0 !important; background:transparent !important; color:var(--muted); box-shadow:none !important; font:inherit; font-size:13px; font-weight:850; line-height:1.4; text-align:center; white-space:nowrap; cursor:pointer; transition:color .16s ease, border-color .16s ease; } .main .page :is( .inventoryTab, .settingsTab, .accountingTab, .treasuryTab, .adminTab ):hover{ border-bottom-color:color-mix(in srgb, var(--accent) 35%, transparent) !important; background:transparent !important; color:var(--text); } .main .page :is( .inventoryTab, .settingsTab, .accountingTab, .treasuryTab, .adminTab ).is-active{ border-bottom-color:var(--accent) !important; background:transparent !important; color:var(--text) !important; box-shadow:none !important; } /* فرم خرید: سه فیلد ساده در ردیف اول، دو کنترل اصلی در ردیف دوم */ #purchaseEditor{ padding:20px; } #purchaseEditor .inventoryEditor__head{ min-height:auto; margin:0 0 18px; padding:0 0 14px; border-bottom:1px solid var(--app-surface-border,var(--border)); } #purchaseEditor .inventoryEditor__head h2{ font-size:18px; line-height:1.5; } #purchaseEditor .inventoryFormGrid{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:14px 16px; align-items:end; margin-top:0; } #purchaseEditor .inventoryFormGrid > label{ min-width:0; align-content:end; gap:8px; color:var(--muted); font-size:12px; font-weight:800; } #purchaseEditor .inventoryFormGrid > label:nth-child(1){ grid-column:1 / span 4; grid-row:1; } #purchaseEditor .inventoryFormGrid > label:nth-child(3){ grid-column:5 / span 4; grid-row:1; } #purchaseEditor .inventoryFormGrid > label:nth-child(5){ grid-column:9 / span 4; grid-row:1; } #purchaseEditor .inventoryFormGrid > label:nth-child(4){ grid-column:1 / span 6; grid-row:2; } #purchaseEditor .inventoryFormGrid > label:nth-child(2){ grid-column:7 / span 6; grid-row:2; } #purchaseEditor .inventoryFormGrid > label:nth-child(6){ grid-column:1 / -1; grid-row:3; } #purchaseEditor .inventoryFormGrid > label > input, #purchaseEditor .inventoryFormGrid > label > select, #purchaseEditor .inventoryFormGrid > label > .selectx-btn, #purchaseEditor .inventoryFormGrid .partyPickerControl, #purchaseEditor .inventoryFormGrid .warehouseSelectControl{ width:100%; min-width:0; min-height:48px; height:48px; } #purchaseEditor .inventoryFormGrid .partyPickerControl, #purchaseEditor .inventoryFormGrid .warehouseSelectControl{ margin:0; padding:4px; gap:6px; border:1px solid var(--app-surface-border,var(--border)); border-radius:16px; background:var(--app-field-surface); } #purchaseEditor .inventoryFormGrid .partyPickerControl input[readonly], #purchaseEditor .inventoryFormGrid .warehouseSelectControl > select, #purchaseEditor .inventoryFormGrid .warehouseSelectControl > .selectx, #purchaseEditor .inventoryFormGrid .warehouseSelectControl > .selectx-btn{ min-height:38px; height:38px; border:0 !important; border-radius:12px !important; background:transparent !important; box-shadow:none !important; } #purchaseEditor .inventoryFormGrid .partyPickerControl__pick, #purchaseEditor .inventoryFormGrid .warehouseSelectControl__add{ min-height:38px; height:38px; padding-inline:14px; border-radius:12px !important; white-space:nowrap; } #purchaseEditor .inventoryLines{ margin-top:24px; padding-top:18px; border-top:1px solid var(--app-surface-border,var(--border)); } @media (max-width:900px){ #purchaseEditor .inventoryFormGrid{ grid-template-columns:repeat(2,minmax(0,1fr)); } #purchaseEditor .inventoryFormGrid > label:nth-child(1){ grid-column:1; grid-row:1; } #purchaseEditor .inventoryFormGrid > label:nth-child(3){ grid-column:2; grid-row:1; } #purchaseEditor .inventoryFormGrid > label:nth-child(5){ grid-column:1; grid-row:2; } #purchaseEditor .inventoryFormGrid > label:nth-child(2){ grid-column:2; grid-row:2; } #purchaseEditor .inventoryFormGrid > label:nth-child(4){ grid-column:1 / -1; grid-row:3; } #purchaseEditor .inventoryFormGrid > label:nth-child(6){ grid-column:1 / -1; grid-row:4; } } @media (max-width:640px){ .main .page :is( .inventoryTabs, .settingsTabs, .accountingTabs, .treasuryTabs, .adminTabs ){ gap:7px; margin-bottom:14px; } .main .page :is( .inventoryTab, .settingsTab, .accountingTab, .treasuryTab, .adminTab ){ min-height:40px; padding:9px 12px 10px; } #purchaseEditor{ padding:15px; } #purchaseEditor .inventoryEditor__head{ margin-bottom:15px; padding-bottom:12px; } #purchaseEditor .inventoryFormGrid{ grid-template-columns:1fr; gap:12px; } #purchaseEditor .inventoryFormGrid > label:nth-child(n){ grid-column:1; grid-row:auto; } #purchaseEditor .inventoryFormGrid .partyPickerControl, #purchaseEditor .inventoryFormGrid .warehouseSelectControl{ grid-template-columns:minmax(0,1fr) auto; } } /* ---------------- v334: settings + invoice registration use the shared UI system (visual only) ---------------- */ .page--send, .settingsPage{ --ui-card-radius:12px; --ui-control-radius:9px; --ui-inner-radius:8px; --ui-control-height:40px; --ui-section-gap:14px; --ui-soft-line:color-mix(in oklab,var(--border) 78%,transparent); width:100%; max-width:none; min-width:0; } /* تیتر صفحه دقیقاً هم‌زبان صفحات خرید، انبار و طرف‌حساب */ .page--send .inventoryPage__head, .settingsPage__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; min-height:auto; margin:0 0 var(--ui-section-gap); padding:0 0 13px; border:0; border-bottom:1px solid var(--ui-soft-line); border-radius:0; background:transparent !important; box-shadow:none !important; } .page--send .inventoryPage__head h1, .settingsPage__head h1{ margin:0 0 4px; font-size:22px; line-height:1.45; } .page--send .inventoryPage__head p, .settingsPage__head p{ margin:0; color:var(--muted); font-size:12px; line-height:1.85; } /* سطح، کادر و سایه کارت‌ها مثل سایر ماژول‌ها */ .page--send .card, .page--send .invCard, .settingsPage .card, .settingsPage .accountingCard, .settingsPage .performanceSettingsCard, .settingsPage .pluginCard, .settingsPage .pluginsIntroCard{ border:1px solid var(--ui-soft-line); border-radius:var(--ui-card-radius) !important; background:var(--card); box-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } .page--send .invHeadCol--buyer, .page--send .invBottomCol{ border-color:var(--ui-soft-line); } /* عنوان داخلی کارت‌ها با اندازه و جداکننده مشترک */ .page--send .cardHeadRow, .settingsPage .accountingCard__head, .settingsPage .performanceSettingsCard__head{ min-height:auto; margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--ui-soft-line); align-items:center; } .page--send .cardHeadRow h2, .settingsPage .accountingCard__head h2, .settingsPage .performanceSettingsCard__head h2{ margin:0 0 3px; font-size:16px; line-height:1.5; } .settingsPage .card > h2, .settingsPage .accountCard > h2{ margin:0 0 12px; padding-bottom:10px; border-bottom:1px solid var(--ui-soft-line); font-size:16px; line-height:1.5; } /* فیلدها و دکمه‌ها: همان ارتفاع، شعاع و سطح صفحات دیگر */ .page--send :is( input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), select, .input--sm, .in, .out, .selectx-btn ), .settingsPage :is( input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), select, .input--sm, .in, .out, .selectx-btn ){ min-height:var(--ui-control-height); height:var(--ui-control-height); border-radius:var(--ui-control-radius); border-color:var(--app-surface-border,var(--border)); background:var(--app-field-surface); box-shadow:none !important; } .page--send textarea, .settingsPage textarea{ min-height:92px; height:auto; border-radius:var(--ui-control-radius); border-color:var(--app-surface-border,var(--border)); background:var(--app-field-surface); box-shadow:none !important; } .page--send .btn:not(.btn--xs), .settingsPage .btn:not(.btn--xs){ min-height:var(--ui-control-height); height:var(--ui-control-height); border-radius:var(--ui-control-radius); box-shadow:none !important; } .page--send .btn--xs, .settingsPage .btn--xs{ min-height:30px; height:30px; border-radius:8px; } .page--send :is(.form,.form--pro,.invTopGrid), .settingsPage :is(.form,.form--pro,.accountingForm){ gap:12px 14px; } .page--send :is(.form,.form--pro,.invTopGrid) label, .settingsPage :is(.form,.form--pro,.accountingForm) label{ gap:6px; color:var(--muted); font-size:12px; line-height:1.7; } /* کنترل انتخاب خریدار در ثبت فروش نیز مثل کنترل‌های ترکیبی سایر فرم‌ها */ .page--send .invHeadCol--buyer .buyerCodeControl{ min-height:var(--ui-control-height); height:var(--ui-control-height); padding:4px; gap:5px; border-color:var(--app-surface-border,var(--border)); border-radius:var(--ui-control-radius); background:var(--app-field-surface); box-shadow:none; } .page--send .invHeadCol--buyer .buyerCodeControl > input, .page--send .invHeadCol--buyer .buyerCodeControl #buyerCode, .page--send .invHeadCol--buyer .buyerCodeControl__find, .page--send .invHeadCol--buyer .buyerCodeControl__clear, .page--send .invHeadCol--buyer #btnBuyerLookup, .page--send .invHeadCol--buyer #btnBuyerClear{ min-height:30px !important; height:30px !important; border-radius:var(--ui-inner-radius) !important; } .page--send .invSend--v2 .invHeadCol--buyer .fact, .page--send .totals__row{ border-radius:10px !important; } .page--send .tableWrap--lines{ border:1px solid var(--ui-soft-line); border-radius:10px; background:var(--card); box-shadow:none !important; } .page--send .table--lines thead th{ background:color-mix(in oklab,var(--card) 90%,var(--panel) 10%); border-bottom-color:var(--ui-soft-line); } .page--send .sendDock{ padding:10px; border:1px solid var(--ui-soft-line); border-radius:var(--ui-card-radius) !important; background:var(--card); box-shadow:none !important; } .page--send .sendDock__btn, .page--send .sendDock__btn--primary{ min-height:38px !important; height:38px; border-radius:var(--ui-control-radius) !important; } /* تنظیمات: فاصله‌ها و فایل‌پیکرها هم‌اندازه فرم‌های عادی */ .settingsPage{ gap:var(--ui-section-gap); } .settingsPage .settingsPanel{ min-width:0; } .settingsPage .grid2{ gap:var(--ui-section-gap); align-items:start; } .settingsPage .grid2 > .card{ height:auto; } .settingsPage .filepick{ min-height:var(--ui-control-height); padding:4px 6px; border-radius:var(--ui-control-radius) !important; border-color:var(--app-surface-border,var(--border)); background:var(--app-field-surface); box-shadow:none !important; } .settingsPage .filepick .btn, .settingsPage .keyInputInline__pick, .settingsPage .keyInputInline__clear{ min-height:30px !important; height:30px !important; border-radius:var(--ui-inner-radius) !important; } .settingsPage .performanceSetting{ min-height:62px; } .settingsPage .pluginsGrid{ gap:var(--ui-section-gap); } /* فرم خرید هم از همان ارتفاع و شعاع مشترک استفاده کند؛ چیدمان V333 حفظ می‌شود */ #purchaseEditor .inventoryFormGrid > label > input, #purchaseEditor .inventoryFormGrid > label > select, #purchaseEditor .inventoryFormGrid > label > .selectx-btn, #purchaseEditor .inventoryFormGrid .partyPickerControl, #purchaseEditor .inventoryFormGrid .warehouseSelectControl{ min-height:42px; height:42px; border-radius:var(--ui-control-radius); } #purchaseEditor .inventoryFormGrid .partyPickerControl input[readonly], #purchaseEditor .inventoryFormGrid .warehouseSelectControl > select, #purchaseEditor .inventoryFormGrid .warehouseSelectControl > .selectx, #purchaseEditor .inventoryFormGrid .warehouseSelectControl > .selectx-btn, #purchaseEditor .inventoryFormGrid .partyPickerControl__pick, #purchaseEditor .inventoryFormGrid .warehouseSelectControl__add{ min-height:32px; height:32px; border-radius:8px !important; } @media (max-width:900px){ .page--send .inventoryPage__head, .settingsPage__head{ display:grid; gap:10px; } } @media (max-width:640px){ .page--send, .settingsPage{ --ui-card-radius:10px; --ui-control-radius:8px; --ui-inner-radius:7px; --ui-section-gap:12px; } .page--send .inventoryPage__head, .settingsPage__head{ padding-bottom:11px; } .page--send .inventoryPage__head h1, .settingsPage__head h1{ font-size:20px; } .settingsPage .grid2{ grid-template-columns:1fr; } } /* ---------------- v335: icon party pickers + reserved invoice microphone space (visual only) ---------------- */ /* ذره‌بین آیکنی برای انتخاب طرف حساب در خرید، انبار و دریافت/پرداخت */ .partyPickerControl:has(.partyPickerControl__pick--icon){ grid-template-columns:minmax(0,1fr) 32px auto; align-items:center; min-height:40px; height:40px; margin-top:0; padding:3px; gap:4px; border:1px solid var(--app-surface-border,var(--border)); border-radius:var(--ui-control-radius,9px); background:var(--app-field-surface); overflow:hidden; } .partyPickerControl:has(.partyPickerControl__pick--icon) input[readonly]{ min-width:0; min-height:32px !important; height:32px !important; padding-inline:10px; border:0 !important; border-radius:7px !important; background:transparent !important; box-shadow:none !important; } .partyPickerControl__pick--icon{ display:inline-grid !important; place-items:center; width:32px !important; min-width:32px !important; height:32px !important; min-height:32px !important; padding:0 !important; border-radius:8px !important; line-height:1 !important; box-shadow:none !important; } .partyPickerControl__pick--icon svg{ display:block; width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; } .partyPickerControl:has(.partyPickerControl__pick--icon) .partyPickerControl__clear{ align-self:center; width:32px; min-width:32px; height:32px; min-height:32px; padding:0; border-radius:8px !important; } /* سربرگ مشخصات فاکتور برای دکمه میکروفن فضای واقعی داشته باشد. */ .page--send .invHeadCol--meta{ padding-top:0; } .page--send .invHeadCol--meta > .cardHeadRow{ min-height:62px; margin-bottom:12px; padding:0 0 10px 68px; align-items:center; } .page--send .invoiceVoiceSlot--meta{ top:5px !important; left:8px !important; } .page--send .invoiceVoiceSlot--meta .customerVoiceSmartBtn{ width:48px !important; min-width:48px !important; height:48px !important; min-height:48px !important; } @media (max-width:640px){ .partyPickerControl:has(.partyPickerControl__pick--icon){ grid-template-columns:minmax(0,1fr) 32px auto; } .page--send .invHeadCol--meta > .cardHeadRow{ min-height:56px; padding-left:58px; } .page--send .invoiceVoiceSlot--meta{ top:4px !important; left:6px !important; } .page--send .invoiceVoiceSlot--meta .customerVoiceSmartBtn{ width:44px !important; min-width:44px !important; height:44px !important; min-height:44px !important; } } /* ---------------- v336: unified lookup icons + warehouse definition placement (visual only) ---------------- */ .lookupIconBtn{ display:inline-grid !important; place-items:center !important; width:32px !important; min-width:32px !important; max-width:32px !important; height:32px !important; min-height:32px !important; padding:0 !important; align-self:center !important; border-radius:8px !important; line-height:1 !important; box-shadow:none !important; } .lookupIconBtn svg{ display:block; width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; } .inAffix:has(> .lookupIconBtn) > input, .inAffix:has(> .lookupIconBtn) > .in{ padding-left:46px !important; } .inAffix > .lookupIconBtn{ left:5px !important; top:50% !important; transform:translateY(-50%) !important; } .inventoryPurchaseItemPick > .lookupIconBtn, .page--send .lineTitlePick > .lookupIconBtn, .page--send .lineTitlePick > button[data-act="pickItem"].lookupIconBtn{ width:32px !important; min-width:32px !important; max-width:32px !important; height:32px !important; min-height:32px !important; padding:0 !important; } .page--send .invHeadCol--buyer .buyerCodeControl{ grid-template-columns:minmax(0,1fr) 32px 58px !important; align-items:center !important; } .page--send .invHeadCol--buyer .buyerCodeControl__find.lookupIconBtn, .page--send .invHeadCol--buyer #btnBuyerLookup.lookupIconBtn{ position:static !important; inset:auto !important; transform:none !important; width:32px !important; min-width:32px !important; max-width:32px !important; height:30px !important; min-height:30px !important; padding:0 !important; } .entityTabPanel--warehouses{ min-width:0; } .entityTabPanel--warehouses > .inventoryMessage{ margin:0 0 12px; } .entityTabPanel--warehouses .warehouseDefinitionGrid{ margin-top:0; } @media(max-width:720px){ .page--send .invHeadCol--buyer .buyerCodeControl{ grid-template-columns:minmax(0,1fr) 32px 54px !important; gap:5px !important; } .page--send .invHeadCol--buyer .buyerCodeControl__find.lookupIconBtn, .page--send .invHeadCol--buyer #btnBuyerLookup.lookupIconBtn{ height:32px !important; min-height:32px !important; } } /* ---------------- v349: human dashboard, due dates and unified view motion ---------------- */ .sidebar__footer{ border-top:0 !important; padding-top:2px !important; } .dashboardV349{ --dash349-line:color-mix(in srgb,var(--border) 92%,transparent); --dash349-soft:color-mix(in srgb,var(--card) 94%,var(--bg2)); width:100%; min-width:0; max-width:100%; padding-bottom:28px; } .dashboardV349 .dash349Header{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; min-width:0; margin-bottom:14px; padding:4px 2px 16px; border-bottom:1px solid var(--dash349-line); } .dashboardV349 .dash349Header__title{ min-width:0; } .dashboardV349 .dash349Eyebrow{ display:block; margin-bottom:2px; color:var(--accent2); font-size:11px; font-weight:800; } .dashboardV349 .dash349Header h1{ margin:0; color:var(--text); font-size:28px; line-height:1.45; letter-spacing:-.035em; } .dashboardV349 .dash349Header p{ margin:2px 0 0; color:var(--muted); font-size:12px; line-height:1.8; } .dashboardV349 .dash349Header__side{ display:flex; align-items:flex-end; flex-direction:column; gap:8px; min-width:min(100%,440px); } .dashboardV349 .dash349Today{ color:var(--muted); font-size:11px; font-weight:750; } .dashboardV349 .dash349Context{ display:flex; align-items:center; min-width:0; overflow:hidden; border:1px solid var(--dash349-line); border-radius:14px; background:transparent; } .dashboardV349 .dash349Context > span{ display:flex; align-items:flex-start; flex-direction:column; gap:1px; min-width:105px; max-width:190px; padding:7px 11px; } .dashboardV349 .dash349Context > span + span{ border-inline-start:1px solid var(--dash349-line); } .dashboardV349 .dash349Context small{ color:var(--muted); font-size:8.5px; } .dashboardV349 .dash349Context strong{ overflow:hidden; width:100%; color:var(--text); font-size:11px; line-height:1.6; text-overflow:ellipsis; white-space:nowrap; } .dashboardV349 .dashGuestWelcome{ margin-bottom:12px; padding:12px 14px; border:1px solid color-mix(in srgb,var(--accent) 25%,var(--dash349-line)); border-radius:14px; background:color-mix(in srgb,var(--accent) 5%,transparent); box-shadow:none; } .dashboardV349 .dash349Quick{ display:flex; align-items:center; flex-wrap:wrap; gap:7px; margin-bottom:12px; } .dashboardV349 .dash349Quick button{ display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:7px 11px; border:1px solid var(--dash349-line); border-radius:11px; color:var(--text); background:transparent; font:inherit; font-size:10.5px; font-weight:750; cursor:pointer; transition:background-color 150ms ease,border-color 150ms ease,color 150ms ease; } .dashboardV349 .dash349Quick button:hover{ border-color:color-mix(in srgb,var(--accent) 35%,var(--dash349-line)); color:var(--accent2); background:color-mix(in srgb,var(--accent) 6%,transparent); } .dashboardV349 .dash349Quick svg{ width:15px; height:15px; } .dashboardV349 .dash349Stats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:12px; } .dashboardV349 .dash349Metric{ position:relative; min-width:0; min-height:116px; overflow:hidden; padding:13px 14px; border:1px solid var(--dash349-line); border-radius:16px; background:var(--dash349-soft); box-shadow:none; } .dashboardV349 .dash349Metric__mark{ position:absolute; inset-block:13px; inset-inline-start:0; width:3px; border-radius:0 3px 3px 0; background:var(--accent); } .dashboardV349 .dash349Metric--cash .dash349Metric__mark{background:#2aa978;} .dashboardV349 .dash349Metric--vat .dash349Metric__mark{background:#d79a35;} .dashboardV349 .dash349Metric--books .dash349Metric__mark{background:#8a78df;} .dashboardV349 .dash349Metric__top{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; } .dashboardV349 .dash349Metric__top span{ color:var(--text); font-size:11px; font-weight:800; } .dashboardV349 .dash349Metric__top small{ color:var(--muted); font-size:8.5px; } .dashboardV349 .dash349Metric > strong{ display:block; overflow:hidden; color:var(--text); font-size:21px; line-height:1.55; text-overflow:ellipsis; white-space:nowrap; } .dashboardV349 .dash349Metric > p{ margin:2px 0 0; color:var(--muted); font-size:9.5px; } .dashboardV349 .dash349Metric > p b{ color:var(--text); } .dashboardV349 .dash349Grid{ display:grid; grid-template-columns:minmax(0,1.65fr) minmax(300px,.75fr); gap:12px; align-items:start; } .dashboardV349 .dash349Panel{ min-width:0; padding:14px; border:1px solid var(--dash349-line); border-radius:16px; background:var(--dash349-soft); box-shadow:none; } .dashboardV349 .dash349Panel__head, .dashboardV349 .dash349Subhead{ display:flex; align-items:center; justify-content:space-between; gap:12px; } .dashboardV349 .dash349Panel__head{ margin-bottom:10px; } .dashboardV349 .dash349Panel__head h2, .dashboardV349 .dash349Subhead h3{ margin:0; color:var(--text); } .dashboardV349 .dash349Panel__head h2{ font-size:14px; } .dashboardV349 .dash349Subhead h3{ font-size:11px; } .dashboardV349 .dash349Panel__head p{ margin:2px 0 0; color:var(--muted); font-size:9.5px; } .dashboardV349 .dash349Link{ min-height:28px; padding:4px 7px; border:0; border-radius:8px; color:var(--accent2); background:transparent; font:inherit; font-size:9.5px; font-weight:800; cursor:pointer; } .dashboardV349 .dash349Link:hover{ background:color-mix(in srgb,var(--accent) 7%,transparent); } .dashboardV349 .dash349Chart{ width:100%; min-height:250px; } .dashboardV349 .dash349Chart canvas{ display:block; width:100% !important; height:250px !important; } .dashboardV349 .dash349Count{ display:grid; place-items:center; min-width:30px; height:26px; padding-inline:8px; border:1px solid color-mix(in srgb,var(--accent) 28%,var(--dash349-line)); border-radius:9px; color:var(--accent2); background:color-mix(in srgb,var(--accent) 6%,transparent); font-size:10px; font-weight:850; } .dashboardV349 .dash349DueList{ display:flex; flex-direction:column; min-height:250px; } .dashboardV349 .dash349Due{ display:grid; grid-template-columns:82px minmax(0,1fr) auto; align-items:center; gap:9px; width:100%; min-width:0; padding:9px 0; border:0; border-bottom:1px solid var(--dash349-line); color:var(--text); background:transparent; font:inherit; text-align:start; cursor:pointer; } .dashboardV349 .dash349Due:hover .dash349Due__main strong{ color:var(--accent2); } .dashboardV349 .dash349Due__date{ display:flex; align-items:flex-start; flex-direction:column; gap:1px; padding-inline-start:8px; border-inline-start:2px solid #5e8fe8; } .dashboardV349 .dash349Due__date--urgent{border-color:#d79a35;} .dashboardV349 .dash349Due__date--overdue{border-color:var(--danger);} .dashboardV349 .dash349Due__date b{ font-size:9.5px; } .dashboardV349 .dash349Due__date small, .dashboardV349 .dash349Due__main small{ color:var(--muted); font-size:8.5px; } .dashboardV349 .dash349Due__main{ display:flex; align-items:flex-start; flex-direction:column; min-width:0; } .dashboardV349 .dash349Due__main strong{ overflow:hidden; width:100%; font-size:10.5px; text-overflow:ellipsis; white-space:nowrap; transition:color 150ms ease; } .dashboardV349 .dash349Due__amount{ color:var(--text); font-size:9.5px; font-weight:800; white-space:nowrap; } .dashboardV349 .dash349Link--footer{ width:100%; margin-top:8px; border-top:1px solid var(--dash349-line); border-radius:0; } .dashboardV349 .dash349Recent{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; border-top:1px solid var(--dash349-line); } .dashboardV349 .dash349Recent__column{ min-width:0; padding-top:10px; } .dashboardV349 .dash349Recent__column + .dash349Recent__column{ margin-inline-start:12px; padding-inline-start:12px; border-inline-start:1px solid var(--dash349-line); } .dashboardV349 .accDashListItem{ grid-template-columns:25px minmax(0,1fr) auto; gap:8px; padding:10px 0; } .dashboardV349 .accDashListItem__main strong{ font-size:10.5px; } .dashboardV349 .accDashListItem__main small, .dashboardV349 .accDashListItem__meta > strong{ font-size:9px; } .dashboardV349 .accDashBadge{ min-height:18px; font-size:8px; } .dashboardV349 .accDashEmpty{ min-height:76px; padding:14px; font-size:9.5px; } .dashboardV349 .dash349Rail{ display:grid; gap:12px; min-width:0; } .dashboardV349 .dash349Followup{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; } .dashboardV349 .dash349Followup button{ display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:48px; padding:9px 10px; border:1px solid var(--dash349-line); border-radius:11px; color:var(--text); background:transparent; font:inherit; cursor:pointer; transition:border-color 150ms ease,background-color 150ms ease; } .dashboardV349 .dash349Followup button:hover{ border-color:color-mix(in srgb,var(--accent) 32%,var(--dash349-line)); background:color-mix(in srgb,var(--accent) 5%,transparent); } .dashboardV349 .dash349Followup span{ color:var(--muted); font-size:9px; } .dashboardV349 .dash349Followup strong{ font-size:17px; } .dashboardV349 .eventList--pro{ max-height:265px; border-top:1px solid var(--dash349-line); } .dashboardV349 .eventItem{ padding:9px 0; } .dashboardV349 .eventItem__title{ font-size:10px; } .dashboardV349 .eventItem__msg, .dashboardV349 .eventItem__meta{ font-size:8.5px; } html[data-theme="light"] .dashboardV349, html.theme-light .dashboardV349, body.theme-light .dashboardV349{ --dash349-soft:#fff; } @media(max-width:1180px){ .dashboardV349 .dash349Header{ align-items:flex-start; flex-direction:column; } .dashboardV349 .dash349Header__side{ align-items:flex-start; width:100%; } .dashboardV349 .dash349Grid{ grid-template-columns:1fr; } .dashboardV349 .dash349Rail{ grid-template-columns:repeat(2,minmax(0,1fr)); } } @media(max-width:820px){ .dashboardV349 .dash349Stats{ grid-template-columns:repeat(2,minmax(0,1fr)); } .dashboardV349 .dash349Recent{ grid-template-columns:1fr; } .dashboardV349 .dash349Recent__column + .dash349Recent__column{ margin:10px 0 0; padding:10px 0 0; border-inline-start:0; border-top:1px solid var(--dash349-line); } .dashboardV349 .dash349Rail{ grid-template-columns:1fr; } } @media(max-width:560px){ .dashboardV349 .dash349Header h1{ font-size:24px; } .dashboardV349 .dash349Context{ display:grid; grid-template-columns:1fr; width:100%; } .dashboardV349 .dash349Context > span{ width:100%; max-width:none; } .dashboardV349 .dash349Context > span + span{ border-inline-start:0; border-top:1px solid var(--dash349-line); } .dashboardV349 .dash349Quick{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } .dashboardV349 .dash349Quick button{ width:100%; } .dashboardV349 .dash349Stats{ grid-template-columns:1fr; } .dashboardV349 .dash349Due{ grid-template-columns:74px minmax(0,1fr); } .dashboardV349 .dash349Due__amount{ grid-column:2; } } @keyframes finariaViewEnterV349{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:translateY(0); } } .main > .page:not([hidden]){ animation:none; } .finaria-view-enter{ transform-origin:top center; animation:finariaViewEnterV349 230ms cubic-bezier(.22,.75,.24,1) both !important; } @media(prefers-reduced-motion:reduce){ .finaria-view-enter{ animation:none !important; } } /* ---------------- v337: warehouse picker and quick-create visual unification ---------------- */ .warehouseSelectControl{ display:grid !important; grid-template-columns:minmax(0,1fr); align-items:center !important; width:100%; min-width:0; min-height:42px !important; height:42px !important; margin-top:0 !important; padding:4px !important; gap:4px !important; overflow:visible !important; border:1px solid var(--app-surface-border,var(--border)) !important; border-radius:var(--ui-control-radius,9px) !important; background:var(--app-field-surface,color-mix(in srgb,var(--card) 96%,transparent)) !important; box-shadow:none !important; } .warehouseSelectControl:has(> .warehouseSelectControl__lookup){ grid-template-columns:minmax(0,1fr) 32px !important; } .warehouseSelectControl > select, .warehouseSelectControl > .selectx{ width:100% !important; min-width:0 !important; min-height:32px !important; height:32px !important; margin:0 !important; border:0 !important; border-radius:7px !important; background:transparent !important; box-shadow:none !important; } .warehouseSelectControl > .selectx > .selectx-btn, .warehouseSelectControl > .selectx-btn{ width:100% !important; min-width:0 !important; min-height:32px !important; height:32px !important; padding:0 10px !important; border:0 !important; outline:0 !important; border-radius:7px !important; background:transparent !important; box-shadow:none !important; } .warehouseSelectControl > .selectx > .selectx-btn:focus, .warehouseSelectControl > .selectx > .selectx-btn:focus-visible, .warehouseSelectControl > .selectx-btn:focus, .warehouseSelectControl > .selectx-btn:focus-visible{ outline:0 !important; box-shadow:none !important; } .warehouseSelectControl:focus-within, .warehouseSelectControl:has(.selectx.open){ border-color:color-mix(in srgb,var(--accent) 56%,var(--app-surface-border,var(--border)) 44%) !important; box-shadow:none !important; } .warehouseSelectControl__lookup{ position:static !important; inset:auto !important; transform:none !important; width:32px !important; min-width:32px !important; max-width:32px !important; height:32px !important; min-height:32px !important; padding:0 !important; border:1px solid color-mix(in srgb,var(--accent) 42%,var(--border) 58%) !important; border-radius:8px !important; background:color-mix(in srgb,var(--accent) 15%,transparent) !important; color:color-mix(in srgb,var(--accent) 74%,#fff 26%) !important; box-shadow:none !important; } .warehouseSelectControl__lookup:hover{ border-color:color-mix(in srgb,var(--accent) 64%,var(--border) 36%) !important; background:color-mix(in srgb,var(--accent) 23%,transparent) !important; } .warehouseSelectControl .selectx-menu{ top:calc(100% + 8px); right:-5px; left:-5px; z-index:5000; max-height:280px; padding:6px; overflow:auto; border:1px solid var(--app-surface-border,var(--border)); border-radius:10px; background:var(--card); box-shadow:0 14px 34px rgba(2,8,23,.24); } .warehouseSelectControl .selectx-item{ min-height:36px; padding:8px 10px; border-radius:7px; display:flex; align-items:center; } .warehouseSelectControl .selectx-item:hover{ background:color-mix(in srgb,var(--accent) 10%,transparent); } .warehouseSelectControl .selectx-item.is-selected{ color:var(--text); background:color-mix(in srgb,var(--accent) 18%,transparent); } .warehouseSelectControl .selectx-searchWrap{ padding:6px; margin:-6px -6px 6px; border-color:var(--app-surface-border,var(--border)); border-radius:10px 10px 0 0; background:var(--card); } .warehouseSelectControl .selectx-search{ min-height:36px; height:36px; border-color:var(--app-surface-border,var(--border)); border-radius:8px; background:var(--app-field-surface); box-shadow:none; } .warehouseSelectControl .selectx-search:focus{ outline:0; border-color:color-mix(in srgb,var(--accent) 56%,var(--border) 44%); box-shadow:none; } #warehouseQuickModal .warehouseQuickModal__panel{ width:min(610px,calc(100vw - 28px)); overflow:hidden; border:1px solid var(--app-surface-border,var(--border)); border-radius:12px; background:var(--card); box-shadow:0 22px 60px rgba(2,8,23,.34); } #warehouseQuickModal .modal__header{ min-height:58px; padding:11px 16px; border-bottom:1px solid var(--app-surface-border,var(--border)); background:color-mix(in srgb,var(--card) 94%,var(--panel) 6%); } #warehouseQuickModal #warehouseQuickTitle{ font-size:16px; font-weight:900; } #warehouseQuickModal .modal__header .btn{ min-height:34px; height:34px; padding-inline:12px; border-radius:8px; } #warehouseQuickModal .warehouseQuickModal__body{ gap:14px; padding:16px; } #warehouseQuickModal .warehouseQuickGrid{ gap:12px 14px; align-items:end; } #warehouseQuickModal .field{ display:grid; gap:6px; min-width:0; margin:0; color:var(--muted); font-size:12px; line-height:1.7; } #warehouseQuickModal .field input{ width:100%; min-width:0; min-height:40px; height:40px; padding-inline:11px; border:1px solid var(--app-surface-border,var(--border)); border-radius:9px; background:var(--app-field-surface); box-shadow:none; } #warehouseQuickModal .field input:focus{ outline:0; border-color:color-mix(in srgb,var(--accent) 56%,var(--border) 44%); box-shadow:none; } #warehouseQuickModal .accountingCheck{ min-height:40px; margin:0; padding:8px 11px; border:1px solid var(--app-surface-border,var(--border)); border-radius:9px; background:var(--app-field-surface); } #warehouseQuickModal .formmsg{ margin:0; border-radius:9px; } #warehouseQuickModal .warehouseQuickActions{ padding-top:12px; border-top:1px solid var(--app-surface-border,var(--border)); } #warehouseQuickModal .warehouseQuickActions .btn{ min-height:40px; height:40px; padding-inline:16px; border-radius:9px; } @media(max-width:760px){ .warehouseSelectControl, .warehouseSelectControl:has(> .warehouseSelectControl__lookup){ grid-template-columns:minmax(0,1fr) 32px !important; } .warehouseSelectControl:not(:has(> .warehouseSelectControl__lookup)){ grid-template-columns:minmax(0,1fr) !important; } .warehouseSelectControl__lookup{ width:32px !important; } #warehouseQuickModal .warehouseQuickGrid{ grid-template-columns:1fr; } } /* ---------------- v338: accounting-first dashboard redesign ---------------- */ .accountingDashboard{ --acc-dash-line:var(--app-surface-border,var(--border)); --acc-dash-surface:color-mix(in srgb,var(--card) 97%,var(--panel) 3%); --acc-dash-soft:color-mix(in srgb,var(--panel) 58%,transparent); --acc-dash-radius:12px; display:grid; gap:14px; } .accDashHeader{ display:grid; grid-template-columns:minmax(0,1fr) minmax(420px,540px); gap:18px; min-width:0; padding:20px; overflow:hidden; border:1px solid var(--acc-dash-line); border-radius:var(--acc-dash-radius); background: linear-gradient(125deg,color-mix(in srgb,var(--accent) 8%,transparent),transparent 42%), var(--acc-dash-surface); box-shadow:none; } .accDashHeader__content{ min-width:0; } .accDashHeader__eyebrow{ display:inline-flex; align-items:center; gap:7px; margin-bottom:7px; color:var(--accent2,var(--accent)); font-size:12px; font-weight:900; } .accDashHeader__eyebrow svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; } .accDashHeader h1{ margin:0; font-size:clamp(24px,2.8vw,34px); line-height:1.4; letter-spacing:-.035em; } .accDashHeader__content > p{ max-width:720px; margin:6px 0 0; color:var(--muted); font-size:13px; line-height:1.9; } .accDashContext{ display:flex; flex-wrap:wrap; gap:7px; margin-top:15px; } .accDashContext__item{ display:flex; align-items:center; gap:7px; min-width:0; padding:6px 9px; border:1px solid var(--acc-dash-line); border-radius:8px; background:var(--acc-dash-soft); font-size:11.5px; } .accDashContext__item span{ color:var(--muted); white-space:nowrap; } .accDashContext__item strong{ max-width:180px; overflow:hidden; color:var(--text); font-size:12px; text-overflow:ellipsis; white-space:nowrap; } .accDashContext__item--company strong{ max-width:240px; } .accDashQuick{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; align-content:center; min-width:0; } .accDashQuick__item{ display:grid; grid-template-columns:34px minmax(0,1fr); align-items:center; gap:8px; min-width:0; min-height:58px; padding:8px; border:1px solid var(--acc-dash-line); border-radius:10px; background:var(--app-field-surface,var(--panel)); color:var(--text); text-align:right; cursor:pointer; transition:border-color .14s ease,background-color .14s ease,transform .14s ease; } .accDashQuick__item:hover{ transform:translateY(-1px); border-color:color-mix(in srgb,var(--accent) 45%,var(--acc-dash-line) 55%); background:color-mix(in srgb,var(--accent) 7%,var(--app-field-surface,var(--panel)) 93%); } .accDashQuick__item--primary{ grid-column:span 2; border-color:color-mix(in srgb,var(--accent) 44%,var(--acc-dash-line) 56%); background:color-mix(in srgb,var(--accent) 12%,var(--app-field-surface,var(--panel)) 88%); } .accDashQuick__icon{ display:grid; place-items:center; width:34px; height:34px; border-radius:8px; color:var(--accent2,var(--accent)); background:color-mix(in srgb,var(--accent) 14%,transparent); } .accDashQuick__icon svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; } .accDashQuick__item > span:last-child{ display:grid; min-width:0; } .accDashQuick__item strong{ overflow:hidden; font-size:12px; line-height:1.6; text-overflow:ellipsis; white-space:nowrap; } .accDashQuick__item small{ overflow:hidden; color:var(--muted); font-size:10.5px; line-height:1.5; text-overflow:ellipsis; white-space:nowrap; } .accountingDashboard .dashGuestWelcome{ margin:0; border-radius:var(--acc-dash-radius); box-shadow:none; } .accDashMetrics{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; } .accDashMetric{ display:grid; grid-template-columns:42px minmax(0,1fr); align-items:start; gap:11px; min-width:0; padding:14px; border:1px solid var(--acc-dash-line); border-radius:var(--acc-dash-radius); background:var(--acc-dash-surface); box-shadow:none; } .accDashMetric__icon{ display:grid; place-items:center; width:42px; height:42px; border-radius:10px; color:var(--accent2,var(--accent)); background:color-mix(in srgb,var(--accent) 13%,transparent); } .accDashMetric__icon svg{ width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; } .accDashMetric--cash .accDashMetric__icon{ color:#22c55e; background:rgba(34,197,94,.11); } .accDashMetric--tax .accDashMetric__icon{ color:#f59e0b; background:rgba(245,158,11,.11); } .accDashMetric--books .accDashMetric__icon{ color:#a78bfa; background:rgba(167,139,250,.11); } .accDashMetric__body{ display:grid; min-width:0; } .accDashMetric__body > span{ color:var(--muted); font-size:11.5px; font-weight:800; } .accDashMetric__body > strong{ margin-top:5px; overflow:hidden; font-size:clamp(19px,2vw,25px); font-weight:950; line-height:1.45; letter-spacing:-.035em; text-overflow:ellipsis; white-space:nowrap; } .accDashMetric__body > strong.is-negative{ color:var(--danger); } .accDashMetric__body > small{ min-height:18px; margin-top:3px; overflow:hidden; color:var(--muted2,var(--muted)); font-size:10.5px; line-height:1.6; text-overflow:ellipsis; white-space:nowrap; } .accDashMetric__body > small b{ color:var(--text); font-weight:900; } .accDashMetric__body > small.is-credit{ color:#22c55e; } .accDashPulse{ display:grid; grid-template-columns:auto repeat(5,minmax(0,1fr)); align-items:stretch; min-width:0; overflow:hidden; border:1px solid var(--acc-dash-line); border-radius:var(--acc-dash-radius); background:var(--acc-dash-surface); } .accDashPulse__label, .accDashPulse__item{ min-width:0; padding:10px 12px; } .accDashPulse__label{ display:flex; align-items:center; gap:7px; color:var(--text); font-size:11.5px; font-weight:900; white-space:nowrap; } .accDashPulse__dot{ width:7px; height:7px; border-radius:999px; background:#22c55e; box-shadow:0 0 0 4px rgba(34,197,94,.10); } .accDashPulse__item{ display:flex; align-items:center; justify-content:space-between; gap:8px; border-right:1px solid var(--acc-dash-line); } .accDashPulse__item span{ overflow:hidden; color:var(--muted); font-size:10.5px; text-overflow:ellipsis; white-space:nowrap; } .accDashPulse__item strong{ overflow:hidden; font-size:12px; font-weight:950; text-overflow:ellipsis; white-space:nowrap; } .accDashPulse__item--danger strong{ color:var(--danger); } .accDashGrid{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:12px; align-items:start; } .accDashPanel{ min-width:0; padding:15px; border:1px solid var(--acc-dash-line); border-radius:var(--acc-dash-radius); background:var(--acc-dash-surface); box-shadow:none; } .accDashPanel--trend{grid-column:span 8;} .accDashPanel--fiscal{grid-column:span 4;} .accDashPanel--cashflow{grid-column:span 4;} .accDashPanel--entries{grid-column:span 8;} .accDashPanel--purchases{grid-column:span 6;} .accDashPanel--top{grid-column:span 6;} .accDashPanel--events{grid-column:1/-1;} .accDashPanel__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; min-width:0; margin-bottom:12px; } .accDashPanel__head > div{ min-width:0; } .accDashPanel__kicker{ display:block; margin-bottom:2px; color:var(--accent2,var(--accent)); font-size:10.5px; font-weight:900; } .accDashPanel__head h2{ margin:0; font-size:16px; line-height:1.7; } .accDashPanel__head p{ margin:3px 0 0; color:var(--muted); font-size:10.5px; line-height:1.7; } .accDashPanel__link{ flex:0 0 auto; min-height:30px; padding:4px 9px; border:1px solid var(--acc-dash-line); border-radius:8px; background:transparent; color:var(--muted); font-family:inherit; font-size:10.5px; font-weight:800; cursor:pointer; } .accDashPanel__link:hover{ border-color:color-mix(in srgb,var(--accent) 45%,var(--acc-dash-line) 55%); color:var(--text); background:color-mix(in srgb,var(--accent) 7%,transparent); } .accDashPanel__action{ width:100%; min-height:38px; height:38px; margin-top:12px; border-radius:9px !important; } .accDashChart{ position:relative; min-height:250px; padding-top:4px; } .accDashChart canvas{ display:block; width:100%; height:250px; } .accDashFiscal{ display:grid; gap:10px; } .accDashFiscal__year{ display:grid; gap:3px; padding:12px; border:1px solid var(--acc-dash-line); border-radius:10px; background:var(--app-field-surface,var(--panel)); } .accDashFiscal__year span, .accDashFiscal__year small{ color:var(--muted); font-size:10.5px; line-height:1.6; } .accDashFiscal__year strong{ font-size:18px; line-height:1.6; } .accDashFiscal__year strong.is-closed{ color:var(--danger); } .accDashFiscal__stats{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; } .accDashFiscal__stats > div{ display:grid; gap:4px; min-width:0; padding:9px; border:1px solid var(--acc-dash-line); border-radius:9px; text-align:center; } .accDashFiscal__stats span{ overflow:hidden; color:var(--muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; } .accDashFiscal__stats strong{ font-size:16px; font-weight:950; } .accDashCashflow{ display:grid; gap:14px; } .accDashCashflow__row{ display:grid; gap:7px; } .accDashCashflow__row > div:first-child{ display:flex; align-items:center; justify-content:space-between; gap:10px; } .accDashCashflow__row span{ color:var(--muted); font-size:11px; } .accDashCashflow__row strong{ font-size:13px; font-weight:950; } .accDashCashflow__track{ height:7px; overflow:hidden; border-radius:999px; background:color-mix(in srgb,var(--muted) 12%,transparent); } .accDashCashflow__track i{ display:block; width:3%; height:100%; border-radius:inherit; background:#22c55e; transition:width .25s ease; } .accDashCashflow__row--payment .accDashCashflow__track i{ background:#f97316; } .accDashList{ display:grid; gap:7px; } .accDashListItem{ display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:9px; min-width:0; padding:9px; border:1px solid var(--acc-dash-line); border-radius:9px; background:color-mix(in srgb,var(--panel) 38%,transparent); } .accDashListItem__serial{ display:grid; place-items:center; width:34px; height:34px; overflow:hidden; border-radius:8px; background:color-mix(in srgb,var(--accent) 11%,transparent); color:var(--accent2,var(--accent)); font-size:10.5px; font-weight:950; text-overflow:ellipsis; white-space:nowrap; } .accDashListItem__main{ display:grid; min-width:0; gap:2px; } .accDashListItem__main strong, .accDashListItem__main small{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .accDashListItem__main strong{ font-size:11.5px; line-height:1.65; } .accDashListItem__main small{ color:var(--muted); font-size:10px; line-height:1.5; } .accDashListItem__meta{ display:grid; justify-items:end; gap:3px; min-width:90px; } .accDashListItem__meta > strong{ font-size:11px; white-space:nowrap; } .accDashBadge{ display:inline-flex; align-items:center; min-height:20px; padding:2px 6px; border-radius:6px; color:var(--muted); background:color-mix(in srgb,var(--muted) 10%,transparent); font-size:9.5px; font-weight:850; } .accDashBadge--posted{ color:#22c55e; background:rgba(34,197,94,.10); } .accDashBadge--draft{ color:#f59e0b; background:rgba(245,158,11,.10); } .accDashBadge--cancelled, .accDashBadge--reversed{ color:var(--danger); background:color-mix(in srgb,var(--danger) 10%,transparent); } .accDashTopItems{ display:grid; gap:7px; } .accountingDashboard .topItem{ display:grid; grid-template-columns:30px minmax(0,1fr) auto; align-items:center; gap:9px; min-width:0; padding:9px; border:1px solid var(--acc-dash-line); border-radius:9px; background:color-mix(in srgb,var(--panel) 38%,transparent); } .accountingDashboard .topItem__rank{ display:grid; place-items:center; width:30px; height:30px; border-radius:8px; color:var(--accent2,var(--accent)); background:color-mix(in srgb,var(--accent) 11%,transparent); font-size:11px; font-weight:950; } .accountingDashboard .topItem__main{ min-width:0; } .accountingDashboard .topItem__name, .accountingDashboard .topItem__meta{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .accountingDashboard .topItem__name{ font-size:11.5px; font-weight:900; line-height:1.6; } .accountingDashboard .topItem__meta{ margin-top:1px; color:var(--muted); font-size:9.5px; } .accountingDashboard .topItem__bar{ height:4px; margin-top:5px; overflow:hidden; border-radius:999px; background:color-mix(in srgb,var(--muted) 10%,transparent); } .accountingDashboard .topItem__bar i{ display:block; height:100%; border-radius:inherit; background:var(--accent); } .accountingDashboard .topItem__val{ font-size:10.5px; font-weight:950; white-space:nowrap; } .accDashEvents{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; max-height:330px; overflow:auto; } .accountingDashboard .eventItem{ min-width:0; padding:10px 11px; border:1px solid var(--acc-dash-line); border-right:3px solid var(--accent); border-radius:9px; background:color-mix(in srgb,var(--panel) 38%,transparent); box-shadow:none; } .accountingDashboard .eventItem--warn{ border-right-color:#f59e0b; } .accountingDashboard .eventItem--error{ border-right-color:var(--danger); } .accountingDashboard .eventItem__title{ overflow:hidden; font-size:11.5px; font-weight:900; line-height:1.6; text-overflow:ellipsis; white-space:nowrap; } .accountingDashboard .eventItem__msg{ display:-webkit-box; margin-top:2px; overflow:hidden; color:var(--muted); font-size:10px; line-height:1.65; -webkit-box-orient:vertical; -webkit-line-clamp:2; } .accountingDashboard .eventItem__meta{ margin-top:5px; color:var(--muted2,var(--muted)); font-size:9.5px; } .accDashEmpty{ grid-column:1/-1; min-height:62px; display:grid; place-items:center; padding:12px; border:1px dashed var(--acc-dash-line); border-radius:9px; color:var(--muted); background:color-mix(in srgb,var(--panel) 26%,transparent); font-size:11px; text-align:center; } html[data-theme="light"] .accountingDashboard, html.theme-light .accountingDashboard, body.theme-light .accountingDashboard{ --acc-dash-surface:#fff; --acc-dash-soft:#f7f9fc; } html[data-theme="light"] .accDashHeader, html.theme-light .accDashHeader, body.theme-light .accDashHeader{ background: linear-gradient(125deg,color-mix(in srgb,var(--accent) 6%,transparent),transparent 45%), #fff; } @media(max-width:1180px){ .accDashHeader{ grid-template-columns:1fr; } .accDashQuick{ grid-template-columns:repeat(5,minmax(0,1fr)); } .accDashQuick__item--primary{ grid-column:auto; } .accDashMetrics{ grid-template-columns:repeat(2,minmax(0,1fr)); } .accDashPulse{ grid-template-columns:repeat(3,minmax(0,1fr)); } .accDashPulse__label, .accDashPulse__item{ border-bottom:1px solid var(--acc-dash-line); } .accDashPanel--trend, .accDashPanel--entries{ grid-column:span 7; } .accDashPanel--fiscal, .accDashPanel--cashflow{ grid-column:span 5; } } @media(max-width:900px){ .accDashQuick{ grid-template-columns:repeat(2,minmax(0,1fr)); } .accDashQuick__item--primary{ grid-column:span 2; } .accDashPanel--trend, .accDashPanel--fiscal, .accDashPanel--cashflow, .accDashPanel--entries, .accDashPanel--purchases, .accDashPanel--top{ grid-column:1/-1; } } @media(max-width:640px){ .accountingDashboard{ gap:10px; } .accDashHeader{ padding:14px; gap:14px; } .accDashHeader h1{ font-size:23px; } .accDashContext{ display:grid; grid-template-columns:1fr 1fr; } .accDashContext__item{ display:grid; gap:2px; } .accDashContext__item strong{ max-width:100%; } .accDashQuick{ grid-template-columns:1fr 1fr; } .accDashMetrics{ grid-template-columns:1fr; } .accDashPulse{ grid-template-columns:1fr 1fr; } .accDashPulse__label{ grid-column:1/-1; } .accDashPulse__item{ border-right:0; } .accDashPanel{ padding:12px; } .accDashPanel__head{ align-items:center; } .accDashChart, .accDashChart canvas{ min-height:220px; height:220px; } .accDashListItem{ grid-template-columns:30px minmax(0,1fr); } .accDashListItem__serial{ width:30px; height:30px; } .accDashListItem__meta{ grid-column:2; grid-template-columns:1fr auto; align-items:center; justify-items:start; min-width:0; } .accDashEvents{ grid-template-columns:1fr; } .accountingDashboard .topItem{ grid-template-columns:28px minmax(0,1fr); } .accountingDashboard .topItem__val{ grid-column:2; } } /* ---------------- v344: header notification clearance + unified sidebar footer (visual only) ---------------- */ /* The notification bell owns a small desktop rail; page actions no longer sit underneath it. */ @media (min-width:981px){ body:has(.annBell:not([hidden])) .main > .uiUnifiedPage > :is( .inventoryPage__head, .treasuryHero, .accountingHero, .accountPage__head, .feedbackPage__head ) > :last-child{ margin-left:60px !important; } } .annBell{ top:16px; left:22px; width:44px; height:44px; border-radius:16px; border-color:var(--border); background:color-mix(in srgb,var(--card) 94%,var(--text) 6%); box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; transition:background-color .16s ease,border-color .16s ease,color .16s ease; } .annBell:hover{ background:color-mix(in srgb,var(--card) 88%,var(--accent) 12%); border-color:rgba(var(--accent-rgb),.34); } .annBell:focus-visible{ outline:0; box-shadow:0 0 0 3px rgba(var(--accent-rgb),.17); } .annBell__icon svg{width:19px;height:19px;} .wpAnn{top:68px;} /* One restrained surface language for the date, timer, theme and account controls. */ .sidebar__footer{ margin-top:8px; padding:10px 0 6px; border-top:1px solid var(--border); transform:none; } .sidebar__footer .footerControls__top{ gap:7px !important; } .sidebar__footer .clockTicker--ui, .sidebar__footer #btnThemeToggle, .sidebar__footer #sessionTimer.timerChip, .sidebar__footer #btnFooterPlanBuy, .sidebar__footer #btnLogout{ border:1px solid var(--border) !important; border-radius:16px !important; background:rgba(255,255,255,.025) !important; color:var(--text) !important; box-shadow:none !important; text-shadow:none !important; } .sidebar__footer .clockTicker--ui{ height:44px !important; min-height:44px !important; padding-inline:10px !important; } .sidebar__footer .clockTicker--ui .clockTicker__slide{ height:44px !important; min-height:44px !important; color:var(--muted) !important; font-weight:750 !important; } .sidebar__footer .clockTicker--ui .clockTicker__slide--time{ color:var(--text) !important; font-size:18px !important; font-weight:850 !important; } .sidebar__footer #btnThemeToggle, .sidebar__footer #sessionTimer, .sidebar__footer #btnFooterPlanBuy, .sidebar__footer #btnLogout{ height:42px !important; min-height:42px !important; } .sidebar__footer #btnThemeToggle, .sidebar__footer #sessionTimer{ font-size:12px; font-weight:750 !important; } .sidebar__footer #btnThemeToggle .btn__ico, .sidebar__footer #sessionTimer .btn__ico{ color:var(--muted) !important; } .sidebar__footer #btnFooterPlanBuy{ justify-content:center !important; font-weight:800 !important; } .sidebar__footer #btnThemeToggle:hover, .sidebar__footer #btnFooterPlanBuy:hover, .sidebar__footer #btnLogout:hover{ background:rgba(var(--accent-rgb),.08) !important; border-color:rgba(var(--accent-rgb),.34) !important; } .sidebar__footer :is(#btnThemeToggle,#btnFooterPlanBuy,#btnLogout):focus-visible{ outline:0; box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15) !important; } html[data-theme="light"] .sidebar__footer .clockTicker--ui, html[data-theme="light"] .sidebar__footer #btnThemeToggle, html[data-theme="light"] .sidebar__footer #sessionTimer.timerChip, html[data-theme="light"] .sidebar__footer #btnFooterPlanBuy, html[data-theme="light"] .sidebar__footer #btnLogout, body.theme-light .sidebar__footer .clockTicker--ui, body.theme-light .sidebar__footer #btnThemeToggle, body.theme-light .sidebar__footer #sessionTimer.timerChip, body.theme-light .sidebar__footer #btnFooterPlanBuy, body.theme-light .sidebar__footer #btnLogout{ background:rgba(15,23,42,.025) !important; border-color:rgba(15,23,42,.11) !important; color:var(--text) !important; } @media (max-width:980px){ .annBell{ top:auto; left:14px; } .sidebar__footer{ padding-bottom:8px; } } /* ---------------- v340: restore the original dashboard layout, unified and useful ---------------- */ .dashboardPro{ --dash-line:color-mix(in srgb,var(--line) 86%,transparent); --dash-soft:color-mix(in srgb,var(--card) 88%,var(--bg2)); --dash-softer:color-mix(in srgb,var(--card) 95%,transparent); } .dashboardPro .dashProHero{ min-height:auto; margin-bottom:14px; padding:18px; border:1px solid var(--dash-line); border-radius:12px; background: linear-gradient(115deg, color-mix(in srgb,var(--accent) 8%,var(--card)), var(--card) 58%); box-shadow:none; } .dashboardPro .dashProHero__bg{ display:none; } .dashboardPro .dashProHero__main{ width:100%; max-width:none; } .dashboardPro .dashProHero h1{ color:var(--text); font-size:26px; letter-spacing:-.025em; } .dashboardPro .dashHeroLead{ margin-top:5px; color:var(--muted); font-size:13px; line-height:1.8; } .dashboardPro .dashHeroIdentity{ display:grid; grid-template-columns:minmax(220px,1.4fr) repeat(2,minmax(150px,.7fr)); gap:8px; margin-top:14px; } .dashboardPro .dashHeroIdentity__item{ min-width:0; gap:3px; padding:10px 12px; border:1px solid var(--dash-line); border-radius:9px; background:color-mix(in srgb,var(--bg2) 58%,transparent); backdrop-filter:none; } .dashboardPro .dashHeroIdentity__item span{ color:var(--muted); font-size:10.5px; } .dashboardPro .dashHeroIdentity__item strong{ overflow:hidden; color:var(--text); font-size:13px; line-height:1.65; text-overflow:ellipsis; white-space:nowrap; } .dashboardPro .dashProStats{ gap:10px; margin-bottom:14px; } .dashboardPro .dashMetric{ min-height:104px; align-items:center; gap:10px; padding:13px; border:1px solid var(--dash-line); border-radius:12px; background:var(--dash-softer); box-shadow:none; } .dashboardPro .dashMetric__icon{ width:38px; height:38px; border-radius:9px; } .dashboardPro .dashMetric__icon svg{ width:19px; height:19px; } .dashboardPro .dashMetric--cash .dashMetric__icon{ color:#22a06b; border-color:color-mix(in srgb,#22a06b 22%,transparent); background:color-mix(in srgb,#22a06b 11%,transparent); } .dashboardPro .dashMetric--vat .dashMetric__icon{ color:#d89b2b; border-color:color-mix(in srgb,#d89b2b 23%,transparent); background:color-mix(in srgb,#d89b2b 11%,transparent); } .dashboardPro .dashMetric--books .dashMetric__icon{ color:#8b7cf6; border-color:color-mix(in srgb,#8b7cf6 24%,transparent); background:color-mix(in srgb,#8b7cf6 11%,transparent); } .dashboardPro .statBox__label{ font-size:11px; } .dashboardPro .statBox__value{ margin-top:3px; font-size:20px; line-height:1.45; } .dashboardPro .dashMetric__hint{ min-height:16px; margin-top:2px; color:var(--muted); font-size:10px; } .dashboardPro .dashMetric__hint b{ color:var(--text); } .dashboardPro .dashProLayout{ grid-template-columns:minmax(0,1.45fr) minmax(290px,.65fr); gap:12px; } .dashboardPro .dashPanel{ padding:14px; border:1px solid var(--dash-line); border-radius:12px; background:var(--dash-softer); box-shadow:none; } .dashboardPro .dashPanel__head{ margin-bottom:10px; } .dashboardPro .dashPanel__head h2{ font-size:15px; letter-spacing:0; } .dashboardPro .dashPanel__head p{ margin-top:3px; font-size:10.5px; } .dashboardPro .dashCanvasWrap{ min-height:255px; padding-top:0; } .dashboardPro .dashCanvasWrap canvas{ height:255px; } .dashboardPro .dashOpsTotal{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; padding:10px 11px; border:1px solid color-mix(in srgb,var(--accent) 20%,var(--dash-line)); border-radius:9px; background:color-mix(in srgb,var(--accent) 6%,transparent); } .dashboardPro .dashOpsTotal span{ color:var(--muted); font-size:10.5px; font-weight:800; } .dashboardPro .dashOpsTotal strong{ color:var(--text); font-size:14px; } .dashboardPro .dashQueueCards--four{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; } .dashboardPro .dashQueueCard{ min-height:58px; align-items:flex-start; flex-direction:column; gap:5px; padding:9px 10px; border:1px solid var(--dash-line); border-radius:9px; background:color-mix(in srgb,var(--bg2) 42%,transparent); } .dashboardPro .dashQueueCard span{ font-size:10px; } .dashboardPro .dashQueueCard strong{ font-size:18px; } .dashboardPro .dashQueueCard--warn{ border-color:color-mix(in srgb,var(--danger) 24%,var(--dash-line)); background:color-mix(in srgb,var(--danger) 6%,transparent); } .dashboardPro .dashQuick--stack{ gap:7px !important; margin-top:8px !important; } .dashboardPro .dashQuick--stack .btn{ min-height:34px; height:34px; border-radius:8px; font-size:10.5px; } .dashboardPro .dashRecentColumns{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; border-top:1px solid var(--dash-line); } .dashboardPro .dashRecentSection{ min-width:0; padding-top:10px; } .dashboardPro .dashRecentSection + .dashRecentSection{ margin-inline-start:12px; padding-inline-start:12px; border-inline-start:1px solid var(--dash-line); } .dashboardPro .dashRecentSection__head{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:4px; } .dashboardPro .dashRecentSection__head h3{ margin:0; font-size:11px; } .dashboardPro .dashTextLink{ min-height:28px; padding:3px 7px; border:0; border-radius:7px; color:var(--accent2); background:transparent; font:inherit; font-size:9.5px; font-weight:800; cursor:pointer; } .dashboardPro .dashTextLink:hover{ background:color-mix(in srgb,var(--accent) 8%,transparent); } .dashboardPro .accDashList{ border-top:0; } .dashboardPro .accDashListItem{ grid-template-columns:24px minmax(0,1fr) auto; gap:7px; padding:9px 0; border-bottom:1px solid var(--dash-line); } .dashboardPro .accDashListItem__main strong{ font-size:10.5px; } .dashboardPro .accDashListItem__main small{ font-size:9px; } .dashboardPro .accDashListItem__meta > strong{ font-size:9.5px; } .dashboardPro .accDashBadge{ min-height:17px; font-size:8.5px; } .dashboardPro .accDashEmpty{ min-height:64px; padding:12px; font-size:10px; } .dashboardPro .eventList--pro{ max-height:360px; gap:0; border-top:1px solid var(--dash-line); } .dashboardPro .eventItem{ padding:10px 0; border:0; border-bottom:1px solid var(--dash-line); border-radius:0; background:transparent; } .dashboardPro .eventItem:hover{ transform:none; border-color:var(--dash-line); background:transparent; } .dashboardPro .eventItem__title{ margin-bottom:2px; font-size:10.5px; } .dashboardPro .eventItem__msg{ font-size:9.5px; line-height:1.7; } .dashboardPro .eventItem__meta{ margin-top:4px; font-size:9px; } html[data-theme="light"] .dashboardPro .dashProHero, html.theme-light .dashboardPro .dashProHero, body.theme-light .dashboardPro .dashProHero, html[data-theme="light"] .dashboardPro .dashMetric, html.theme-light .dashboardPro .dashMetric, body.theme-light .dashboardPro .dashMetric, html[data-theme="light"] .dashboardPro .dashPanel, html.theme-light .dashboardPro .dashPanel, body.theme-light .dashboardPro .dashPanel{ box-shadow:none; } @media(max-width:1180px){ .dashboardPro .dashProLayout{ grid-template-columns:1fr; } .dashboardPro .dashPanel--chart, .dashboardPro .dashPanel--top, .dashboardPro .dashPanel--queue, .dashboardPro .dashPanel--events{ grid-column:auto; } } @media(max-width:760px){ .dashboardPro .dashProHero{ padding:14px; border-radius:11px; } .dashboardPro .dashHeroIdentity{ grid-template-columns:1fr; } .dashboardPro .dashProStats{ grid-template-columns:repeat(2,minmax(0,1fr)); } .dashboardPro .dashRecentColumns{ grid-template-columns:1fr; } .dashboardPro .dashRecentSection + .dashRecentSection{ margin:10px 0 0; padding:10px 0 0; border-inline-start:0; border-top:1px solid var(--dash-line); } } @media(max-width:520px){ .dashboardPro .dashProStats{ grid-template-columns:1fr; } .dashboardPro .dashQueueCards--four{ grid-template-columns:1fr; } .dashboardPro .dashPanel, .dashboardPro .dashMetric{ border-radius:10px; } } /* ---------------- v339: restrained, human accounting dashboard ---------------- */ .accountingDashboard{ --acc-dash-radius:10px; gap:18px; } .accDashHeader{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; padding:0 0 18px; overflow:visible; border:0; border-bottom:1px solid var(--acc-dash-line); border-radius:0; background:none !important; box-shadow:none !important; } .accDashHeader__eyebrow, .accDashQuick__icon, .accDashQuick__item small{ display:none; } .accDashHeader h1{ font-size:27px; line-height:1.5; letter-spacing:-.025em; } .accDashHeader__content > p{ margin-top:2px; font-size:12px; } .accDashContext{ gap:0; margin-top:8px; } .accDashContext__item{ gap:5px; min-height:22px; padding:0 0 0 12px; border:0; border-radius:0; background:none; font-size:10.5px; } .accDashContext__item + .accDashContext__item{ margin-right:12px; padding-right:12px; border-right:1px solid var(--acc-dash-line); } .accDashContext__item:nth-child(n+3){ display:none; } .accDashContext__item strong{ max-width:250px; font-size:11px; } .accDashQuick{ display:flex; align-items:center; justify-content:flex-end; gap:6px; min-width:0; } .accDashQuick__item, .accDashQuick__item--primary{ display:inline-flex; grid-column:auto; width:auto; min-width:0; min-height:36px; padding:0 11px; border:1px solid var(--acc-dash-line); border-radius:8px; background:transparent; text-align:center; transform:none !important; } .accDashQuick__item:hover{ border-color:color-mix(in srgb,var(--accent) 45%,var(--acc-dash-line) 55%); background:color-mix(in srgb,var(--accent) 5%,transparent); } .accDashQuick__item--primary{ border-color:var(--accent); background:var(--accent); color:#fff; } .accDashQuick__item--primary:hover{ border-color:color-mix(in srgb,var(--accent) 88%,#fff 12%); background:color-mix(in srgb,var(--accent) 88%,#fff 12%); } .accDashQuick__item > span:last-child{ display:block; } .accDashQuick__item strong{ overflow:visible; font-size:11px; line-height:1; } .accDashMetrics{ gap:0; overflow:hidden; border:1px solid var(--acc-dash-line); border-radius:var(--acc-dash-radius); background:transparent; } .accDashMetric{ display:block; min-height:112px; padding:17px 18px; border:0; border-radius:0; background:none; box-shadow:none; } .accDashMetric + .accDashMetric{ border-right:1px solid var(--acc-dash-line); } .accDashMetric--cash, .accDashMetric--sales, .accDashMetric--tax, .accDashMetric--books{ order:initial; } .accDashMetric__icon{ display:none; } .accDashMetric__body > span{ font-size:11px; font-weight:700; } .accDashMetric__body > strong{ margin-top:9px; font-size:25px; line-height:1.35; letter-spacing:-.02em; } .accDashMetric__body > small{ margin-top:5px; font-size:10px; } .accDashPulse{ display:none; } .accDashGrid{ gap:12px; } .accDashPanel{ padding:17px; border-radius:var(--acc-dash-radius); background:transparent; box-shadow:none !important; } .accDashPanel--trend{grid-column:span 8;} .accDashPanel--fiscal{grid-column:span 4;} .accDashPanel--cashflow{grid-column:span 4;} .accDashPanel--entries{grid-column:span 8;} .accDashPanel--purchases{grid-column:span 6;} .accDashPanel--events{grid-column:span 6;} .accDashPanel--top{ display:none !important; } .accDashPanel__kicker{ display:none; } .accDashPanel__head{ align-items:center; margin-bottom:14px; } .accDashPanel__head h2{ font-size:14px; font-weight:850; } .accDashPanel__head p{ font-size:10px; } .accDashPanel__link{ min-height:28px; padding:3px 8px; border:0; border-radius:6px; color:var(--muted); background:transparent; } .accDashPanel__link:hover{ border:0; background:var(--acc-dash-soft); } .accDashChart{ min-height:270px; padding:0; } .accDashChart canvas{ height:270px; } .accDashFiscal{ gap:0; } .accDashFiscal__year{ gap:2px; padding:0 0 14px; border:0; border-bottom:1px solid var(--acc-dash-line); border-radius:0; background:none; } .accDashFiscal__year strong{ font-size:20px; } .accDashFiscal__stats{ gap:0; margin-top:4px; } .accDashFiscal__stats > div{ padding:12px 5px 8px; border:0; border-radius:0; background:none; } .accDashFiscal__stats > div + div{ border-right:1px solid var(--acc-dash-line); } .accDashFiscal__stats strong{ font-size:15px; } .accDashPanel__action{ min-height:34px; height:34px; margin-top:10px; border-radius:7px !important; font-size:10.5px; } .accDashCashflow{ gap:18px; padding-top:2px; } .accDashCashflow__row span{ font-size:10.5px; } .accDashCashflow__row strong{ font-size:12px; } .accDashCashflow__track{ height:4px; background:color-mix(in srgb,var(--muted) 10%,transparent); } .accDashList{ gap:0; border-top:1px solid var(--acc-dash-line); } .accDashListItem{ grid-template-columns:28px minmax(0,1fr) auto; gap:9px; padding:10px 0; border:0; border-bottom:1px solid var(--acc-dash-line); border-radius:0; background:none; } .accDashListItem__serial{ display:block; width:auto; height:auto; overflow:visible; border-radius:0; color:var(--muted); background:none; font-size:10px; text-align:center; } .accDashListItem__main strong{ font-size:11px; } .accDashListItem__main small{ font-size:9.5px; } .accDashListItem__meta > strong{ font-size:10.5px; } .accDashBadge{ min-height:18px; padding:1px 5px; border-radius:5px; font-size:9px; } .accDashEmpty{ min-height:72px; border:0; border-radius:0; background:none; } .accDashEvents{ grid-template-columns:1fr; gap:0; max-height:285px; border-top:1px solid var(--acc-dash-line); } .accountingDashboard .eventItem{ padding:10px 0; border:0; border-bottom:1px solid var(--acc-dash-line); border-radius:0; background:none; } .accountingDashboard .eventItem--info, .accountingDashboard .eventItem--warn, .accountingDashboard .eventItem--error{ border-right:0; } .accountingDashboard .eventItem__title{ font-size:11px; } .accountingDashboard .eventItem__msg{ font-size:9.5px; } .accountingDashboard .eventItem__meta{ font-size:9px; } html[data-theme="light"] .accountingDashboard, html.theme-light .accountingDashboard, body.theme-light .accountingDashboard{ --acc-dash-surface:transparent; --acc-dash-soft:#f6f7f9; } @media(max-width:1180px){ .accDashHeader{ display:grid; align-items:start; } .accDashQuick{ justify-content:flex-start; flex-wrap:wrap; } .accDashPanel--trend, .accDashPanel--entries{ grid-column:span 8; } .accDashPanel--fiscal, .accDashPanel--cashflow{ grid-column:span 4; } .accDashPanel--purchases, .accDashPanel--events{ grid-column:span 6; } } @media(max-width:900px){ .accDashMetrics{ grid-template-columns:repeat(2,minmax(0,1fr)); } .accDashMetric:nth-child(3){ border-right:0; } .accDashMetric:nth-child(n+3){ border-top:1px solid var(--acc-dash-line); } .accDashPanel--trend, .accDashPanel--fiscal, .accDashPanel--cashflow, .accDashPanel--entries, .accDashPanel--purchases, .accDashPanel--events{ grid-column:1/-1; } } @media(max-width:640px){ .accountingDashboard{ gap:14px; } .accDashHeader{ padding:0 0 14px; } .accDashHeader h1{ font-size:22px; } .accDashContext{ display:flex; } .accDashContext__item{ display:flex; } .accDashQuick{ display:flex; gap:5px; } .accDashQuick__item, .accDashQuick__item--primary{ min-height:34px; padding-inline:9px; } .accDashQuick__item strong{ font-size:10px; } .accDashMetrics{ grid-template-columns:1fr; } .accDashMetric{ min-height:auto; padding:14px; border-right:0 !important; } .accDashMetric + .accDashMetric{ border-top:1px solid var(--acc-dash-line); } .accDashMetric__body{ grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:4px 12px; } .accDashMetric__body > strong{ grid-column:2; grid-row:1 / span 2; margin:0; font-size:18px; } .accDashMetric__body > small{ margin:0; } .accDashPanel{ padding:13px; } .accDashChart, .accDashChart canvas{ min-height:210px; height:210px; } } /* ---------------- v345: invoice width containment + aligned lookup/clear controls ---------------- */ /* Wide invoice tables scroll inside their own card and never enlarge the application canvas. */ .layout{ grid-template-columns:280px minmax(0,1fr); } .main, .main > .page, .page--send, .page--send .invSend, .page--send .invCard, .page--send .invHeadGrid, .page--send .invBottomGrid, .page--send .invHeadCol, .page--send .invBottomCol, .page--send .tableWrap--lines{ min-width:0; max-width:100%; } .page--send, .page--send .invSend{ width:100%; } .page--send .invCard--lines{ overflow:hidden; } .page--send .tableWrap--lines{ width:100%; overflow-x:auto; overflow-y:visible; overscroll-behavior-x:contain; scrollbar-gutter:stable; } .page--send .tableWrap--lines > .table--lines{ width:max-content; max-width:none; } /* Receipt, treasury and inventory-report party pickers use one exact geometry. */ .partyPickerControl:has(.partyPickerControl__pick--icon){ width:100%; min-width:0; min-height:42px !important; height:42px !important; margin-top:0; padding:4px; gap:4px; align-items:center; overflow:hidden; } .partyPickerControl:has(.partyPickerControl__pick--icon):has(.partyPickerControl__clear){ grid-template-columns:minmax(0,1fr) 34px 34px; } .partyPickerControl:has(.partyPickerControl__pick--icon):not(:has(.partyPickerControl__clear)){ grid-template-columns:minmax(0,1fr) 34px; } .partyPickerControl:has(.partyPickerControl__pick--icon) input[readonly]{ width:100%; min-width:0; min-height:32px !important; height:32px !important; margin:0 !important; padding-inline:10px !important; border:0 !important; background:transparent !important; box-shadow:none !important; } .partyPickerControl:has(.partyPickerControl__pick--icon) :is( .partyPickerControl__pick--icon, .partyPickerControl__clear ){ display:grid !important; place-items:center !important; align-self:center !important; width:34px !important; min-width:34px !important; max-width:34px !important; height:34px !important; min-height:34px !important; margin:0 !important; padding:0 !important; border-radius:9px !important; line-height:1 !important; box-shadow:none !important; } .partyPickerControl:has(.partyPickerControl__pick--icon) .partyPickerControl__clear{ grid-column:auto !important; font-size:17px; font-weight:900; } .partyPickerControl:has(.partyPickerControl__pick--icon) .partyPickerControl__pick--icon svg{ width:17px; height:17px; } @media (max-width:980px){ .layout{ grid-template-columns:minmax(0,1fr); } } @media (max-width:640px){ .page--send .invCard--lines{ padding-inline:10px !important; } } /* ---------------- v346: restrained page + sidebar module motion ---------------- */ /* Main views enter with a short, calm motion whenever navigation reveals them. */ @keyframes finariaPageEnter{ from{ opacity:0; transform:translateY(7px); } to{ opacity:1; transform:translateY(0); } } .main > .page:not([hidden]){ transform-origin:top center; animation:finariaPageEnter 220ms cubic-bezier(.22,.75,.24,1) both; } /* Animate only the painted panel. Closed modules keep their original display:none behavior, so the sidebar's spacing, height and scroll remain exactly as before. */ .navGroup__panel{ opacity:1; transform:translateY(0); transform-origin:top center; transition: opacity 170ms ease, transform 190ms cubic-bezier(.22,1,.36,1), display 190ms allow-discrete; transition-behavior:allow-discrete; } .navGroup__panel[hidden]{ opacity:0; transform:translateY(-4px); } .navGroup__chev{ transition: transform 220ms cubic-bezier(.22,1,.36,1), background-color 150ms ease, opacity 150ms ease; } @starting-style{ .navGroup__panel:not([hidden]){ opacity:0; transform:translateY(-4px); } } @media (prefers-reduced-motion:reduce){ .main > .page:not([hidden]){ animation:none !important; } .navGroup__panel, .navGroup__panel[hidden], .navGroup__chev{ transition:none !important; } } /* ---------------- v347: invoice clear icon + purchase containment + sidebar restoration ---------------- */ /* The buyer clear action is a compact × beside the existing search icon. */ .page--send .invHeadCol--buyer .buyerCodeControl{ grid-template-columns:minmax(0,1fr) 32px 32px !important; } .page--send .invHeadCol--buyer .buyerCodeControl__clear, .page--send .invHeadCol--buyer #btnBuyerClear{ display:grid !important; place-items:center !important; width:32px !important; min-width:32px !important; max-width:32px !important; height:30px !important; min-height:30px !important; margin:0 !important; padding:0 !important; border-radius:8px !important; font-size:18px !important; font-weight:900 !important; line-height:1 !important; box-shadow:none !important; } /* Purchase invoice content stays inside the main canvas at every zoom level. */ .page[data-page="purchases"], .page[data-page="purchases"] > [data-purchase-panel], #purchaseEditor, #purchaseEditor .inventoryFormGrid, #purchaseEditor .inventoryLines, #purchaseEditor .inventoryPurchaseSummary, #purchaseEditor .purchaseActionDock, #purchaseEditor .tablewrap{ width:100%; min-width:0; max-width:100%; } #purchaseEditor{ overflow:hidden; } #purchaseEditor .inventoryLines{ overflow:hidden; } #purchaseEditor .tablewrap{ overflow-x:auto; overflow-y:visible; overscroll-behavior-x:contain; scrollbar-gutter:stable; } #purchaseEditor .inventoryPurchaseLinesTable{ width:max-content; max-width:none; } @media(max-width:720px){ .page--send .invHeadCol--buyer .buyerCodeControl{ grid-template-columns:minmax(0,1fr) 32px 32px !important; } .page--send .invHeadCol--buyer .buyerCodeControl__clear, .page--send .invHeadCol--buyer #btnBuyerClear{ height:32px !important; min-height:32px !important; } } /* v349 final precedence: later legacy compatibility blocks must not undo the new UI. */ .sidebar__footer{ border-top:0 !important; padding-top:2px !important; } .main > .page:not([hidden]){ animation:none; } .finaria-view-enter{ transform-origin:top center; animation:finariaViewEnterV349 230ms cubic-bezier(.22,.75,.24,1) both !important; } .dashboardV349 .accDashListItem{ grid-template-columns:25px minmax(0,1fr) auto; gap:8px; padding:10px 0; } .dashboardV349 .accDashListItem__main strong{font-size:10.5px;} .dashboardV349 .accDashListItem__main small, .dashboardV349 .accDashListItem__meta > strong{font-size:9px;} .dashboardV349 .accDashBadge{min-height:18px;font-size:8px;} .dashboardV349 .eventList--pro{max-height:265px;border-top:1px solid var(--dash349-line);} .dashboardV349 .eventItem{padding:9px 0;} .dashboardV349 .eventItem__title{font-size:10px;} .dashboardV349 .eventItem__msg, .dashboardV349 .eventItem__meta{font-size:8.5px;} @media(prefers-reduced-motion:reduce){ .finaria-view-enter{animation:none !important;} } /* ---------------- v350: original dashboard composition with current accounting data ---------------- */ .dashboardV350{ --dash350-line:color-mix(in srgb,var(--border) 90%,transparent); --dash350-panel:color-mix(in srgb,var(--card) 94%,var(--bg2)); width:100%; min-width:0; max-width:100%; padding-bottom:28px; } .dashboardV350 .dash349Header{ position:relative; isolation:isolate; display:grid; gap:20px; min-height:250px; margin-bottom:18px; padding:34px 30px 26px; overflow:hidden; border:1px solid color-mix(in srgb,var(--accent) 24%,var(--dash350-line)); border-radius:28px; background: linear-gradient(112deg, color-mix(in srgb,#0b4a3d 50%,var(--card)) 0%, color-mix(in srgb,#0b1830 84%,var(--card)) 52%, color-mix(in srgb,#103e91 48%,var(--card)) 100%); box-shadow:none; } .dashboardV350 .dash349Header::after{ content:""; position:absolute; inset-block-end:-155px; inset-inline-end:-50px; z-index:-1; width:330px; height:330px; border:50px solid rgba(90,135,230,.08); border-radius:50%; } .dashboardV350 .dash349Header__title{ min-width:0; } .dashboardV350 .dash349Eyebrow, .dashboardV350 .dash349Today{ display:none; } .dashboardV350 .dash349Header h1{ margin:0; color:#f7f9ff; font-size:42px; line-height:1.45; letter-spacing:-.045em; } .dashboardV350 .dash349Header p{ margin:8px 0 0; color:rgba(231,237,249,.72); font-size:14px; font-weight:650; line-height:1.9; } .dashboardV350 .dash349Header__side{ display:block; width:100%; min-width:0; } .dashboardV350 .dash349Context{ display:grid; grid-template-columns:repeat(3,minmax(150px,1fr)); gap:12px; width:min(100%,720px); margin-inline-start:0; margin-inline-end:auto; border:0; background:transparent; } .dashboardV350 .dash349Context > span{ display:flex; align-items:flex-start; flex-direction:column; gap:5px; min-width:0; max-width:none; padding:15px 17px; border:1px solid rgba(231,237,249,.16) !important; border-radius:19px; background:rgba(255,255,255,.075); backdrop-filter:blur(4px); } .dashboardV350 .dash349Context small{ color:rgba(231,237,249,.64); font-size:10px; font-weight:750; } .dashboardV350 .dash349Context strong{ overflow:hidden; width:100%; color:#f8faff; font-size:14px; font-weight:850; line-height:1.7; text-overflow:ellipsis; white-space:nowrap; } .dashboardV350 .dashGuestWelcome{ margin-bottom:16px; border-radius:18px; box-shadow:none; } .dashboardV350 .dash349Quick{ display:none; } .dashboardV350 .dash349Stats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:18px; } .dashboardV350 .dash349Metric{ position:relative; min-width:0; min-height:150px; padding:20px 20px 16px; overflow:hidden; border:1px solid var(--dash350-line); border-radius:25px; background: linear-gradient(145deg, color-mix(in srgb,var(--card) 97%,transparent), color-mix(in srgb,var(--card) 88%,var(--bg2))); box-shadow:none; } .dashboardV350 .dash349Metric__mark{ position:absolute; inset-block-start:20px; inset-inline-end:20px; display:grid; place-items:center; width:50px; height:50px; border:1px solid color-mix(in srgb,#3478ff 32%,transparent); border-radius:16px; color:#3f7fff; background:color-mix(in srgb,#155ae8 17%,transparent); } .dashboardV350 .dash349Metric__mark svg{ width:23px; height:23px; stroke-linecap:round; stroke-linejoin:round; } .dashboardV350 .dash349Metric--cash .dash349Metric__mark{ color:#2bc781; border-color:color-mix(in srgb,#20bd78 30%,transparent); background:color-mix(in srgb,#20bd78 14%,transparent); } .dashboardV350 .dash349Metric--vat .dash349Metric__mark{ color:#23d474; border-color:color-mix(in srgb,#23c46d 30%,transparent); background:color-mix(in srgb,#23c46d 14%,transparent); } .dashboardV350 .dash349Metric--books .dash349Metric__mark{ color:#9e87ff; border-color:color-mix(in srgb,#8b73e8 30%,transparent); background:color-mix(in srgb,#8b73e8 15%,transparent); } .dashboardV350 .dash349Metric__top{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; min-height:46px; padding-inline-end:64px; } .dashboardV350 .dash349Metric__top span{ color:var(--text); font-size:12px; font-weight:850; } .dashboardV350 .dash349Metric__top small{ display:none; } .dashboardV350 .dash349Metric > strong{ display:block; margin-top:1px; color:var(--text); font-size:25px; line-height:1.55; text-align:center; } .dashboardV350 .dash349Metric > p{ margin:7px 0 0; overflow:hidden; color:var(--muted); font-size:10px; line-height:1.7; text-align:center; text-overflow:ellipsis; white-space:nowrap; } .dashboardV350 .dash349Grid{ display:grid; grid-template-columns:minmax(300px,.62fr) minmax(0,2fr); grid-template-areas: "rail chart" "due due"; gap:18px; align-items:stretch; direction:ltr; } .dashboardV350 .dash349Panel, .dashboardV350 .dash349Rail{ direction:rtl; } .dashboardV350 .dash349Panel{ min-width:0; padding:22px; border:1px solid var(--dash350-line); border-radius:27px; background: linear-gradient(150deg, color-mix(in srgb,var(--card) 97%,transparent), color-mix(in srgb,var(--card) 90%,var(--bg2))); box-shadow:none; } .dashboardV350 .dash349Panel--chart{ grid-area:chart; min-height:410px; } .dashboardV350 .dash349Panel--due{ grid-area:due; } .dashboardV350 .dash349Panel--recent, .dashboardV350 .dash349Panel--events{ display:none; } .dashboardV350 .dash349Rail{ grid-area:rail; min-width:0; } .dashboardV350 .dash349Panel--followup{ height:100%; } .dashboardV350 .dash349Panel__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:17px; } .dashboardV350 .dash349Panel__head h2{ margin:0; color:var(--text); font-size:20px; line-height:1.6; } .dashboardV350 .dash349Panel__head p{ margin:2px 0 0; color:var(--muted); font-size:11px; line-height:1.8; } .dashboardV350 .dash349Link{ min-height:34px; padding:6px 11px; border:1px solid color-mix(in srgb,var(--accent) 28%,var(--dash350-line)); border-radius:11px; color:var(--accent2); background:color-mix(in srgb,var(--accent) 5%,transparent); font:inherit; font-size:10px; font-weight:800; cursor:pointer; } .dashboardV350 .dash349Chart{ width:100%; min-height:325px; padding-top:8px; } .dashboardV350 .dash349Chart canvas{ display:block; width:100% !important; height:325px !important; } .dashboardV350 .dash349Followup{ display:grid; grid-template-columns:1fr; gap:11px; } .dashboardV350 .dash349Followup button{ display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:61px; padding:11px 15px; border:1px solid var(--dash350-line); border-radius:18px; color:var(--text); background:color-mix(in srgb,var(--bg2) 42%,transparent); font:inherit; cursor:pointer; } .dashboardV350 .dash349Followup button:hover{ border-color:color-mix(in srgb,var(--accent) 36%,var(--dash350-line)); background:color-mix(in srgb,var(--accent) 6%,transparent); } .dashboardV350 .dash349Followup span{ color:var(--muted); font-size:11px; font-weight:800; } .dashboardV350 .dash349Followup strong{ color:var(--text); font-size:22px; } .dashboardV350 .dash349Followup button:nth-child(2){ border-color:color-mix(in srgb,var(--danger) 32%,var(--dash350-line)); background:color-mix(in srgb,var(--danger) 8%,transparent); } .dashboardV350 .dash349Followup button:nth-child(2) strong{ color:var(--danger); } .dashboardV350 .dash349Count{ display:grid; place-items:center; min-width:38px; height:34px; padding-inline:9px; border:1px solid color-mix(in srgb,var(--accent) 30%,var(--dash350-line)); border-radius:11px; color:var(--accent2); background:color-mix(in srgb,var(--accent) 7%,transparent); font-size:11px; font-weight:900; } .dashboardV350 .dash349DueList{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; min-height:0; } .dashboardV350 .dash349Due{ display:grid; grid-template-columns:78px minmax(0,1fr); align-items:center; gap:10px; min-width:0; padding:13px; border:1px solid var(--dash350-line); border-radius:17px; color:var(--text); background:color-mix(in srgb,var(--bg2) 36%,transparent); font:inherit; text-align:start; cursor:pointer; } .dashboardV350 .dash349Due:hover{ border-color:color-mix(in srgb,var(--accent) 35%,var(--dash350-line)); } .dashboardV350 .dash349Due__date{ display:flex; align-items:flex-start; flex-direction:column; gap:2px; padding-inline-start:8px; border-inline-start:3px solid #5e8fe8; } .dashboardV350 .dash349Due__date--urgent{border-color:#d79a35;} .dashboardV350 .dash349Due__date--overdue{border-color:var(--danger);} .dashboardV350 .dash349Due__date b{ font-size:10px; } .dashboardV350 .dash349Due__date small, .dashboardV350 .dash349Due__main small{ color:var(--muted); font-size:9px; } .dashboardV350 .dash349Due__main{ display:flex; align-items:flex-start; flex-direction:column; min-width:0; } .dashboardV350 .dash349Due__main strong{ overflow:hidden; width:100%; font-size:11px; text-overflow:ellipsis; white-space:nowrap; } .dashboardV350 .dash349Due__amount{ grid-column:2; color:var(--text); font-size:10px; font-weight:850; } .dashboardV350 .dash349Link--footer{ display:block; width:max-content; margin:13px auto 0 0; } .dashboardV350 .accDashEmpty{ grid-column:1/-1; min-height:82px; border:1px dashed var(--dash350-line); border-radius:17px; } html[data-theme="light"] .dashboardV350, html.theme-light .dashboardV350, body.theme-light .dashboardV350{ --dash350-panel:#fff; } html[data-theme="light"] .dashboardV350 .dash349Metric, html[data-theme="light"] .dashboardV350 .dash349Panel, body.theme-light .dashboardV350 .dash349Metric, body.theme-light .dashboardV350 .dash349Panel{ background:#fff; } @media(max-width:1180px){ .dashboardV350 .dash349Stats{ grid-template-columns:repeat(2,minmax(0,1fr)); } .dashboardV350 .dash349Grid{ grid-template-columns:1fr; grid-template-areas: "chart" "rail" "due"; } .dashboardV350 .dash349Rail{ min-height:0; } .dashboardV350 .dash349Followup{ grid-template-columns:repeat(2,minmax(0,1fr)); } } @media(max-width:820px){ .dashboardV350 .dash349Header{ min-height:0; padding:24px 20px; border-radius:22px; } .dashboardV350 .dash349Header h1{ font-size:34px; } .dashboardV350 .dash349Context{ grid-template-columns:1fr; } .dashboardV350 .dash349DueList{ grid-template-columns:1fr; } } @media(max-width:560px){ .dashboardV350 .dash349Stats{ grid-template-columns:1fr; } .dashboardV350 .dash349Metric, .dashboardV350 .dash349Panel{ border-radius:20px; } .dashboardV350 .dash349Followup{ grid-template-columns:1fr; } .dashboardV350 .dash349Panel--chart{ min-height:350px; } .dashboardV350 .dash349Chart, .dashboardV350 .dash349Chart canvas{ min-height:270px; height:270px !important; } } /* ---------------- v351: minimal dashboard aligned with the shared design system ---------------- */ .dashboardV351 .dash349Header{ min-height:205px; gap:15px; margin-bottom:14px; padding:25px 24px 20px; border-color:color-mix(in srgb,var(--accent) 20%,var(--border)); border-radius:20px; background: linear-gradient(118deg, color-mix(in srgb,var(--card) 92%,#172742), color-mix(in srgb,var(--card) 84%,#123366)); } .dashboardV351 .dash349Header::after{ display:none; } .dashboardV351 .dash349Header h1{ font-size:34px; letter-spacing:-.035em; } .dashboardV351 .dash349Header p{ margin-top:4px; font-size:12px; font-weight:600; } .dashboardV351 .dash349Context{ gap:8px; width:min(100%,660px); } .dashboardV351 .dash349Context > span{ gap:3px; padding:10px 12px; border-color:rgba(220,230,248,.13) !important; border-radius:13px; background:rgba(255,255,255,.04); backdrop-filter:none; } .dashboardV351 .dash349Context small{ font-size:9px; } .dashboardV351 .dash349Context strong{ font-size:12px; font-weight:800; } .dashboardV351 .dash349Stats{ gap:10px; margin-bottom:14px; } .dashboardV351 .dash349Metric{ min-height:124px; padding:15px 16px 13px; border-radius:17px; background:var(--card); } .dashboardV351 .dash349Metric__mark, .dashboardV351 .dash349Metric--cash .dash349Metric__mark, .dashboardV351 .dash349Metric--vat .dash349Metric__mark, .dashboardV351 .dash349Metric--books .dash349Metric__mark{ inset-block-start:15px; inset-inline-end:16px; width:41px; height:41px; border-color:color-mix(in srgb,var(--accent) 30%,transparent); border-radius:12px; color:var(--accent); background:color-mix(in srgb,var(--accent) 11%,transparent); } .dashboardV351 .dash349Metric__mark svg{ width:19px; height:19px; } .dashboardV351 .dash349Metric__top{ min-height:36px; padding-inline-end:52px; } .dashboardV351 .dash349Metric__top span{ font-size:11px; } .dashboardV351 .dash349Metric > strong{ font-size:22px; } .dashboardV351 .dash349Metric > p{ margin-top:3px; font-size:9px; } .dashboardV351 .dash349Grid{ gap:12px; } .dashboardV351 .dash349Panel{ padding:17px; border-radius:18px; background:var(--card); } .dashboardV351 .dash349Panel--chart{ min-height:375px; } .dashboardV351 .dash349Panel__head{ margin-bottom:12px; } .dashboardV351 .dash349Panel__head h2{ font-size:17px; } .dashboardV351 .dash349Panel__head p{ font-size:10px; } .dashboardV351 .dash349Link{ min-height:32px; padding:5px 9px; border-color:var(--border); border-radius:10px; color:var(--accent); background:transparent; } .dashboardV351 .dash349Link:hover{ border-color:color-mix(in srgb,var(--accent) 38%,var(--border)); background:color-mix(in srgb,var(--accent) 6%,transparent); } .dashboardV351 .dash349Chart{ min-height:298px; } .dashboardV351 .dash349Chart canvas{ height:298px !important; } .dashboardV351 .dash349Followup{ gap:8px; } .dashboardV351 .dash349Followup button{ min-height:51px; padding:9px 12px; border-color:var(--border); border-radius:13px; background:transparent; } .dashboardV351 .dash349Followup button:hover{ border-color:color-mix(in srgb,var(--accent) 34%,var(--border)); background:color-mix(in srgb,var(--accent) 5%,transparent); } .dashboardV351 .dash349Followup span{ font-size:10px; } .dashboardV351 .dash349Followup strong{ font-size:19px; } .dashboardV351 .dash349Followup button:nth-child(2){ border-color:color-mix(in srgb,var(--danger) 24%,var(--border)); background:color-mix(in srgb,var(--danger) 5%,transparent); } .dashboardV351 .dash349Count{ height:31px; border-color:var(--border); border-radius:10px; color:var(--accent); background:transparent; } .dashboardV351 .dash349DueList{ gap:8px; } .dashboardV351 .dash349Due{ padding:11px; border-color:var(--border); border-radius:13px; background:transparent; } .dashboardV351 .dash349Due:hover{ border-color:color-mix(in srgb,var(--accent) 34%,var(--border)); background:color-mix(in srgb,var(--accent) 4%,transparent); } .dashboardV351 .dash349Due__date{ border-color:var(--accent); } .dashboardV351 .dash349Due__date--urgent{ border-color:color-mix(in srgb,var(--accent) 65%,var(--muted)); } .dashboardV351 .dash349Due__date--overdue{ border-color:var(--danger); } html[data-theme="light"] .dashboardV351 .dash349Header, html.theme-light .dashboardV351 .dash349Header, body.theme-light .dashboardV351 .dash349Header{ background: linear-gradient(118deg, color-mix(in srgb,#fff 93%,#dce8fb), color-mix(in srgb,#fff 86%,#c9dcfa)); } html[data-theme="light"] .dashboardV351 .dash349Header h1, html.theme-light .dashboardV351 .dash349Header h1, body.theme-light .dashboardV351 .dash349Header h1, html[data-theme="light"] .dashboardV351 .dash349Context strong, html.theme-light .dashboardV351 .dash349Context strong, body.theme-light .dashboardV351 .dash349Context strong{ color:var(--text); } html[data-theme="light"] .dashboardV351 .dash349Header p, html.theme-light .dashboardV351 .dash349Header p, body.theme-light .dashboardV351 .dash349Header p, html[data-theme="light"] .dashboardV351 .dash349Context small, html.theme-light .dashboardV351 .dash349Context small, body.theme-light .dashboardV351 .dash349Context small{ color:var(--muted); } html[data-theme="light"] .dashboardV351 .dash349Context > span, html.theme-light .dashboardV351 .dash349Context > span, body.theme-light .dashboardV351 .dash349Context > span{ border-color:rgba(15,23,42,.11) !important; background:rgba(255,255,255,.48); } @media(max-width:820px){ .dashboardV351 .dash349Header{ padding:20px 17px; border-radius:17px; } .dashboardV351 .dash349Header h1{ font-size:29px; } } @media(max-width:560px){ .dashboardV351 .dash349Metric, .dashboardV351 .dash349Panel{ border-radius:15px; } .dashboardV351 .dash349Panel--chart{ min-height:335px; } .dashboardV351 .dash349Chart, .dashboardV351 .dash349Chart canvas{ min-height:255px; height:255px !important; } } /* ---------------- v352: compact patterned hero + colorful metric icons ---------------- */ .dashboardV352 .dash349Header{ display:grid; grid-template-columns:minmax(520px,1.55fr) minmax(280px,.7fr); grid-template-areas:"context title"; align-items:center; gap:24px; width:min(calc(100% - 32px),1240px); min-height:0; margin:0 auto 14px; padding:18px 20px; overflow:hidden; border-radius:18px; direction:ltr; background: linear-gradient(120deg, color-mix(in srgb,var(--card) 94%,#172844), color-mix(in srgb,var(--card) 87%,#123565)); } .dashboardV352 .dash349Header::after{ display:block; inset:0; z-index:0; width:auto; height:auto; border:0; border-radius:inherit; background-image: linear-gradient(rgba(112,157,235,.12) 1px,transparent 1px), linear-gradient(90deg,rgba(112,157,235,.12) 1px,transparent 1px); background-size:32px 32px; opacity:.42; -webkit-mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.72) 48%,transparent 82%); mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.72) 48%,transparent 82%); pointer-events:none; } .dashboardV352 .dash349Header > *{ position:relative; z-index:1; direction:rtl; } .dashboardV352 .dash349Header__title{ grid-area:title; } .dashboardV352 .dash349Header__side{ grid-area:context; } .dashboardV352 .dash349Header h1{ font-size:30px; line-height:1.45; } .dashboardV352 .dash349Header p{ max-width:330px; margin-top:2px; font-size:10.5px; line-height:1.8; } .dashboardV352 .dash349Context{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; width:100%; max-width:none; } .dashboardV352 .dash349Context > span{ padding:9px 11px; border-radius:11px; background:rgba(255,255,255,.035); } .dashboardV352 .dash349Context small{ font-size:8.5px; } .dashboardV352 .dash349Context strong{ font-size:11px; } .dashboardV352 .dash349Metric--sales .dash349Metric__mark{ color:#4f8cff; border-color:rgba(79,140,255,.34); background:rgba(79,140,255,.12); } .dashboardV352 .dash349Metric--cash .dash349Metric__mark{ color:#28a6d9; border-color:rgba(40,166,217,.34); background:rgba(40,166,217,.12); } .dashboardV352 .dash349Metric--vat .dash349Metric__mark{ color:#d99a36; border-color:rgba(217,154,54,.34); background:rgba(217,154,54,.12); } .dashboardV352 .dash349Metric--books .dash349Metric__mark{ color:#8e7ae8; border-color:rgba(142,122,232,.34); background:rgba(142,122,232,.12); } html[data-theme="light"] .dashboardV352 .dash349Header, html.theme-light .dashboardV352 .dash349Header, body.theme-light .dashboardV352 .dash349Header{ background: linear-gradient(120deg, color-mix(in srgb,#fff 95%,#e1eafa), color-mix(in srgb,#fff 88%,#cbdcf7)); } html[data-theme="light"] .dashboardV352 .dash349Header::after, html.theme-light .dashboardV352 .dash349Header::after, body.theme-light .dashboardV352 .dash349Header::after{ background-image: linear-gradient(rgba(55,105,190,.11) 1px,transparent 1px), linear-gradient(90deg,rgba(55,105,190,.11) 1px,transparent 1px); } @media(max-width:1100px){ .dashboardV352 .dash349Header{ grid-template-columns:1fr; grid-template-areas: "title" "context"; gap:13px; width:min(calc(100% - 20px),820px); } .dashboardV352 .dash349Header p{ max-width:none; } } @media(max-width:620px){ .dashboardV352 .dash349Header{ width:100%; padding:16px; } .dashboardV352 .dash349Header h1{ font-size:27px; } .dashboardV352 .dash349Context{ grid-template-columns:1fr; } } /* ---------------- v353: full-width designed hero + compact best sellers ---------------- */ .dashboardV353 .dash349Header{ grid-template-columns:minmax(470px,1.35fr) minmax(300px,.72fr); grid-template-areas:"context title"; gap:28px; width:100%; max-width:none; min-height:148px; margin:0 0 14px; padding:20px 24px; border-color:color-mix(in srgb,var(--accent) 28%,var(--border)); background: radial-gradient(circle at 92% 18%,rgba(63,127,255,.16),transparent 24%), radial-gradient(circle at 72% 120%,rgba(84,118,186,.10),transparent 34%), linear-gradient(118deg, color-mix(in srgb,var(--card) 95%,#172844), color-mix(in srgb,var(--card) 87%,#123565)); } .dashboardV353 .dash349Header::before{ content:""; position:absolute; inset-block-start:-215px; inset-inline-end:-112px; z-index:0; width:430px; height:430px; border:1px solid rgba(114,160,241,.17); border-radius:50%; box-shadow: 0 0 0 34px rgba(79,140,255,.035), 0 0 0 68px rgba(79,140,255,.025); pointer-events:none; } .dashboardV353 .dash349Header::after{ background-image: linear-gradient(rgba(112,157,235,.10) 1px,transparent 1px), linear-gradient(90deg,rgba(112,157,235,.10) 1px,transparent 1px); background-size:30px 30px; opacity:.56; -webkit-mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.78) 53%,transparent 88%); mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.78) 53%,transparent 88%); } .dashboardV353 .dash349Header__title{ position:relative; padding-block:4px; } .dashboardV353 .dash349Header__title::before{ content:""; display:block; width:44px; height:3px; margin:0 0 8px auto; border-radius:999px; background:linear-gradient(90deg,rgba(79,140,255,.22),#4f8cff); } .dashboardV353 .dash349Header h1{ font-size:31px; } .dashboardV353 .dash349Header p{ max-width:none; margin-top:1px; font-size:11px; color:rgba(231,237,249,.76); } .dashboardV353 .dash349Context{ gap:9px; } .dashboardV353 .dash349Context > span{ position:relative; overflow:hidden; padding:11px 13px; border-color:rgba(220,230,248,.15) !important; border-radius:13px; background: linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.025)); } .dashboardV353 .dash349Context > span::before{ content:""; position:absolute; inset:0 0 auto; height:1px; background:linear-gradient(90deg,transparent,rgba(112,157,235,.42),transparent); } .dashboardV353 .dash349Context small{ font-size:9px; } .dashboardV353 .dash349Context strong{ font-size:12px; } .dashboardV353 .dash349Grid{ grid-template-columns:minmax(300px,.62fr) minmax(0,2fr); grid-template-areas: "rail chart" "top due"; } .dashboardV353 .dash349Panel--topItems{ grid-area:top; direction:rtl; } .dashboardV353 .dash353TopItems{ display:grid; gap:8px; } .dashboardV353 .dash353TopItems .topItem{ display:grid; grid-template-columns:29px minmax(0,1fr); gap:7px 9px; min-width:0; padding:9px 10px; border:1px solid var(--border); border-radius:12px; background:transparent; } .dashboardV353 .dash353TopItems .topItem__rank{ display:grid; grid-row:1 / span 2; place-items:center; align-self:center; width:29px; height:29px; border:1px solid color-mix(in srgb,var(--accent) 25%,var(--border)); border-radius:9px; color:var(--accent); background:color-mix(in srgb,var(--accent) 7%,transparent); font-size:10px; font-weight:900; } .dashboardV353 .dash353TopItems .topItem__main{ min-width:0; } .dashboardV353 .dash353TopItems .topItem__name, .dashboardV353 .dash353TopItems .topItem__meta{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .dashboardV353 .dash353TopItems .topItem__name{ font-size:11px; font-weight:850; } .dashboardV353 .dash353TopItems .topItem__meta{ margin-top:0; font-size:9px; } .dashboardV353 .dash353TopItems .topItem__bar{ height:3px; margin-top:5px; overflow:hidden; border-radius:999px; background:color-mix(in srgb,var(--muted) 11%,transparent); } .dashboardV353 .dash353TopItems .topItem__bar i{ display:block; height:100%; border-radius:inherit; background:var(--accent); } .dashboardV353 .dash353TopItems .topItem__val{ grid-column:2; overflow:hidden; color:var(--muted); font-size:9px; font-weight:800; text-align:left; text-overflow:ellipsis; white-space:nowrap; } html[data-theme="light"] .dashboardV353 .dash349Header, html.theme-light .dashboardV353 .dash349Header, body.theme-light .dashboardV353 .dash349Header{ background: radial-gradient(circle at 92% 18%,rgba(63,127,255,.13),transparent 24%), radial-gradient(circle at 72% 120%,rgba(84,118,186,.08),transparent 34%), linear-gradient(118deg, color-mix(in srgb,#fff 96%,#e1eafa), color-mix(in srgb,#fff 88%,#cbdcf7)); } html[data-theme="light"] .dashboardV353 .dash349Header::before, html.theme-light .dashboardV353 .dash349Header::before, body.theme-light .dashboardV353 .dash349Header::before{ border-color:rgba(55,105,190,.13); box-shadow: 0 0 0 34px rgba(55,105,190,.025), 0 0 0 68px rgba(55,105,190,.018); } @media(max-width:1180px){ .dashboardV353 .dash349Grid{ grid-template-columns:1fr; grid-template-areas: "chart" "rail" "due" "top"; } } @media(max-width:1100px){ .dashboardV353 .dash349Header{ grid-template-columns:1fr; grid-template-areas: "title" "context"; gap:13px; width:100%; max-width:none; } } @media(max-width:620px){ .dashboardV353 .dash349Header{ width:100%; min-height:0; padding:17px 16px; } } /* ---------------- v354: shared ghost buttons + clearer dark hero pattern ---------------- */ .dashboardV354 .dash349Header__title::before{ display:none; } .dashboardV354 .dash349Link{ min-height:var(--ui-control-height,44px); height:var(--ui-control-height,44px); padding:10px 12px; border:1px solid rgba(var(--accent-rgb),.28); border-radius:16px; color:var(--accent); background:rgba(255,255,255,.04); box-shadow:none; font-size:inherit; } .dashboardV354 .dash349Link:hover{ border-color:rgba(var(--accent-rgb),.36); background:rgba(var(--accent-rgb),.08); } html[data-theme="dark"] .dashboardV354 .dash349Link, html.theme-dark .dashboardV354 .dash349Link, body.theme-dark .dashboardV354 .dash349Link{ border-color:rgba(var(--accent-rgb),.26); color:#9cc0ff; background:rgba(255,255,255,.03); } html[data-theme="dark"] .dashboardV354 .dash349Link:hover, html.theme-dark .dashboardV354 .dash349Link:hover, body.theme-dark .dashboardV354 .dash349Link:hover{ background:rgba(var(--accent-rgb),.10); } html[data-theme="light"] .dashboardV354 .dash349Link, html.theme-light .dashboardV354 .dash349Link, body.theme-light .dashboardV354 .dash349Link{ border-color:rgba(37,99,235,.24); color:#1e3a8a; background:linear-gradient(180deg,#fff,#f8fbff); box-shadow:0 8px 18px rgba(15,23,42,.06),inset 0 1px 0 rgba(255,255,255,.9); } html[data-theme="light"] .dashboardV354 .dash349Link:hover, html.theme-light .dashboardV354 .dash349Link:hover, body.theme-light .dashboardV354 .dash349Link:hover{ border-color:rgba(37,99,235,.42); color:#0b5cff; background:linear-gradient(180deg,#fff,#eef6ff); } html[data-theme="dark"] .dashboardV354 .dash349Header::after, html.theme-dark .dashboardV354 .dash349Header::after, body.theme-dark .dashboardV354 .dash349Header::after{ background-image: linear-gradient(rgba(139,180,250,.18) 1px,transparent 1px), linear-gradient(90deg,rgba(139,180,250,.18) 1px,transparent 1px); opacity:.78; } html[data-theme="dark"] .dashboardV354 .dash349Header::before, html.theme-dark .dashboardV354 .dash349Header::before, body.theme-dark .dashboardV354 .dash349Header::before{ border-color:rgba(139,180,250,.32); box-shadow: 0 0 0 34px rgba(79,140,255,.075), 0 0 0 68px rgba(79,140,255,.048); } /* ---------------- v355: compact dashboard navigation links ---------------- */ .dashboardV355 #dashGoInvoices, .dashboardV355 #dashGoTreasury{ min-height:36px; height:36px; padding:6px 10px; border-radius:12px; font-size:12px; } /* ---------------- v359: inventory policy inside performance settings ---------------- */ .performanceSettingsSectionTitle{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; padding:18px 2px 8px; border-bottom:1px solid var(--border); } .performanceSettingsSectionTitle strong{ font-size:13px; } .performanceSettingsSectionTitle small{ color:var(--muted); font-size:11px; } #inventoryStockPolicyStatus{ min-height:22px; margin-top:12px; } @media(max-width:560px){ .performanceSettingsSectionTitle{ align-items:flex-start; flex-direction:column; gap:3px; } } /* ---------------- v357: stable populated settings + subtle modal scroller ---------------- */ .settingsPage #companies{ min-width:0; max-width:100%; } .settingsPage #companies .companyCards{ display:grid; grid-template-columns:1fr; gap:12px; } .settingsPage #companies .companyCard{ min-width:0; padding:14px; border-radius:18px; } .settingsPage #companies .companyCard__head{ flex-direction:row; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; } .settingsPage #companies .companyCard__name{ min-width:0; font-size:15px; overflow-wrap:anywhere; } .settingsPage #companies .companyCard__badges{ flex:0 0 auto; } .settingsPage #companies .companyCard__meta .kv{ grid-template-columns:minmax(92px,120px) minmax(0,1fr); gap:8px 12px; } .settingsPage #companies .companyCard__meta .kv > span{ min-width:0; overflow-wrap:anywhere; } .settingsPage #companies .companyCard__url{ direction:ltr; text-align:left; unicode-bidi:plaintext; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .settingsPage #companies .companyCard__actions{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:14px; } .settingsPage #companies .companyCard__actions .btn{ width:100%; min-width:0; min-height:38px; padding-inline:10px; border-radius:13px; white-space:nowrap; } .settingsPage #companies [data-cact="del"]{ color:#ff8f96 !important; border-color:rgba(var(--danger-rgb),.38) !important; background:rgba(var(--danger-rgb),.07) !important; box-shadow:none !important; } .settingsPage #companies [data-cact="del"]:hover{ background:rgba(var(--danger-rgb),.13) !important; } .settingsPage #companies .companyTable{ table-layout:fixed; } .settingsPage #companies .companyTable__name{ overflow-wrap:anywhere; } .settingsPage #companies .companyTable__client, .settingsPage #companies .companyTable__url{ direction:ltr; text-align:left; unicode-bidi:plaintext; } .settingsPage #companies .companyTable__url{ max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .settingsPage #c_baseUrl{ direction:ltr; text-align:left; unicode-bidi:plaintext; } #msgModal .modal__panel{ overflow:hidden; } #msgModal .modal__body{ max-height:calc(100vh - 110px); overflow:auto; scrollbar-width:thin; scrollbar-color:rgba(var(--accent-rgb),.42) transparent; } #msgModal #msgText{ overflow-wrap:anywhere; } #msgModal .modal__body::-webkit-scrollbar{ width:6px; height:6px; } #msgModal .modal__body::-webkit-scrollbar-track{ background:transparent; } #msgModal .modal__body::-webkit-scrollbar-thumb{ border-radius:999px; background:rgba(var(--accent-rgb),.38); } #msgModal .modal__body::-webkit-scrollbar-thumb:hover{ background:rgba(var(--accent-rgb),.58); } @media(max-width:760px){ .settingsPage #companies .companyCard__head{ align-items:flex-start; } .settingsPage #companies .companyCard__actions{ grid-template-columns:repeat(2,minmax(0,1fr)); } } @media(max-width:480px){ .settingsPage #companies .companyCard__head{ flex-direction:column; } .settingsPage #companies .companyCard__meta .kv{ grid-template-columns:1fr; gap:4px; } .settingsPage #companies .companyCard__meta .kv b:not(:first-child){ margin-top:7px; } } /* ---------------- v360: mobile bottom navigation unified with current UI ---------------- */ @media(max-width:980px){ .main{ padding-bottom:calc(100px + env(safe-area-inset-bottom, 0px)) !important; } .mobileBottomNav{ left:calc(env(safe-area-inset-left, 0px) + 12px); right:calc(env(safe-area-inset-right, 0px) + 12px); bottom:calc(env(safe-area-inset-bottom, 0px) + 10px); grid-template-columns:repeat(5,minmax(0,1fr)); align-items:center; gap:4px; min-height:68px; padding:7px 8px; overflow:visible; border:1px solid rgba(148,163,184,.20); border-radius:19px; background:rgba(12,22,40,.97); box-shadow:0 10px 28px rgba(2,6,23,.24); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); transition:opacity .18s ease,transform .18s ease; } html[data-theme="light"] .mobileBottomNav, html.theme-light .mobileBottomNav, body.theme-light .mobileBottomNav{ border-color:rgba(15,23,42,.11); background:rgba(255,255,255,.97); box-shadow:0 10px 26px rgba(15,23,42,.10); } .mobileBottomNav__item, .mobileBottomNav__item--primary{ position:relative; height:54px; min-height:54px; margin:0; padding:6px 2px 5px; gap:3px; border:1px solid transparent; border-radius:14px; color:#9aa9c2 !important; background:transparent; box-shadow:none; font-size:10.5px; font-weight:800; transform:none; } html[data-theme="light"] .mobileBottomNav__item, html[data-theme="light"] .mobileBottomNav__item--primary, html.theme-light .mobileBottomNav__item, html.theme-light .mobileBottomNav__item--primary, body.theme-light .mobileBottomNav__item, body.theme-light .mobileBottomNav__item--primary{ color:#64748b !important; } .mobileBottomNav__item::after{ content:""; position:absolute; top:2px; left:50%; width:18px; height:2px; border-radius:999px; background:var(--accent); opacity:0; transform:translateX(-50%) scaleX(.55); transition:opacity .16s ease,transform .16s ease; } .mobileBottomNav__item:hover, .mobileBottomNav__item.is-active, .mobileBottomNav__item--primary:hover, .mobileBottomNav__item--primary.is-active, .mobileBottomNav__item--primary:focus-visible{ border-color:rgba(var(--accent-rgb),.22); color:#a9c7ff !important; background:rgba(var(--accent-rgb),.09) !important; box-shadow:none !important; } html[data-theme="light"] .mobileBottomNav__item:hover, html[data-theme="light"] .mobileBottomNav__item.is-active, html[data-theme="light"] .mobileBottomNav__item--primary:hover, html[data-theme="light"] .mobileBottomNav__item--primary.is-active, html.theme-light .mobileBottomNav__item:hover, html.theme-light .mobileBottomNav__item.is-active, html.theme-light .mobileBottomNav__item--primary:hover, html.theme-light .mobileBottomNav__item--primary.is-active, body.theme-light .mobileBottomNav__item:hover, body.theme-light .mobileBottomNav__item.is-active, body.theme-light .mobileBottomNav__item--primary:hover, body.theme-light .mobileBottomNav__item--primary.is-active{ color:var(--accent) !important; background:rgba(var(--accent-rgb),.07) !important; } .mobileBottomNav__item.is-active::after{ opacity:1; transform:translateX(-50%) scaleX(1); } .mobileBottomNav__item:active, .mobileBottomNav__item--primary:active{ transform:scale(.975); } .mobileBottomNav__ico, .mobileBottomNav__item--primary .mobileBottomNav__ico{ width:28px; height:28px; border-radius:10px; color:currentColor; background:transparent; } .mobileBottomNav__ico svg, .mobileBottomNav__item--primary .mobileBottomNav__ico svg{ width:20px; height:20px; } .mobileBottomNav__item.is-active .mobileBottomNav__ico{ background:rgba(var(--accent-rgb),.10); } .mobileBottomNav__label, .mobileBottomNav__item--primary .mobileBottomNav__label{ font-size:inherit; font-weight:inherit; } .mobileBottomNav__item:focus-visible{ outline:2px solid rgba(var(--accent-rgb),.58); outline-offset:1px; } .supportChat{ bottom:calc(90px + env(safe-area-inset-bottom, 0px)) !important; } .annBell{ bottom:calc(92px + env(safe-area-inset-bottom, 0px)) !important; } } @media(max-width:390px){ .mobileBottomNav{ left:calc(env(safe-area-inset-left, 0px) + 7px); right:calc(env(safe-area-inset-right, 0px) + 7px); bottom:calc(env(safe-area-inset-bottom, 0px) + 7px); gap:2px; padding-inline:5px; border-radius:17px; } .mobileBottomNav__item, .mobileBottomNav__item--primary{ padding-inline:1px; font-size:9.8px; } .mobileBottomNav__ico, .mobileBottomNav__item--primary .mobileBottomNav__ico{ width:26px; height:26px; } .mobileBottomNav__ico svg, .mobileBottomNav__item--primary .mobileBottomNav__ico svg{ width:19px; height:19px; } } /* ---------------- v362: module software settings + V360 mobile dock ---------------- */ .settingsPage .performanceSettingsCard{ width:100%; max-width:none; } .softwareSettingsGrid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:14px; } .softwareSettingsModule{ min-width:0; overflow:hidden; border:1px solid var(--border); border-radius:16px; background:rgba(255,255,255,.018); } html[data-theme="light"] .softwareSettingsModule, html.theme-light .softwareSettingsModule, body.theme-light .softwareSettingsModule{ background:rgba(15,23,42,.018); } .softwareSettingsModule__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; padding:12px 14px; border-bottom:1px solid var(--border); } .softwareSettingsModule__head strong{ font-size:14px; } .softwareSettingsModule__head small{ color:var(--muted); font-size:10.5px; text-align:left; } .softwareSettingsModule .performanceSettingsList{ margin:0; border:0; } .softwareSettingsModule .performanceSetting{ min-height:64px; padding:12px 14px; } .softwareSettingsModule .performanceSetting:last-child{ border-bottom:0; } .performanceSetting input[type="checkbox"]{ width:18px !important; height:18px !important; min-width:18px !important; min-height:18px !important; flex:0 0 18px; margin:0; accent-color:var(--accent); } #softwarePolicyStatus[data-kind="ok"]{ color:var(--ok); } #softwarePolicyStatus[data-kind="error"]{ color:var(--danger); } @media(max-width:760px){ .softwareSettingsGrid{ grid-template-columns:1fr; gap:10px; } .softwareSettingsModule__head{ align-items:flex-start; flex-direction:column; gap:3px; } .softwareSettingsModule__head small{ text-align:right; } } @media(max-width:980px){ .annBell{ top:calc(env(safe-area-inset-top, 0px) + 12px) !important; bottom:auto !important; left:12px; border-color:var(--border); background:color-mix(in srgb,var(--card) 94%,var(--text) 6%); box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; } html[data-theme="light"] .annBell, html.theme-light .annBell, body.theme-light .annBell{ border-color:rgba(15,23,42,.11); background:color-mix(in srgb,var(--card) 96%,var(--text) 4%); box-shadow:none; } } /* ---------------- v363: account paging + treasury shortcut + fiscal row alignment ---------------- */ .treasuryAccountSelectControl{ display:grid; grid-template-columns:minmax(0,1fr) 42px; align-items:stretch; gap:7px; width:100%; min-width:0; } .treasuryAccountSelectControl > select, .treasuryAccountSelectControl > .selectx{ width:100%; min-width:0; } .treasuryAccountSelectControl__add{ width:42px; min-width:42px; min-height:42px !important; height:42px; padding:0 !important; align-self:end; border-color:color-mix(in srgb,var(--accent) 34%,var(--border) 66%) !important; background:color-mix(in srgb,var(--accent) 11%,transparent) !important; color:color-mix(in srgb,var(--accent) 78%,#fff 22%) !important; font-size:22px; font-weight:700; line-height:1; box-shadow:none !important; } .treasuryAccountSelectControl__add:hover{ border-color:color-mix(in srgb,var(--accent) 56%,var(--border) 44%) !important; background:color-mix(in srgb,var(--accent) 17%,transparent) !important; } .accountingTable--years td.accountingDateRange{ display:table-cell; vertical-align:middle; white-space:nowrap; } .accountingTable--years td.accountingDateRange > span{ display:inline-flex; align-items:center; vertical-align:middle; margin-inline:3px; } /* ---------------- v370: inline create actions + journal empty state ---------------- */ .accountingPage > .accountingEntryTabs--top{ order:0; margin-top:-4px; margin-bottom:12px; padding-top:4px; } .accountingEntryUnavailable{ min-height:240px; } /* ---------------- v375: expandable floating messages + unified operation buttons ---------------- */ .statusbar{ width:min(420px, calc(100vw - 24px)) !important; max-width:min(760px, calc(100vw - 24px)) !important; min-height:54px !important; padding:12px 14px !important; border-radius:18px !important; display:flex !important; align-items:flex-start !important; justify-content:space-between !important; gap:12px !important; white-space:normal !important; overflow:visible !important; text-overflow:clip !important; text-align:right !important; box-shadow:0 18px 40px rgba(2,8,23,.28) !important; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); } .statusbar.statusbar--ok{ background:rgba(18,101,52,.94) !important; border-color:rgba(34,197,94,.34) !important; color:#fff !important; } .statusbar.statusbar--err{ background:rgba(127,29,29,.96) !important; border-color:rgba(248,113,113,.28) !important; color:#fff !important; } .statusbar__content{ flex:1 1 auto; min-width:0; cursor:default; } .statusbar--expandable .statusbar__content{ cursor:pointer; } .statusbar__text{ display:block; line-height:1.8; font-size:13px; font-weight:800; overflow-wrap:anywhere; } .statusbar.statusbar--expandable:not(.is-expanded) .statusbar__text{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } .statusbar__actions{ display:flex; flex:0 0 auto; align-items:center; gap:8px; padding-top:1px; } .statusbar__action, .statusbar__close{ border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.08); color:inherit; border-radius:10px; min-height:32px; height:32px; padding:0 10px; font:inherit; font-size:12px; font-weight:800; cursor:pointer; box-shadow:none; } .statusbar__close{ min-width:32px; width:32px; padding:0; font-size:20px; line-height:1; } .statusbar__action:hover, .statusbar__close:hover{ background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); } .statusbar:not(.statusbar--expandable) .statusbar__action{ display:none !important; } @media (max-width: 640px){ .statusbar{ width:min(calc(100vw - 18px), 100%) !important; max-width:calc(100vw - 18px) !important; min-height:52px !important; padding:11px 12px !important; gap:10px !important; bottom:10px !important; } .statusbar__text{ font-size:12px; line-height:1.75; } .statusbar__actions{ gap:6px; } .statusbar__action, .statusbar__close{ min-height:30px; height:30px; } } /* یکپارچه‌سازی ظاهر دکمه‌های عملیات در همه ماژول‌ها به‌جز فاکتور فروش */ .inventoryActions .btn, .opActions--mini .btn, .table .opActions--mini .btn--iconOnly, .table .opActions--mini .invActionBtn, .table .btn--iconOnly[data-cust], .table .btn--iconOnly[data-picker-edit-customer], .table .btn--iconOnly[data-picker-edit-item]{ min-height:34px !important; height:34px !important; border-radius:10px !important; box-shadow:none !important; font-size:12px !important; font-weight:800 !important; } /* فاکتور فروش و صف ارسال از این یکپارچه‌سازی مستثنا بمانند */ .table .invRowActions .invActionBtn, .table .jobRowActions--table .jobActionBtn{ width:34px !important; min-width:34px !important; padding:0 !important; } .table .opActions--mini .btn--iconOnly, .table .opActions--mini .invActionBtn, .table .btn--iconOnly[data-cust], .table .btn--iconOnly[data-picker-edit-customer], .table .btn--iconOnly[data-picker-edit-item]{ width:auto !important; min-width:0 !important; padding:0 10px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:6px !important; } .table .opActions--mini .btn--iconOnly::after, .table .opActions--mini .invActionBtn::after, .table .btn--iconOnly[data-cust]::after, .table .btn--iconOnly[data-picker-edit-customer]::after, .table .btn--iconOnly[data-picker-edit-item]::after{ content:attr(title); display:inline-block; line-height:1; } .table .opActions--mini .btn--iconOnly .btn__ico svg, .table .opActions--mini .invActionBtn .btn__ico svg, .table .btn--iconOnly[data-cust] .btn__ico svg, .table .btn--iconOnly[data-picker-edit-customer] .btn__ico svg, .table .btn--iconOnly[data-picker-edit-item] .btn__ico svg{ width:14px !important; height:14px !important; } .table .opActions--mini .btn--danger.btn--iconOnly, .table .opActions--mini .btn--danger.invActionBtn, .table .btn--danger.btn--iconOnly[data-cust]{ color:#ef4444 !important; border-color:rgba(239,68,68,.24) !important; background:rgba(239,68,68,.08) !important; } .table .opActions--mini .btn--danger.btn--iconOnly:hover, .table .opActions--mini .btn--danger.invActionBtn:hover, .table .btn--danger.btn--iconOnly[data-cust]:hover{ background:rgba(239,68,68,.14) !important; border-color:rgba(239,68,68,.34) !important; } /* ---------------- v376: purchase edit layout and item-column width fix ---------------- */ #purchaseEditor .inventoryPurchaseLinesTable{ min-width:1140px; width:1140px; table-layout:fixed; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--index{ width:48px; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--item{ width:280px; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--expense{ width:220px; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--qty{ width:94px; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--price{ width:104px; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--discount{ width:104px; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--vat{ width:94px; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--total{ width:130px; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--ops{ width:64px; } #purchaseEditor .inventoryPurchaseLinesTable th, #purchaseEditor .inventoryPurchaseLinesTable td{ vertical-align:middle; } #purchaseEditor .inventoryPurchaseLinesTable td{ overflow:hidden; } #purchaseEditor .inventoryPurchaseLine__item, #purchaseEditor .inventoryPurchaseLine__expense, #purchaseEditor .inventoryPurchaseLine__number, #purchaseEditor .inventoryPurchaseLine__vat, #purchaseEditor .inventoryPurchaseLine__total, #purchaseEditor .inventoryPurchaseLine__actions{ min-width:0; max-width:100%; } #purchaseEditor .inventoryPurchaseLine__item .inventoryPurchaseItemPick, #purchaseEditor .inventoryPurchaseLine__item .lineTitlePick, #purchaseEditor .inventoryPurchaseLine__expense select, #purchaseEditor .inventoryPurchaseLine__expense .selectx, #purchaseEditor .inventoryPurchaseLine__expense .selectx-btn{ width:100%; min-width:0; max-width:100%; } #purchaseEditor .inventoryPurchaseLine__item .inventoryPurchaseItemPick{ overflow:hidden; } #purchaseEditor .inventoryPurchaseLine__item [data-purchase-item-label]{ width:100%; min-width:0; max-width:100%; text-overflow:ellipsis; } #purchaseEditor .inventoryPurchaseLine__expense [data-purchase-expense-empty]{ display:block; width:100%; text-align:center; } #purchaseEditor .inventoryPurchaseLinesTable input, #purchaseEditor .inventoryPurchaseLinesTable select, #purchaseEditor .inventoryPurchaseLinesTable .selectx-btn{ max-width:100%; } /* ---------------- v378: inventory status wording + icon-only actions ---------------- */ .inventoryActions .btn, .table .opActions--mini .btn--iconOnly, .table .opActions--mini .invActionBtn, .table .btn--iconOnly[data-cust], .table .btn--iconOnly[data-picker-edit-customer], .table .btn--iconOnly[data-picker-edit-item]{ width:34px !important; min-width:34px !important; height:34px !important; min-height:34px !important; padding:0 !important; gap:0 !important; border-radius:10px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; } .inventoryActions .btn::after, .table .opActions--mini .btn--iconOnly::after, .table .opActions--mini .invActionBtn::after, .table .btn--iconOnly[data-cust]::after, .table .btn--iconOnly[data-picker-edit-customer]::after, .table .btn--iconOnly[data-picker-edit-item]::after{ content:none !important; display:none !important; } .inventoryActions .btn .btn__text, .table .opActions--mini .btn--iconOnly .btn__text, .table .opActions--mini .invActionBtn .btn__text, .table .btn--iconOnly[data-cust] .btn__text, .table .btn--iconOnly[data-picker-edit-customer] .btn__text, .table .btn--iconOnly[data-picker-edit-item] .btn__text{ display:none !important; } .inventoryActions .btn .btn__ico, .table .opActions--mini .btn--iconOnly .btn__ico, .table .opActions--mini .invActionBtn .btn__ico, .table .btn--iconOnly[data-cust] .btn__ico, .table .btn--iconOnly[data-picker-edit-customer] .btn__ico, .table .btn--iconOnly[data-picker-edit-item] .btn__ico{ display:inline-flex !important; } .inventoryActions .btn .btn__ico svg, .table .opActions--mini .btn--iconOnly .btn__ico svg, .table .opActions--mini .invActionBtn .btn__ico svg, .table .btn--iconOnly[data-cust] .btn__ico svg, .table .btn--iconOnly[data-picker-edit-customer] .btn__ico svg, .table .btn--iconOnly[data-picker-edit-item] .btn__ico svg{ width:15px !important; height:15px !important; } .inventoryActions .btn.btn--danger, .table .opActions--mini .btn--danger.btn--iconOnly, .table .opActions--mini .btn--danger.invActionBtn, .table .btn--danger.btn--iconOnly[data-cust]{ color:#ef4444 !important; border-color:rgba(239,68,68,.24) !important; background:rgba(239,68,68,.08) !important; } .inventoryActions .btn.btn--danger:hover, .table .opActions--mini .btn--danger.btn--iconOnly:hover, .table .opActions--mini .btn--danger.invActionBtn:hover, .table .btn--danger.btn--iconOnly[data-cust]:hover{ background:rgba(239,68,68,.14) !important; border-color:rgba(239,68,68,.34) !important; } /* ---------------- v379: purchase lines layout + tighter action dock + modal notifications ---------------- */ #purchaseEditor .inventoryPurchaseLinesTable{ min-width:1180px !important; width:1180px !important; table-layout:fixed !important; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--item{ width:270px !important; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--expense{ width:230px !important; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--qty{ width:96px !important; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--price{ width:108px !important; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--discount{ width:108px !important; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--vat{ width:96px !important; } #purchaseEditor .inventoryPurchaseLinesTable .purchaseCol--total{ width:140px !important; } #purchaseEditor .inventoryPurchaseLine__number input, #purchaseEditor .inventoryPurchaseLine__vat input{ width:100% !important; min-width:0 !important; max-width:100% !important; } #purchaseEditor .inventoryPurchaseLine__expense, #purchaseEditor .inventoryPurchaseLine__item, #purchaseEditor .inventoryPurchaseLine__expense .selectx, #purchaseEditor .inventoryPurchaseLine__expense .selectx-btn, #purchaseEditor .inventoryPurchaseLine__item .inventoryPurchaseItemPick, #purchaseEditor .inventoryPurchaseLine__item .lineTitlePick{ min-width:0 !important; max-width:100% !important; } #purchaseEditor .purchaseActionDock{ display:flex !important; justify-content:flex-end !important; align-items:center !important; flex-wrap:wrap !important; gap:8px !important; } #purchaseEditor .purchaseActionDock .sendDock__group{ display:flex !important; align-items:center !important; gap:8px !important; flex:0 0 auto !important; } #purchaseEditor .purchaseActionDock .sendDock__group--primary, #purchaseEditor .purchaseActionDock .sendDock__group--secondary{ grid-template-columns:none !important; } #purchaseEditor .purchaseActionDock .sendDock__btn{ width:auto !important; min-width:160px; } #purchaseEditor .purchaseActionDock .sendDock__btn--primary{ min-width:164px; } @media (max-width: 900px){ #purchaseEditor .purchaseActionDock{ justify-content:stretch !important; } #purchaseEditor .purchaseActionDock .sendDock__group{ flex:1 1 100% !important; flex-wrap:wrap !important; } #purchaseEditor .purchaseActionDock .sendDock__btn, #purchaseEditor .purchaseActionDock .sendDock__btn--primary{ flex:1 1 180px; min-width:0; } } /* اعلان پایین صفحه دوباره غیرفعال بماند چون اعلان‌ها به صورت مودال نمایش داده می‌شوند. */ #statusBar{ display:none !important; } /* ---------------- v380: purchase dock right align + login prompt actions + item category cleanup + company connection spacing ---------------- */ #purchaseEditor .purchaseActionDock{ justify-content:flex-start !important; direction:rtl; } #purchaseEditor .purchaseActionDock .sendDock__group{ justify-content:flex-start !important; } #purchaseEditor .purchaseActionDock .sendDock__btn, #purchaseEditor .purchaseActionDock .sendDock__btn--primary{ min-width:148px; } .companyClientTypeField{ padding-inline-start:8px; } .itemCategorySelectControl{ grid-template-columns:minmax(0,1fr) auto; gap:8px; } .itemCategorySelectControl__add{ width:auto; min-width:108px; padding:0 14px !important; font-size:13px; font-weight:800; white-space:nowrap; } @media (max-width:700px){ .itemCategorySelectControl{ grid-template-columns:1fr; } .itemCategorySelectControl__add{ width:100%; min-width:0; } } .page[data-page="items"] .itemCategoryField .selectx-item[data-value="__new__"], .page[data-page="items"] .itemCategoryField .selectx-action, .page[data-page="items"] .itemCategoryField .selectx-menu [data-sx-action-button]{ display:none !important; } #msgActions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:12px; } #msgActions .btn{ min-width:120px; } /* ---------------- v381: only dropdown add-category option + connection-type fit ---------------- */ .itemCategorySelectControl{ display:block !important; width:100% !important; min-width:0 !important; } .itemCategorySelectControl > select, .itemCategorySelectControl > .selectx, .itemCategorySelectControl > .selectx > .selectx-btn{ width:100% !important; min-width:0 !important; max-width:100% !important; box-sizing:border-box !important; } .itemCategorySelectControl__add{ display:none !important; } .page[data-page="items"] .itemCategoryField .selectx-item[data-value="__new__"]{ display:flex !important; min-height:50px; align-items:center; justify-content:flex-start; font-weight:850; color:var(--text); border-top:1px solid color-mix(in srgb,var(--border) 72%,transparent); } .page[data-page="items"] .itemCategoryField .selectx-item[data-value="__new__"]:hover{ background:color-mix(in srgb,var(--accent) 12%,var(--app-menu-surface,var(--item-field-surface))); } .companyClientTypeField{ min-width:0 !important; width:100% !important; max-width:100% !important; padding:0 !important; margin:0 !important; overflow:hidden; box-sizing:border-box !important; } .companyClientTypeField > select, .companyClientTypeField > .selectx, .companyClientTypeField > .selectx > .selectx-btn, .companyClientTypeField > .selectx-btn{ width:100% !important; min-width:0 !important; max-width:100% !important; box-sizing:border-box !important; } .companyClientTypeField .selectx-btn{ padding-inline:12px 34px !important; } @media (max-width:980px){ .settingsPage .form--pro > label.companyClientTypeField{ grid-column:span 6 !important; } } @media (max-width:620px){ .settingsPage .form--pro > label.companyClientTypeField{ grid-column:1 / -1 !important; } } /* ---------------- v382: fix company connection type dropdown opening ---------------- */ .companyClientTypeField{ overflow:visible !important; position:relative; z-index:1; } .companyClientTypeField:has(.selectx.open){ z-index:1200 !important; } .companyClientTypeField > .selectx{ position:relative; z-index:1; } .companyClientTypeField > .selectx.open{ z-index:1201 !important; } .companyClientTypeField .selectx-menu, .settingsPage .form--pro > label.companyClientTypeField .selectx-menu{ position:absolute !important; top:calc(100% + 8px) !important; right:0 !important; left:0 !important; inset-inline:0 !important; width:100% !important; min-width:100% !important; max-width:100% !important; margin-top:0 !important; z-index:9999 !important; } .settingsPage .form--pro, .settingsPage .form--pro > label{ overflow:visible !important; }