/* ظاهر برنامه (1.332, saeed 2026-11-06): the choices of «ظاهر برنامه» (accounting/look.py) as attributes on <html>.
   With no attribute (the defaults) nothing here applies, so the program keeps the look it had before (except the text
   size: since 1.349 «معمولی» is a little smaller, see below).
   :not(#ns-look) weighs like an id, so these win over the pages' own rules. */

/* ---- the motion of a window that opens: every <dialog>, the product card of the invoices */
html[data-ns-motion=zoom] { --ns-from: scale(.94); }
html[data-ns-motion=up] { --ns-from: translateY(40px); }
html[data-ns-motion=side] { --ns-from: translateX(-60vw); }
html[data-ns-motion]:not(#ns-look) dialog[open],
html[data-ns-motion]:not(#ns-look) .pi-card {
    animation: ns-look-in var(--ns-t, 300ms) cubic-bezier(.2, .8, .25, 1) both; }
html[data-ns-motion]:not(#ns-look) dialog[open]::backdrop,
html[data-ns-motion]:not(#ns-look) .pi-layer,
html[data-ns-motion]:not(#ns-look) .g-drawer-backdrop {
    animation: ns-look-fade var(--ns-t, 300ms) ease both; }
html[data-ns-motion]:not(#ns-look) .g-drawer { transition-duration: var(--ns-t, 300ms); }
@keyframes ns-look-in { from { opacity: 0; transform: var(--ns-from, scale(.94)); } to { opacity: 1; transform: none; } }
@keyframes ns-look-fade { from { opacity: 0; } to { opacity: 1; } }

/* ---- behind an open window */
html[data-ns-blur=none]:not(#ns-look) dialog::backdrop,
html[data-ns-blur=none]:not(#ns-look) .pi-layer,
html[data-ns-blur=none]:not(#ns-look) .g-drawer-backdrop {
    background: rgba(15, 23, 42, .08) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
html[data-ns-blur=light]:not(#ns-look) dialog::backdrop,
html[data-ns-blur=light]:not(#ns-look) .pi-layer,
html[data-ns-blur=light]:not(#ns-look) .g-drawer-backdrop {
    background: rgba(15, 23, 42, .28) !important; -webkit-backdrop-filter: blur(3px) !important; backdrop-filter: blur(3px) !important; }
html[data-ns-blur=strong]:not(#ns-look) dialog::backdrop,
html[data-ns-blur=strong]:not(#ns-look) .pi-layer,
html[data-ns-blur=strong]:not(#ns-look) .g-drawer-backdrop {
    background: rgba(15, 23, 42, .5) !important; -webkit-backdrop-filter: blur(9px) !important; backdrop-filter: blur(9px) !important; }

/* ---- the corners: cards and windows (--ns-r), buttons and boxes (--ns-rs) */
html[data-ns-radius=sharp] { --ns-r: 3px; --ns-rs: 2px; }
html[data-ns-radius=soft] { --ns-r: 8px; --ns-rs: 6px; }
html[data-ns-radius=round] { --ns-r: 18px; --ns-rs: 12px; }
html[data-ns-radius]:not(#ns-look) :is(.module, fieldset.module, .li-sheet, #lines-group, .li-sum, .local-settle, .li-notes,
    .results, #changelist-filter, .qd-card, .acc-card, .hub-main, .hub-number, .ns-settings-card, .ns-settings-part,
    .ns-card, .lc-side, .lc-frame, .lk-side, .lk-sample, dialog, .pi-card, .g-drawer, .qb-head, .qb-bar) {
    border-radius: var(--ns-r) !important; }
html[data-ns-radius]:not(#ns-look) :is(button:not(:is(.pi-close, .lc-x, .lk-x, .lc-swatches button)), .button, a.button, input[type=submit], input[type=button], .li-tool,
    .object-tools a, a.addlink, input[type=text], input[type=number], input[type=search], input[type=email],
    input[type=password], input:not([type]), select, textarea, .select2-selection) {
    border-radius: var(--ns-rs) !important; }

/* ---- shadows */
html[data-ns-shadow=none] { --ns-sh: none; --ns-shw: none; }
html[data-ns-shadow=soft] { --ns-sh: 0 2px 10px rgba(15, 23, 42, .07); --ns-shw: 0 18px 44px rgba(15, 23, 42, .18); }
html[data-ns-shadow=strong] { --ns-sh: 0 10px 28px rgba(15, 23, 42, .16); --ns-shw: 0 30px 70px rgba(15, 23, 42, .34); }
html[data-ns-shadow]:not(#ns-look) :is(.module, fieldset.module, .li-sheet, #lines-group, .li-sum, .local-settle,
    .results, .qd-card, .acc-card, .hub-main, .hub-number, .ns-settings-card, .ns-card, .lc-side, .lc-frame, .lk-side,
    .lk-sample, .qb-head) {
    box-shadow: var(--ns-sh) !important; }
html[data-ns-shadow]:not(#ns-look) :is(dialog, .pi-card, .g-drawer) { box-shadow: var(--ns-shw) !important; }

/* ---- text size: the page and its small windows (a window that holds a page of its own is sized by that page) */
/* 1.349 (saeed 2026-11-08: «فونت انتخابیت کلا خیلی بزرگه»): «معمولی» is now one step smaller than before (.92, the
   old «کوچک»), «کوچک» one more step, and «بزرگ» is the size the program had until 1.348. The top menu goes with it. */
/* 1.350: a page may be a step smaller still (--ns-page on its <body>, e.g. nd-compact.css: the purchase list and invoice);
   the top menu keeps the size of the program */
html:not([data-ns-font]):not(#ns-look) :is(#content, dialog:not(:has(iframe)), .pi-card, body > .select2-container .select2-dropdown) { zoom: calc(.92 * var(--ns-page, 1)); }
html:not([data-ns-font]):not(#ns-look) .ns-topbar { zoom: .92; }
html[data-ns-font=small]:not(#ns-look) :is(#content, dialog:not(:has(iframe)), .pi-card, body > .select2-container .select2-dropdown) { zoom: calc(.85 * var(--ns-page, 1)); }
html[data-ns-font=small]:not(#ns-look) .ns-topbar { zoom: .85; }
html[data-ns-font=large]:not(#ns-look) :is(#content, dialog:not(:has(iframe)), .pi-card, body > .select2-container .select2-dropdown) { zoom: var(--ns-page, 1); }
/* the list of a combo box hangs from <body>: it gets the same size, so it is as wide as its box */

/* ---- row spacing of the tables */
html[data-ns-density=compact]:not(#ns-look) :is(#content, dialog) :is(td, th) { padding-top: 2px !important; padding-bottom: 2px !important; }
html[data-ns-density=roomy]:not(#ns-look) :is(#content, dialog) :is(td, th) { padding-top: 11px !important; padding-bottom: 11px !important; }

/* ---- a button under the mouse */
html[data-ns-hover]:not(#ns-look) :is(button, .button, a.button, input[type=submit], input[type=button], .li-tool,
    .object-tools a, a.addlink) { transition: filter .15s, transform .15s, box-shadow .15s; }
html[data-ns-hover=color]:not(#ns-look) :is(button, .button, a.button, input[type=submit], input[type=button], .li-tool,
    .object-tools a, a.addlink):hover:not(:disabled) { filter: brightness(.9) saturate(1.15); }
html.ns-dark[data-ns-hover=color]:not(#ns-look) :is(button, .button, a.button, input[type=submit], input[type=button],
    .li-tool, .object-tools a, a.addlink):hover:not(:disabled) { filter: brightness(1.2); }
html[data-ns-hover=lift]:not(#ns-look) :is(button, .button, a.button, input[type=submit], input[type=button], .li-tool,
    .object-tools a, a.addlink):hover:not(:disabled) {
    transform: translateY(-2px); box-shadow: 0 6px 14px rgba(15, 23, 42, .16); }

@media (prefers-reduced-motion: reduce) {
    html[data-ns-motion]:not(#ns-look) :is(dialog[open], .pi-card, .pi-layer, .g-drawer-backdrop) { animation: none; }
    html[data-ns-motion]:not(#ns-look) dialog[open]::backdrop { animation: none; }
}

/* 1.355 (saeed, 2026-11-09): the navy menu and the top bar a step smaller, to sit with the purchase invoice; the bar lower */
html:not(#ns-a) .ns-nav a, html:not(#ns-a) .ns-nav-group > summary { font-size: 13px; padding-block: 8px; }
html:not(#ns-a) .ns-nav-sub a { font-size: 12.5px !important; padding-block: 6px !important; }
html:not(#ns-a) .ns-nav a .icon, html:not(#ns-a) .ns-nav-group > summary .icon { width: 18px; height: 18px; }
html:not(#ns-a) body.ns-topnav .ns-topbar { padding-block: 5px; }
html:not(#ns-a) .ns-topnav-row > a, html:not(#ns-a) .ns-topnav-group > button { font-size: 12.5px; min-height: 30px; height: auto; padding-block: 4px; }
html:not(#ns-a) .ns-topnav-drop a { font-size: 12.5px; padding-block: 7px; }
html:not(#ns-a) body.ns-topnav .ns-topbar :is(.ns-help-link, .ns-theme, .ns-lang, .ns-user) { transform: scale(.85); }
