/*
  b2b Cloud — UI
  Author : Rezaei.Ali  |  Ovan Develop  |  https://ovan.dev/
*/
@charset "utf-8";
@font-face { font-family: 'IRANSansWeb'; src: url('../fonts/IRANSansWeb.woff2') format('woff2'), url('../fonts/IRANSansWeb.woff') format('woff'); font-display: swap; }

:root {
  --ovan-navy: #0f3554; --ovan-navy-2: #16466d; --ovan-navy-3: #0a2740;
  --ovan-volt: #f5b700; --ovan-sky: #1f6fd1; --ovan-sky-d: #1859aa;
  --ovan-mint: #14a37f; --ovan-rose: #e04b4b; --ovan-amber: #d98a00;
  --ovan-bg: #f2f5f9; --ovan-card: #ffffff; --ovan-line: #e3e8ef; --ovan-ink: #1a2b3c; --ovan-mute: #6b7a8c;
  --ovan-side-w: 256px;
  --bs-body-font-family: 'IRANSansWeb', Tahoma, sans-serif;
  --bs-primary: #1f6fd1; --bs-primary-rgb: 31,111,209; --bs-link-color: #1f6fd1; --bs-link-color-rgb: 31,111,209;
  --bs-success: #14a37f; --bs-success-rgb: 20,163,127; --bs-danger: #e04b4b; --bs-danger-rgb: 224,75,75;
  --bs-border-radius: .6rem; --bs-border-radius-lg: .9rem;
}
[data-bs-theme="dark"] {
  --ovan-bg: #0e1620; --ovan-card: #16212e; --ovan-line: #26374a; --ovan-ink: #e6edf5; --ovan-mute: #8fa1b5;
  --ovan-navy: #0a2236; --ovan-navy-2: #123452; --ovan-navy-3: #071a2a;
  --bs-body-bg: #0e1620; --bs-body-color: #e6edf5; --bs-border-color: #26374a; --bs-tertiary-bg: #1b2a3a; --bs-secondary-bg: #1b2a3a;
}
html, body { font-family: 'IRANSansWeb', Tahoma, sans-serif; }
body { background: var(--ovan-bg); color: var(--ovan-ink); font-size: .93rem; }
a { text-decoration: none; }
.form-control, .form-select, .btn, .nav-link, .dropdown-menu, .modal-content, .table { font-family: inherit; }
.form-control, .form-select { background-color: var(--ovan-card); border-color: var(--ovan-line); }
.form-control:focus, .form-select:focus { border-color: var(--ovan-sky); box-shadow: 0 0 0 .2rem rgba(31,111,209,.16); }
.form-label { font-size: .82rem; color: var(--ovan-mute); margin-bottom: .3rem; }
.btn { border-radius: .6rem; font-weight: 500; }
.btn-primary { --bs-btn-bg: var(--ovan-sky); --bs-btn-border-color: var(--ovan-sky); --bs-btn-hover-bg: var(--ovan-sky-d); --bs-btn-hover-border-color: var(--ovan-sky-d); --bs-btn-active-bg: var(--ovan-sky-d); --bs-btn-disabled-bg: var(--ovan-sky); }
.btn-success { --bs-btn-bg: var(--ovan-mint); --bs-btn-border-color: var(--ovan-mint); --bs-btn-hover-bg: #0f8c6c; --bs-btn-hover-border-color: #0f8c6c; }
.btn-volt { background: var(--ovan-volt); color: #1f1600; border-color: var(--ovan-volt); }
.btn-volt:hover { background: #ffc61a; color: #1f1600; }
.text-mute { color: var(--ovan-mute) !important; }
.num, .ovan-num { font-variant-numeric: tabular-nums; direction: ltr; unicode-bidi: plaintext; }
input[dir=ltr], .ltr { direction: ltr; text-align: left; }

/* ── Layout ── */
.ovan-shell { min-height: 100vh; }
.ovan-side { position: fixed; inset: 0 0 0 auto; width: var(--ovan-side-w); background: var(--ovan-navy); color: #cfe0f1; display: flex; flex-direction: column; z-index: 1040; transition: transform .25s; }
.ovan-main { margin-right: var(--ovan-side-w); min-height: 100vh; display: flex; flex-direction: column; }
.ovan-brand { display: flex; align-items: center; gap: .6rem; padding: 1.2rem 1.25rem; color: #fff; font-weight: 700; font-size: 1.15rem; border-bottom: 1px solid rgba(255,255,255,.07); }
.ovan-brand .bolt { width: 34px; height: 34px; border-radius: 10px; background: var(--ovan-volt); color: var(--ovan-navy-3); display: grid; place-items: center; font-size: 1.1rem; }
.ovan-brand small { display: block; font-weight: 400; font-size: .7rem; color: #8fb0cf; margin-top: -2px; }
.ovan-nav { list-style: none; margin: 0; padding: .8rem .7rem; flex: 1; overflow-y: auto; }
.ovan-nav a { display: flex; align-items: center; gap: .7rem; padding: .62rem .85rem; margin-bottom: 2px; border-radius: .6rem; color: #b9cde2; position: relative; transition: background .15s, color .15s; }
.ovan-nav a i { font-size: 1.1rem; width: 1.3rem; text-align: center; }
.ovan-nav a:hover { background: rgba(255,255,255,.07); color: #fff; }
.ovan-nav a.active { background: var(--ovan-navy-2); color: #fff; font-weight: 600; }
.ovan-nav a.active::before { content: ''; position: absolute; right: -.7rem; top: 22%; bottom: 22%; width: 4px; border-radius: 4px 0 0 4px; background: var(--ovan-volt); }
.ovan-nav .sep { font-size: .7rem; color: #6f90ae; padding: .9rem .9rem .3rem; }
.ovan-side-foot { padding: 1rem 1.1rem; border-top: 1px solid rgba(255,255,255,.07); font-size: .78rem; }
.ovan-gauge { height: 6px; background: rgba(255,255,255,.12); border-radius: 6px; overflow: hidden; margin: .45rem 0 .3rem; }
.ovan-gauge > i { display: block; height: 100%; background: var(--ovan-volt); border-radius: 6px; }
.ovan-gauge.low > i { background: var(--ovan-rose); }
.ovan-top { display: flex; align-items: center; gap: .75rem; padding: .8rem 1.5rem; background: var(--ovan-card); border-bottom: 1px solid var(--ovan-line); position: sticky; top: 0; z-index: 1020; }
.ovan-top h1 { font-size: 1.05rem; margin: 0; font-weight: 700; }
.ovan-top .date { color: var(--ovan-mute); font-size: .8rem; }
.ovan-content { padding: 1.5rem; flex: 1; }
.ovan-footer { padding: 1rem 1.5rem; font-size: .78rem; color: var(--ovan-mute); text-align: center; border-top: 1px solid var(--ovan-line); }
.ovan-footer a { color: inherit; }
.ovan-icon-btn { width: 38px; height: 38px; display: grid; place-items: center; border-radius: .6rem; border: 1px solid var(--ovan-line); background: transparent; color: var(--ovan-ink); }
.ovan-icon-btn:hover { background: var(--bs-tertiary-bg); }
@media (max-width: 991.98px) {
  .ovan-side { transform: translateX(100%); }
  .ovan-side.open { transform: none; box-shadow: -10px 0 40px rgba(0,0,0,.3); }
  .ovan-main { margin-right: 0; }
  .ovan-content { padding: 1rem; }
  .ovan-top { padding: .7rem 1rem; }
  .ovan-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1035; display: none; }
  .ovan-backdrop.show { display: block; }
}

/* ── Cards / stats ── */
.card { background: var(--ovan-card); border: 1px solid var(--ovan-line); border-radius: .9rem; box-shadow: none; }
.card-header { background: transparent; border-bottom: 1px solid var(--ovan-line); font-weight: 600; }
.ovan-stat { padding: 1.1rem 1.2rem; display: flex; align-items: center; gap: .9rem; height: 100%; }
.ovan-stat .ico { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; font-size: 1.3rem; flex: none; }
.ovan-stat .lbl { color: var(--ovan-mute); font-size: .8rem; }
.ovan-stat .val { font-size: 1.35rem; font-weight: 700; line-height: 1.3; }
.ovan-stat .sub { font-size: .75rem; color: var(--ovan-mute); }
.ico-sky { background: rgba(31,111,209,.12); color: var(--ovan-sky); } .ico-mint { background: rgba(20,163,127,.12); color: var(--ovan-mint); }
.ico-rose { background: rgba(224,75,75,.12); color: var(--ovan-rose); } .ico-volt { background: rgba(245,183,0,.18); color: var(--ovan-amber); }
.ico-navy { background: rgba(15,53,84,.1); color: var(--ovan-navy); } [data-bs-theme=dark] .ico-navy { background: rgba(255,255,255,.08); color: #cfe0f1; }
.ovan-hero { background: linear-gradient(120deg, var(--ovan-navy) 0%, var(--ovan-navy-2) 100%); color: #fff; border-radius: .9rem; padding: 1.3rem 1.5rem; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.ovan-hero .big { font-size: 1.7rem; font-weight: 700; }
.ovan-hero .muted { color: #a9c3dc; font-size: .82rem; }

/* ── Tables ── */
.table { --bs-table-bg: transparent; --bs-table-striped-bg: rgba(127,150,175,.06); margin-bottom: 0; }
.table > thead th { font-weight: 600; font-size: .8rem; color: var(--ovan-mute); background: transparent; border-bottom: 1px solid var(--ovan-line); white-space: nowrap; }
.table td { vertical-align: middle; border-color: var(--ovan-line); }
.table-hover > tbody > tr:hover > * { background: rgba(31,111,209,.05); }
div.dataTables_wrapper div.dataTables_filter input { background: var(--ovan-card); color: var(--ovan-ink); }
div.dataTables_wrapper div.dataTables_length select { background-color: var(--ovan-card); color: var(--ovan-ink); }
div.dataTables_wrapper div.dataTables_info, .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter { font-size: .82rem; color: var(--ovan-mute); }
.page-link { font-family: inherit; }
table.dataTable { width: 100% !important; }
.badge { font-weight: 500; font-size: .76rem; padding: .42em .7em; }
.badge-soft-success { background: rgba(20,163,127,.14); color: #0d8a6a; } .badge-soft-danger { background: rgba(224,75,75,.14); color: #c63a3a; }
.badge-soft-warning { background: rgba(245,183,0,.2); color: #9a6b00; } .badge-soft-secondary { background: rgba(107,122,140,.16); color: var(--ovan-mute); }
.badge-soft-info { background: rgba(31,111,209,.13); color: #1859aa; } .badge-soft-dark { background: rgba(26,43,60,.15); color: var(--ovan-ink); }
[data-bs-theme=dark] .badge-soft-success { color: #4fd6b0; } [data-bs-theme=dark] .badge-soft-danger { color: #ff8a8a; } [data-bs-theme=dark] .badge-soft-warning { color: #ffd45e; } [data-bs-theme=dark] .badge-soft-info { color: #8ab8f5; }
.empty { text-align: center; color: var(--ovan-mute); padding: 2.2rem 1rem; }
.empty i { font-size: 2rem; display: block; margin-bottom: .4rem; opacity: .6; }

/* ── Invoice form ── */
.ovan-lines td { padding: .35rem .3rem; }
.ovan-lines .form-control { padding: .35rem .5rem; font-size: .88rem; }
.ovan-totals .row-t { display: flex; justify-content: space-between; padding: .4rem 0; border-bottom: 1px dashed var(--ovan-line); }
.ovan-totals .grand { font-size: 1.2rem; font-weight: 700; color: var(--ovan-sky); border: 0; }
.ovan-suggest { position: absolute; z-index: 1060; background: var(--ovan-card); border: 1px solid var(--ovan-line); border-radius: .6rem; box-shadow: 0 12px 30px rgba(0,0,0,.15); max-height: 260px; overflow: auto; min-width: 320px; }
.ovan-suggest div { padding: .5rem .8rem; cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; font-size: .85rem; }
.ovan-suggest div:hover, .ovan-suggest div.sel { background: rgba(31,111,209,.1); }

/* ── Toast / alerts ── */
.ovan-toasts { position: fixed; bottom: 1.2rem; left: 1.2rem; z-index: 2000; display: flex; flex-direction: column; gap: .5rem; }
.ovan-toast { background: var(--ovan-navy); color: #fff; padding: .75rem 1.1rem; border-radius: .7rem; box-shadow: 0 10px 30px rgba(0,0,0,.25); font-size: .88rem; display: flex; gap: .6rem; align-items: center; animation: ovanIn .2s ease-out; max-width: 380px; }
.ovan-toast.err { background: #b93636; } .ovan-toast.ok { background: #0e8b6b; }
@keyframes ovanIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
.ovan-banner { padding: .65rem 1.5rem; font-size: .85rem; display: flex; gap: .7rem; align-items: center; flex-wrap: wrap; }
.ovan-banner.warn { background: rgba(245,183,0,.18); color: #7a5600; } .ovan-banner.danger { background: rgba(224,75,75,.14); color: #a02c2c; } .ovan-banner.info { background: rgba(31,111,209,.12); color: #1859aa; }
[data-bs-theme=dark] .ovan-banner.warn { color: #ffd45e; } [data-bs-theme=dark] .ovan-banner.danger { color: #ff9b9b; } [data-bs-theme=dark] .ovan-banner.info { color: #8ab8f5; }

/* ── Plans ── */
.ovan-plan { border: 1px solid var(--ovan-line); border-radius: .9rem; padding: 1.2rem; height: 100%; display: flex; flex-direction: column; background: var(--ovan-card); }
.ovan-plan.current { border-color: var(--ovan-sky); box-shadow: 0 0 0 3px rgba(31,111,209,.12); }
.ovan-plan .price { font-size: 1.4rem; font-weight: 700; }
.ovan-plan ul { list-style: none; padding: 0; margin: .8rem 0 1rem; font-size: .84rem; flex: 1; }
.ovan-plan li { padding: .22rem 0; } .ovan-plan li i { color: var(--ovan-mint); margin-left: .35rem; }
.ovan-meter { height: 7px; background: var(--bs-tertiary-bg); border-radius: 7px; overflow: hidden; } .ovan-meter > i { display: block; height: 100%; background: var(--ovan-sky); }
.ovan-meter.full > i { background: var(--ovan-rose); }

/* ── Auth pages ── */
.ovan-auth-body { min-height: 100vh; display: grid; place-items: center; padding: 1.5rem; background:
  radial-gradient(900px 500px at 85% -10%, rgba(245,183,0,.14), transparent 60%), linear-gradient(160deg, #0a2740, #0f3554 55%, #16466d); }
.ovan-auth-card { width: 100%; max-width: 430px; background: var(--ovan-card); border-radius: 1.1rem; padding: 2rem; box-shadow: 0 30px 80px rgba(0,0,0,.35); }
.ovan-brand-lg { display: flex; align-items: center; gap: .6rem; font-size: 1.4rem; font-weight: 700; color: var(--ovan-navy); margin-bottom: 1.1rem; }
.ovan-brand-lg i { width: 40px; height: 40px; background: var(--ovan-volt); border-radius: 12px; display: grid; place-items: center; font-size: 1.2rem; }
.ovan-auth-foot { text-align: center; font-size: .75rem; color: var(--ovan-mute); margin-top: 1.4rem; }

/* ── Print invoice ── */
.ovan-paper { background: #fff; color: #111; max-width: 820px; margin: 0 auto; padding: 2rem; border-radius: .6rem; border: 1px solid var(--ovan-line); }
.ovan-paper table { color: #111; } .ovan-paper th { background: #f0f3f7 !important; color: #222 !important; }
@media print {
  body { background: #fff !important; } .ovan-side, .ovan-top, .ovan-footer, .ovan-noprint, .ovan-banner, .ovan-toasts { display: none !important; }
  .ovan-main { margin: 0 !important; } .ovan-content { padding: 0 !important; } .ovan-paper { border: 0; max-width: none; padding: 0; }
}
.jdp-container, .jdp-container * { font-family: 'IRANSansWeb', Tahoma, sans-serif !important; }
