* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    list-style: none;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.9rem;
}

span.large-font {
    font-size: 1.2rem;
}

ul.errorlist li,
ul.messages li.error, span.error {
    color: red;
    font-size: larger;
}

main.content {
    display: flex;
    width: 100vw;
    height: 100vh;
    overflow: clip;
}

div.left-sidebar {
    white-space: nowrap;
    background-color: lightgrey;
    padding: 1rem;
}

div.left-sidebar li {
    margin-bottom: 0.2rem;
}

div.left-sidebar li:hover {
    background-color: darkgrey;
}

.main-content {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 90%;
    padding: 1rem;
}

.list-container {
    overflow: auto;
}

ul.page-menu {
    gap: 10px 5px;             /* Расстояние между кнопками */
    display: flex;
    align-items: center;
    justify-content: start;
}

ul.multiple-rows-flex {
    flex-wrap: wrap;       /* Разрешаем перенос на новые строки */
}

ul.page-menu * {
    margin-right: 0;
}

.page-menu-active {
    white-space: nowrap;
    padding: 5px;
    background-color: lightgrey;
    border: 1px solid darkgrey;
}

.page-menu-link {
    white-space: nowrap;      /* Сбрасываем запрет переноса для самих li */
    text-decoration: none;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    padding: 5px;
    background-color:  var(--bg-color, darkgrey);
    border: 1px solid black;
    border-radius: 2px;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
}

.page-menu-link:hover {
    background-color: dimgrey;
    border: 1px solid dimgrey;
}

.warning {
    --bg-color: darkorange;
}

.green {
    --bg-color: darkgreen;
}

.form-row {
    display: flex;
    flex-direction: row;
}

.form-table th {
    width: 600px;
    text-align: right;
}

.form-table.left-head th {
    text-align: left;
    width: auto; /* Сбрасываем жесткую ширину 600px в авторежим */
}

.form-table th input,
.form-table td input {
    padding: 6px;
    border-radius: 4px;
}

input[type='submit'],
input[type='button'],
input[type='date'],
button {
    text-decoration: none;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    padding: 5px;
    background-color: darkgrey;
    border: 1px solid black;
    border-radius: 2px;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
    display: inline-block; /* Make button behave like an inline element */
    line-height: normal; /* Reset line-height */
    height: auto; /* Ensure height is auto */
}

input[type='submit']:hover,
input[type='button']:hover,
input[type='date']:hover,
button:hover {
    background-color: rgb(143, 143, 143);
}

button.pressed:active {
    transform: translateY(2px); /* Shift down slightly */
    box-shadow: 0 2px rgba(0, 0, 0, 0.5); /* Reduce shadow to simulate being pressed in */
    background-color: rgb(57, 109, 70);
}

button.seller-id-button {
        min-width: 113px; /* Set a minimum width */
        min-height: 42px;
}

button.cancel {
    background-color: darkorange;
    border: 1px solid black;
}

button:disabled {
    background-color: lightgray;
    color: darkgray;
}

button:disabled:hover {
    background-color: lightgray;
    color: darkgray;
}

.checkbox-button {
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    padding: 5px;
    background-color: darkgrey;
    border: 1px solid black;
    border-radius: 2px;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
}

.checkbox-button input[type='checkbox'] {
    display: none;
}

.checkbox-button.blocked {
    background-color: lightgrey;
    border: 1px solid darkgrey;
    color: white; /* Text color when checked */
}


input[type='number'].per-package {
    width: 2rem;
}

input[type=text],
input[type=search],
input[type=password],
select {
    padding: 5px;
}

.perpackage {
    padding: 5px 9px;
    background-color: red;
    color: white;
    border: solid 2px red;
    border-radius: 3px
}

table {
    width: 100%;
    border-collapse: collapse;
    overflow-y: auto;
}

table.wide {
    overflow-x: auto;
}

table.profit {
    width: auto;
}

thead {
    border-bottom: 1px solid black;
}

thead th {
    text-wrap: wrap;
    padding: 10px;
    vertical-align: bottom;
    text-align: left;
}

tbody td {
    text-wrap-mode: nowrap;
    padding: 10px;
    border-bottom: 1px solid black;
}

tbody td.wrap {
    text-wrap-mode: wrap;
}

tbody th {
    border-bottom: 1px solid black;
}

tbody tr.available {
    background: lightgreen;
    color: black;
}

tbody tr.zero {
    background: orange;
    color: black;
}

tbody tr.comment {
    background: violet;
    color: black;
}

tbody tr.ordered {
    background: lightskyblue;
    color: black;
}

#modal {
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-color:rgba(100, 100, 100, 0.7);
    z-index:1000;
}

#modal > div{
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    background:white;
    padding:20px;
    border-radius:10px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
    max-width: 90vw; /* Max width of modal */
    max-height: 90vh; /* Max height of modal */
    overflow-y: auto; /* Enable vertical scrolling if content overflows */
}

#iframe {
    width: 100%; /* Full width */
    height: 60vh; /* Adjust height as needed */
    border: none; /* Remove default border */
}

.settings-page { max-width: 1180px; padding: 12px 18px 40px; }
.settings-heading { margin-bottom: 22px; }
.settings-heading h1 { margin-bottom: 6px; }
.settings-heading p, .settings-card p { color: #667085; line-height: 1.5; }
.settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.settings-card { display: grid; align-content: start; gap: 10px; padding: 20px; border: 1px solid #dfe3e8; border-radius: 12px; background: #fff; box-shadow: 0 3px 12px rgba(15, 23, 42, .05); }
.settings-card h2, .settings-card p { margin: 0; }
.settings-card a { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 8px; background: #f5f7fa; color: #14324a; font-weight: 700; text-decoration: none; }
.settings-card a:hover { background: #e8eef5; }
.settings-card a span { min-width: 24px; text-align: center; color: #667085; }
:root{--bg:#f4f4f3;--panel:#fff;--ink:#111;--muted:#6f6f6f;--line:#dededb;--strong:#c9c9c5;--dark:#141414;--red:#d92d20;--side:252px;--radius:12px}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.4 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:-.005em}a{color:inherit}button,input,select,textarea{font:inherit}.app-shell{min-height:100vh;display:grid;grid-template-columns:var(--side) minmax(0,1fr);grid-template-rows:76px minmax(0,1fr)}
.section-nav{grid-column:1;grid-row:1/3;position:sticky;top:0;height:100vh;z-index:40;overflow:auto;background:var(--dark);color:#fff}.section-nav-inner{min-height:100%;display:flex;flex-direction:column;gap:7px;padding:20px 14px 14px}.sidebar-brand{display:flex;align-items:center;gap:11px;padding:0 8px 20px;margin-bottom:4px;border-bottom:1px solid #303030;text-decoration:none}.sidebar-brand-mark{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:10px;background:#fff;color:#111;font-size:12px;font-weight:900}.sidebar-brand-copy strong,.sidebar-brand-copy small{display:block}.sidebar-brand-copy small{margin-top:2px;color:#858585;font-size:11px}.sidebar-label{padding:10px 10px 4px;color:#747474;font-size:10px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.section-nav nav{display:grid;gap:5px}.nav-step{min-height:48px;display:grid;grid-template-columns:32px 1fr;align-items:center;gap:10px;padding:7px 9px;border:1px solid transparent;border-radius:9px;color:#bcbcbc;text-decoration:none;transition:.15s}.nav-step:hover{background:#202020;color:#fff;border-color:#292929}.nav-step.is-active{background:#fff;color:#111;box-shadow:0 8px 24px rgba(0,0,0,.22)}.nav-step.is-disabled{opacity:.42}.nav-step-number{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#282828;color:#cfcfcf;font-size:9px;font-weight:850}.nav-step.is-active .nav-step-number{background:#111;color:#fff}.nav-step-copy strong,.nav-step-copy small{display:block}.nav-step-copy strong{font-size:12px}.nav-step-copy small{color:#747474;font-size:10px}.nav-more summary{padding:9px 11px;color:#999;font-size:11px;cursor:pointer}.nav-more-list{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:4px}.nav-more-list a{padding:7px;border-radius:7px;color:#aaa;font-size:10px;text-decoration:none}.nav-more-list a:hover{background:#242424;color:#fff}.sidebar-account{margin-top:auto;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:9px;padding:12px 7px 2px;border-top:1px solid #2b2b2b}.user-avatar{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#292929;font-weight:800}.sidebar-account-copy{min-width:0}.sidebar-account-copy strong,.sidebar-account-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-account-copy strong{font-size:11px}.sidebar-account-copy small{color:#737373;font-size:9px}.sidebar-account form{margin:0}.sidebar-logout{width:32px;height:32px;border:0;border-radius:7px;background:transparent;color:#aaa;cursor:pointer}.sidebar-logout:hover{background:#292929;color:#fff}
.topbar{grid-column:2;grid-row:1;position:sticky;top:0;z-index:35;height:76px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 28px;background:rgba(255,255,255,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.page-identity span,.page-identity strong{display:block}.eyebrow{margin-bottom:3px;color:#888;font-size:9px;font-weight:750;letter-spacing:.1em;text-transform:uppercase}.page-identity strong{font-size:16px}.product-switcher{display:flex;gap:3px;padding:3px;border:1px solid var(--line);border-radius:9px;background:#f0f0ee}.product-switcher a{min-height:32px;display:flex;align-items:center;padding:0 12px;border-radius:6px;color:#707070;font-size:11px;font-weight:750;text-decoration:none}.product-switcher a.is-active{background:#171717;color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.18)}.mobile-menu{display:none}.main-content{grid-column:2;grid-row:2;min-width:0;padding:18px 28px 44px}.messages{display:grid;gap:8px;margin-bottom:12px}.message{padding:11px 13px;border:1px solid var(--line);border-radius:9px;background:#fff}.message.success{border-color:#b8ddc2;background:#f1faf3;color:#196b31}.message.error{border-color:#edc2be;background:#fff3f2;color:#a1261d}.message.warning{border-color:#ecd8ae;background:#fff9ec;color:#7c5913}
h1{font-size:24px;letter-spacing:-.03em}h2{font-size:20px}h3{font-size:17px}.page-menu{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 14px;padding:12px 14px;list-style:none;border:1px solid var(--line);border-radius:var(--radius);background:#fff}.page-menu li{margin:0}.page-menu form{display:flex;align-items:center;flex-wrap:wrap;gap:7px}.page-menu-link,.page-menu a,.page-menu button,.page-menu input[type=button],.page-menu input[type=submit],button[type=submit],input.submit{min-height:36px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;border:1px solid #cfcfcb;border-radius:8px;background:#fff;color:#202020;font-weight:700;text-decoration:none;cursor:pointer}.page-menu a:hover,.page-menu button:hover{background:#f1f1ef}.page-menu .pressed,.page-menu input[type=submit],input.submit{background:#171717;color:#fff;border-color:#171717}.page-menu .warning,.warning{color:#b42318;border-color:#e7b7b1;background:#fff7f6}.cancel{background:#fff!important;color:#444!important}
.list-container{max-width:100%;overflow:auto;border:1px solid var(--line);border-radius:var(--radius);background:#fff}table{width:100%;border-collapse:separate;border-spacing:0;background:#fff}th,td{padding:9px 10px;border-right:1px solid #ececea;border-bottom:1px solid #ececea;text-align:left;vertical-align:top}th:last-child,td:last-child{border-right:0}tr:last-child td{border-bottom:0}thead th{position:sticky;top:0;z-index:5;background:#f1f1ef;color:#4d4d4d;font-size:10px;font-weight:800}tbody tr:hover td{background:#fafaf9}.form-table th{width:min(32%,280px);color:#555}input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),select,textarea{max-width:100%;min-height:38px;padding:8px 10px;border:1px solid #d4d4d0;border-radius:8px;background:#fff;color:#111;outline:none}textarea{min-height:92px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:#111!important;box-shadow:0 0 0 3px rgba(0,0,0,.06)}input[type=checkbox],input[type=radio]{accent-color:#171717}ul.errorlist{margin:4px 0;padding:0;list-style:none;color:#b42318;font-size:11px}.helptext{display:block;color:var(--muted);font-size:10px}.modal{border-radius:14px!important;box-shadow:0 24px 80px rgba(0,0,0,.22)!important}
.app-shell--guest{display:block}.app-shell--guest .topbar{position:static}.app-shell--guest .main-content{max-width:520px;margin:48px auto;padding:0 20px}.app-shell--guest .page-surface{padding:28px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 12px 40px rgba(0,0,0,.07)}
@media(max-width:1100px){:root{--side:82px}.section-nav-inner{padding:14px 8px}.sidebar-brand{justify-content:center}.sidebar-brand-copy,.sidebar-label,.nav-step-copy,.sidebar-account-copy,.nav-more summary{display:none}.nav-step{grid-template-columns:1fr;justify-items:center}.nav-more-list{grid-template-columns:1fr}.sidebar-account{grid-template-columns:1fr;justify-items:center}.topbar{padding:0 18px}.main-content{padding:14px 18px 36px}}
@media(max-width:760px){.app-shell{display:block}.section-nav{position:fixed;inset:0 auto 0 0;width:min(300px,86vw);height:100dvh;z-index:80;transform:translateX(-105%);transition:transform .2s;box-shadow:16px 0 50px rgba(0,0,0,.25)}.section-nav.is-open{transform:none}.sidebar-brand{justify-content:flex-start}.sidebar-brand-copy,.sidebar-label,.nav-step-copy,.sidebar-account-copy,.nav-more summary{display:block}.nav-step{grid-template-columns:32px 1fr;justify-items:stretch}.nav-more-list{grid-template-columns:1fr 1fr}.sidebar-account{grid-template-columns:34px 1fr auto;justify-items:stretch}.topbar{height:auto;min-height:68px;padding:9px 10px}.mobile-menu{display:inline-flex;min-height:34px;align-items:center;padding:0 10px;border:1px solid #d1d1ce;border-radius:7px;background:#fff;font-size:11px;font-weight:750}.page-identity{display:none}.product-switcher{margin-left:auto}.product-switcher a{padding:0 9px}.main-content{padding:12px 10px 32px}.list-container{border-radius:9px}.app-shell--guest .page-identity{display:block}.app-shell--guest .main-content{margin:24px auto}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Stockman semantic compatibility layer. These colors encode operational state. */
.product-switcher span{min-height:32px;display:flex;align-items:center;padding:0 12px;border-radius:6px;color:#9a9a9a;font-size:11px;font-weight:750}.product-switcher .is-disabled{cursor:not-allowed;opacity:.72}
.page-menu-active{min-height:36px;display:inline-flex;align-items:center;padding:0 12px;border-radius:8px;background:#171717;color:#fff;font-weight:750}
.page-menu-link.green{border-color:#8bc89b;background:#edf9f0;color:#176b31}.page-menu-link.green:hover{background:#ddf3e3}
.checkbox-button{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border:1px solid #cfcfcb;border-radius:8px;background:#fff;box-shadow:none;font-weight:700;cursor:pointer}.checkbox-button.blocked{border-color:#e4b3ae;background:#fff0ef;color:#9e251c}
.perpackage{display:inline-flex;align-items:center;padding:4px 8px;border:1px solid #c61f1f;border-radius:6px;background:#d92d20;color:#fff;font-weight:850}
tbody tr.available>td{background:#e6f7e9!important;color:#164c25}tbody tr.available:hover>td{background:#d8f0dd!important}
tbody tr.zero>td{background:#fff0d5!important;color:#70480c}tbody tr.zero:hover>td{background:#ffe7bb!important}
tbody tr.comment>td{background:#f5e7f7!important;color:#64306c}tbody tr.comment:hover>td{background:#edd8f0!important}
tbody tr.ordered>td{background:#e3f3fb!important;color:#194f69}tbody tr.ordered:hover>td{background:#d3ebf7!important}
button.seller-id-button,.print-sticker{min-width:96px;min-height:34px;border:1px solid #cfcfcb;border-radius:7px;background:#fff;box-shadow:none;font-weight:700;cursor:pointer}button.seller-id-button:hover,.print-sticker:hover{background:#f1f1ef}
button.pressed:active{transform:translateY(1px);box-shadow:none;background:#0f0f0f}.large-font{font-size:1.15rem;font-weight:750}.text-muted{color:#929292}.profit{padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#fff}.wide{min-width:max-content}.wrap{white-space:normal!important}
#modal{background:rgba(0,0,0,.46);backdrop-filter:blur(2px)}#modal>div{border:1px solid #d9d9d5;border-radius:14px;box-shadow:0 24px 80px rgba(0,0,0,.24)}
@media(max-width:760px){.product-switcher span{padding:0 9px}.profit{width:100%;overflow:auto}}
