:root{--navy:#172B46;--navy2:#24406a;--bg:#f3f5f9;--card:#fff;--line:#d9dfe8;--text:#1c2430;--mute:#66707f;--red:#c62828;--green:#1b7a43;--amber:#a15c00;--zebra:#f4f7fb}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Microsoft YaHei",sans-serif}
a{color:var(--navy2)}
header.top{background:var(--navy);color:#fff}
.top .in{max-width:1180px;margin:0 auto;padding:12px 16px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.brand{font:700 20px Cambria,Georgia,serif;color:#fff;text-decoration:none;letter-spacing:.3px;margin-right:auto}
.top nav a{color:#dfe6f1;text-decoration:none;margin-right:14px;font-size:15px}
.top nav a:hover,.top nav a.on{color:#fff;text-decoration:underline}
.langs a{color:#b9c6da;text-decoration:none;font-size:13px;padding:3px 7px;border-radius:4px}
.langs a.on{background:#fff;color:var(--navy);font-weight:700}
main{max-width:1180px;margin:0 auto;padding:20px 16px 60px}
h1{font:700 26px Cambria,Georgia,serif;color:var(--navy);margin:4px 0 14px}
h2{font:700 19px Cambria,Georgia,serif;color:var(--navy);margin:0 0 10px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:18px;margin-bottom:18px}
.card.staff{border-left:5px solid var(--navy)}
.hint{color:var(--mute);font-size:14px;margin:0 0 12px}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.row>*{flex:1 1 150px}
.row>.fix{flex:0 0 auto}
label{display:block;font-size:13px;color:var(--mute);margin-bottom:3px}
input,select,textarea{width:100%;padding:9px 10px;border:1px solid #c3cbd8;border-radius:7px;font:inherit;background:#fff;color:var(--text)}
textarea{min-height:70px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid #9db4d6;border-color:var(--navy2)}
td input,td select{padding:6px 7px;font-size:14px;min-width:70px}
td input.n{width:86px;text-align:right}
.btn{display:inline-block;background:var(--navy);color:#fff;border:0;border-radius:7px;padding:10px 16px;font:600 15px inherit;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn:hover{background:var(--navy2)}
.btn.sec{background:#fff;color:var(--navy);border:1px solid var(--navy)}
.btn.go{background:var(--green)}
.btn.danger{background:#fff;color:var(--red);border:1px solid var(--red)}
.btn.small{padding:6px 10px;font-size:13px}
.btn.viber{background:#7360f2}
table{width:100%;border-collapse:collapse}
th{background:var(--navy);color:#fff;text-align:left;font-size:13px;font-weight:600;padding:9px 8px;white-space:nowrap}
td{padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:15px}
tbody tr:nth-child(even) td{background:var(--zebra)}
td.r,th.r{text-align:right}
.scroll{overflow-x:auto}
.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:13px;font-weight:600;background:#e3e9f2;color:var(--navy);white-space:nowrap}
.badge.s-draft{background:#eee;color:#555}
.badge.s-submitted,.badge.s-inq_open{background:#fff0d6;color:var(--amber)}
.badge.s-bg_review{background:#e1ecff;color:#1d4d9c}
.badge.s-awaiting_payment{background:#ffe1e1;color:var(--red)}
.badge.s-paid,.badge.s-purchased,.badge.s-in_warehouse,.badge.s-shipped,.badge.s-inq_answered{background:#dff3e6;color:var(--green)}
.badge.s-arrived{background:var(--green);color:#fff}
.badge.s-cancelled,.badge.s-inq_closed{background:#ddd;color:#555}
.flash{padding:11px 14px;border-radius:8px;margin-bottom:12px;font-size:15px}
.flash.ok{background:#dff3e6;color:#12512c}
.flash.err{background:#ffe1e1;color:#8c1c1c}
.flash.warn{background:#fff0d6;color:#6b3d00}
.red{color:var(--red);font-weight:700}
.mute{color:var(--mute);font-size:13px}
.thumb{width:56px;height:56px;object-fit:cover;border-radius:6px;border:1px solid var(--line);display:block}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.tabs a{padding:8px 13px;border-radius:20px;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--text);font-size:14px}
.tabs a.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.tabs b{margin-left:5px}
.sum{max-width:460px;margin-left:auto}
.sum td{border:0;padding:5px 8px}
.sum tr td{background:none!important}
.sum tr.big td{background:var(--navy)!important;color:#fff;font-weight:700;font-size:17px}
.steps{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0 2px;padding:0;list-style:none}
.steps li{flex:1 1 110px;padding:8px 6px;text-align:center;font-size:12.5px;background:#e6eaf1;color:#7a8494;border-radius:6px}
.steps li.done{background:#cfe6d8;color:#12512c}
.steps li.now{background:var(--navy);color:#fff;font-weight:700}
.msg{padding:10px 12px;border-radius:8px;background:var(--zebra);margin-bottom:8px}
.msg.mine{background:#e1ecff}
.msg.int{background:#fff7e0;border:1px dashed #d8b25a}
.msg .who{font-size:12.5px;color:var(--mute);margin-bottom:2px}
.msg p{margin:0;white-space:pre-wrap;word-break:break-word}
.login{max-width:430px;margin:40px auto}
.login .card{padding:26px}
.tiers{font-size:13px;color:var(--mute)}
.tiers span{display:inline-block;margin-right:10px}
.credbox{background:#fff7e0;border:1px solid #d8b25a;border-radius:8px;padding:14px;margin-bottom:16px}
.credbox code{font-size:18px;background:#fff;padding:2px 8px;border-radius:4px;border:1px solid #d8b25a}
.inline{display:inline}
.linkcell{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
@media(max-width:640px){h1{font-size:22px}.card{padding:14px}td{font-size:14px}.sum{max-width:none}}
td input[name^="title_"]{min-width:220px}
td input[name="note"]{margin-top:5px}
.badge.src{background:#e9e4ff;color:#4a3aa8;font-size:11.5px;padding:2px 8px}

.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.chip{padding:8px 14px;border-radius:20px;background:#fff;border:1px solid var(--line);font:inherit;font-size:14px;cursor:pointer;color:var(--text)}
.chip.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.chip b{margin-left:4px;opacity:.8}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.pcard{position:relative;display:flex;flex-direction:column;padding:0;border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden;cursor:pointer;font:inherit;text-align:left}
.pcard:hover{border-color:var(--navy);box-shadow:0 2px 10px rgba(23,43,70,.15)}
.pcard img,.pcard .noimg{width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff;display:flex;align-items:center;justify-content:center;color:var(--mute)}
.pc-cap{padding:7px 9px;font-size:12.5px;color:var(--mute);border-top:1px solid var(--line);min-height:32px}
.pc-ok{position:absolute;top:6px;right:6px;background:var(--green);color:#fff;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-weight:700}
.pc-ok[hidden]{display:none}
.pcard.incart{border-color:var(--green)}
dialog#pdlg{border:0;border-radius:12px;padding:20px;width:min(640px,94vw);max-height:90vh;overflow:auto}
dialog#pdlg::backdrop{background:rgba(15,25,40,.55)}
.pd-head{display:flex;gap:14px;align-items:flex-start;margin-bottom:12px}
.pd-head img{width:180px;height:180px;object-fit:contain;border:1px solid var(--line);border-radius:8px;flex:0 0 auto}
.pv{display:grid;grid-template-columns:44px 1fr auto 90px;gap:10px;align-items:center;padding:7px 0;border-top:1px solid var(--line)}
.pv img{width:44px;height:44px;object-fit:cover;border-radius:6px;border:1px solid var(--line);cursor:pointer}
.pv-l{font-size:15px;word-break:break-word}
.pv-p{font-size:14px;color:var(--mute);white-space:nowrap}
.pv input{text-align:right}
.cartbtn{position:fixed;right:18px;bottom:18px;background:var(--green);color:#fff;text-decoration:none;padding:12px 18px;border-radius:30px;font-weight:700;box-shadow:0 4px 14px rgba(0,0,0,.25);z-index:5}
.cartbtn b{background:#fff;color:var(--green);border-radius:12px;padding:1px 8px;margin:0 4px}
@media(max-width:640px){.grid{grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:8px}.pd-head img{width:110px;height:110px}.pv{grid-template-columns:36px 1fr auto 70px}}

.pen{background:none;border:0;color:var(--navy2);cursor:pointer;font:inherit;font-size:13px;padding:2px 4px;text-decoration:underline}
.pen:hover{color:var(--green)}
.pv{grid-template-columns:44px 1fr 110px 120px 80px}
.pv input:not(.n){text-align:left;padding:6px 7px;font-size:14px}
.pv-h{border-top:0;font-size:12.5px;color:var(--mute);padding-bottom:2px}
.pv-h div:nth-child(4),.pv-h div:nth-child(5){text-align:right}
.pv-p{text-align:right}
#pd_link{margin-right:10px}
.btn[disabled]{opacity:.4;cursor:not-allowed}
@media(max-width:640px){.pv{grid-template-columns:36px 1fr 70px 92px 62px;gap:6px}}

.pc-dead{position:absolute;left:0;right:0;top:0;background:var(--red);color:#fff;font-size:12px;font-weight:700;padding:4px 6px;text-align:center}
.pc-dead[hidden]{display:none}
.pcard.isdead img{opacity:.55}
.chip.dead{border-color:var(--red);color:var(--red)}
.chip.dead.on{background:var(--red);color:#fff}

.pc-ok{position:absolute;left:0;right:0;top:auto;bottom:32px;width:auto;height:auto;border-radius:0;background:var(--green);color:#fff;font-size:12.5px;font-weight:700;padding:5px 6px;text-align:center;display:block}
.pc-ok[hidden]{display:none}
.pcard.incart{border:2px solid var(--green)}
.pcard.incart img{opacity:.6}

.live{font-size:13px;color:var(--mute);margin-top:3px}
.live.diff{color:var(--amber);font-weight:700}
.livebar{background:#eef5ff;border:1px solid #cfe0f7;border-radius:8px;padding:7px 10px;font-size:14px;margin:0 0 8px;white-space:pre-wrap}
.pv-p.red{color:var(--red)}

.cobox{border-left:5px solid var(--navy)}
.cobox h2{display:flex;align-items:center;gap:10px;margin-top:0}
.cobox.new{border-left:5px dashed var(--line);background:#fafbfd}
.cobox.new h2{color:var(--mute)}
.conum{display:inline-flex;width:28px;height:28px;border-radius:50%;background:var(--navy);color:#fff;align-items:center;justify-content:center;font-size:15px}
.facts{display:flex;flex-wrap:wrap;gap:10px 34px}
.facts div{display:flex;flex-direction:column}
.facts span{font-size:13px;color:var(--mute)}
.facts b{font-size:17px}
.chk{display:block;font-weight:400;margin:4px 0}
.chk input{width:auto;margin-right:6px}
.bal{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:22px}
.bal-top{display:flex;justify-content:space-between;align-items:center;background:var(--navy);color:#fff;font-weight:700;font-size:19px;padding:13px 16px;border-radius:6px;margin-bottom:14px}
.bal-top.credit{background:var(--green)}
.bal-h{background:#F1F4F8;padding:8px 12px;margin:20px 0 0;font-size:16px;border-radius:4px}
.bal table td{font-size:15px}
.bal tr.sub td{font-weight:700;background:#F1F4F8!important;border-top:2px solid var(--line)}
.bal-end{margin-top:22px;max-width:520px;margin-left:auto}
.bal-end td{font-weight:700;font-size:16px;background:none!important}
.bal-end tr.owes td{background:#FF0000!important;color:#fff;font-size:18px}
.bal-end tr.ok td{background:var(--green)!important;color:#fff;font-size:18px}

.paybox{border-left:5px solid var(--green);background:#f3faf5}
.chk.big{font-size:16px;margin:8px 0}
.upbox{background:#fafbfd;border:1px dashed var(--line);border-radius:8px;padding:12px;margin-bottom:14px}
dialog#pfdlg,dialog#pfdone{max-width:560px}

.delbox{border-left:5px solid var(--red);background:#fff6f6}
.dot{display:inline-block;min-width:20px;padding:1px 6px;border-radius:10px;background:#FF3B30;color:#fff;font-size:12px;text-align:center}

.asbar{background:#FFE9A8;color:#5a4300;text-align:center;padding:8px 12px;font-weight:700}
.asbar .btn{margin-left:10px}
.wc{display:flex;gap:6px;align-items:center;margin-top:4px}
.wc input{max-width:170px;font-size:13px;padding:4px 6px}

.qrthumb{width:38px;height:38px;object-fit:cover;border:1px solid var(--line);border-radius:5px;vertical-align:middle}
.qrup{cursor:pointer}
.wc input.staffonly{background:#fff8e1}

.upbar{position:relative;height:28px;background:#e6eaf1;border-radius:6px;margin:0 0 14px;overflow:hidden}
.upbar div{position:absolute;left:0;top:0;bottom:0;width:0;background:#bfe3cb;transition:width .2s}
.upbar span{position:relative;display:block;line-height:28px;padding:0 10px;font-size:14px;font-weight:600}

td.lcol{font-size:13px;white-space:nowrap;max-width:230px;overflow:hidden;text-overflow:ellipsis}

.chatcard .msg{max-width:78%;margin:6px 0;padding:8px 12px;border-radius:10px;background:#F1F4F8}
.chatcard .msg.mine{margin-left:auto;background:#e3efff}
.chatcard .msg.int{background:#fff8e1}
.chatcard .msg.fresh{outline:2px solid #FF3B30}
.chatcard .msg-h{font-size:13px;color:var(--mute);margin-bottom:2px}

td.lcol{white-space:normal;max-width:260px;min-width:170px}
.sup{display:flex;gap:6px;align-items:flex-start;margin-top:4px;font-size:13px;line-height:1.35}
.supsel{font-size:12px;padding:3px 4px;margin-top:4px;max-width:200px}
.supbox{border-top:1px solid var(--line);padding:8px 0}
.supbox summary{cursor:pointer;font-size:15px}
.supbox.new summary{color:var(--mute);font-weight:700}
.supbox form{margin-top:10px}
.supitems{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:0 12px;max-height:240px;overflow:auto;border:1px solid var(--line);border-radius:6px;padding:6px 10px}

td.nw{white-space:nowrap}

/* --- цял екран, нагласяеми колони, удобен мобилен изглед --- */
.top .in,main{max-width:none}
main{padding:20px 22px 60px}
.scroll th{resize:horizontal;overflow:hidden;min-width:44px}     /* хваща се долният десен ъгъл на заглавието и колоната се разтяга */
.scroll th.r{text-align:right}
@media(max-width:760px){
  main{padding:14px 10px 60px}
  .top .in{padding:10px}
  .top nav{order:3;width:100%;overflow-x:auto;white-space:nowrap;padding-bottom:2px}
  .top nav a{margin-right:16px;font-size:16px}
  input,select,textarea,button{font-size:16px}                    /* телефонът да не приближава екрана при писане */
  table.cards,table.cards tbody,table.cards tr,table.cards td{display:block}
  table.cards thead{display:none}
  table.cards tr{border:1px solid var(--line);border-radius:10px;margin:0 0 12px;padding:8px 10px;background:#fff}
  table.cards tbody tr:nth-child(even) td{background:none}
  table.cards td{border:0;padding:5px 0;text-align:left!important;display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:10px;row-gap:0;align-items:start;justify-items:start;white-space:normal!important;max-width:none!important;min-width:0!important;font-size:15px}
  table.cards td::before{content:attr(data-label);grid-column:1;grid-row:1 / span 30;font-size:12px;color:var(--mute);font-weight:600;padding-top:3px}
  table.cards td>*{grid-column:2;margin-bottom:4px}
  table.cards td input:not([type=file]):not([type=checkbox]),table.cards td select{width:100%}
  table.cards td .wc{width:100%}
  table.cards td .wc input{max-width:none}
  table.cards td input.n{max-width:160px;text-align:left}
  table.cards td:empty{display:none}
  table.cards td>*{min-width:0}
  table.cards td input,table.cards td select{max-width:100%}
  table.cards .thumb{width:96px;height:96px}
  table.cards td.lcol .sup{font-size:14px}
  .cartbtn{right:10px;bottom:10px}
  dialog{width:calc(100vw - 20px);max-width:none}
  .chatcard .msg{max-width:92%}
  .bal{padding:12px}
  .bal-end{max-width:none}
}

/* --- меню горе, футър долу, начална страница, календар --- */
.top .out{color:#b9c6da;text-decoration:none;font-size:13px;margin-left:auto;white-space:nowrap}
.top .out:hover{color:#fff;text-decoration:underline}
body{min-height:100vh;display:flex;flex-direction:column}
main{flex:1 0 auto;width:100%}
footer.foot{background:var(--navy);color:#c9d3e2;font-size:14px}
.foot .in{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:10px 40px;padding:26px 22px 18px}
.foot .fc{display:flex;flex-direction:column;gap:6px;align-items:flex-start;min-width:0}
.foot .fc>b{color:#fff;font-size:13px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:4px}
.foot .fc>b.fbrand{font:700 19px Cambria,Georgia,serif;letter-spacing:0;text-transform:none}
.foot p{margin:0;max-width:440px}
.foot p span{display:block;font-size:12px;color:#8fa0b9}
.foot a{color:#dfe6f1;text-decoration:none}
.foot a:hover{color:#fff;text-decoration:underline}
.foot .langs{grid-column:1 / -1;border-top:1px solid #2b4366;padding-top:12px;font-size:13px;color:#8fa0b9}
.home{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start}
.home-main,.home-side{min-width:0}
.ratev{font-size:20px;color:var(--navy);margin-bottom:6px}
.ratev b{font-size:26px}
.ratebox .hint{margin:0;font-size:13px}
.wn{margin:0;padding-left:18px}.wn li{margin:5px 0}
.nw{border-top:1px solid var(--line);padding:10px 0}.nw:first-of-type{border-top:0;padding-top:0}
.nw p{margin:4px 0 0;font-size:14px;color:#3a4453}
.nw-d{font-size:12px;color:var(--mute)}
.holbar{background:#E3F4E8;border:1px solid #9fd0ae;color:#14532d;border-radius:10px;padding:10px 14px;margin-bottom:16px}
.cal{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-bottom:18px}
.cal .mo{margin:0;padding:12px}
.cal table{width:100%;border-collapse:separate;border-spacing:3px}
.cal td{text-align:center;padding:5px 0;border:0;border-radius:5px;font-size:14px;background:none!important}
.cal td.we{color:var(--mute)}
.cal td.k-cn,.legend i.k-cn{background:#2e9e5b!important;color:#fff}
.cal td.k-bg,.legend i.k-bg{background:#d0342c!important;color:#fff}
.cal td.k-both,.legend i.k-both{background:linear-gradient(135deg,#2e9e5b 50%,#d0342c 50%)!important;color:#fff}
.cal td.k-work,.legend i.k-work{background:#fff!important;box-shadow:inset 0 0 0 2px #2e9e5b}
.cal td.today{outline:2px solid var(--navy);outline-offset:1px;font-weight:700}
.legend{display:flex;gap:6px 18px;flex-wrap:wrap;margin-bottom:14px;font-size:14px}
.legend i{display:inline-block;width:16px;height:16px;border-radius:4px;vertical-align:-3px;margin-right:6px}
td .legend{display:inline;margin:0}
@media(max-width:900px){.home{grid-template-columns:1fr}}
@media(max-width:760px){.foot .in{grid-template-columns:1fr;padding:20px 14px 14px}.top .out{margin-left:0}}
.supgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px}
.supgrid>div{min-width:0}
.supgrid>div+div{border-left:1px solid var(--line);padding-left:22px;max-height:420px;overflow:auto}
.suphead{display:flex;gap:12px;align-items:flex-start}
.supimg{width:120px;height:80px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.supit{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--line);font-size:14px;word-break:break-word}
.supit:first-of-type{border-top:0}
.chatnew textarea{min-height:42px}
@media(max-width:760px){.supgrid{grid-template-columns:1fr}.supgrid>div+div{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:12px}}