/* PixelPlus POS Full — styles for the ERP screens (uses the app's colour tokens). */
.erp-menu .erp-group{cursor:pointer; display:flex; align-items:center; justify-content:space-between; user-select:none;}
.erp-menu .erp-group:hover{color:var(--ink);}
.erp-caret{font-size:10px; transition:transform .15s;}
.erp-menu.collapsed .erp-caret{transform:rotate(-90deg);}
.erp-menu.collapsed button{display:none;}
.erp-view{padding:20px 26px;}
.erp-help-line{font-size:12.5px; color:var(--muted); margin:-6px 0 14px; max-width:900px; line-height:1.5;}
.erp-muted{color:var(--muted);}
.erp-table-wrap{overflow-x:auto;}
.erp-table tbody tr.erp-row{cursor:pointer;}
.erp-table td.erp-open{color:var(--muted); width:20px; text-align:right;}
.erp-table th.num-h, .erp-mini th.num-h{text-align:right;}
.erp-table td.num, .erp-mini td.num{text-align:right; font-variant-numeric:tabular-nums;}
.erp-list-foot{display:flex; align-items:center; gap:10px; font-size:12px; color:var(--muted); padding:10px 2px;}
.erp-chk{display:inline-flex !important; align-items:center; gap:6px; font-size:12.5px; font-weight:500 !important; color:var(--ink) !important; cursor:pointer;}
.erp-chk input{width:auto !important; margin:0;}
.erp-swatch{display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:6px; vertical-align:-1px; border:1px solid var(--line);}

.modal.erp-modal-wide{width:min(980px, 96vw);}
.modal.erp-modal-mid{width:min(620px, 96vw);}
.erp-detail-head{display:flex; align-items:center; gap:10px; margin-bottom:12px;}
.erp-detail-head h3{margin:0 !important;}
.erp-dgrid{display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:10px 18px; background:var(--surface-alt); border:1px solid var(--line); border-radius:10px; padding:12px 14px;}
.erp-dfield label{display:block; font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:700; margin-bottom:3px;}
.erp-dfield > div{font-size:13px; word-break:break-word;}
.erp-dfield.full{grid-column:1 / -1;}
.erp-meta{font-size:11.5px; color:var(--muted); margin:8px 0 0;}
.erp-child{margin-top:14px;}
.erp-child h4, .erp-attach h4, .erp-notes h4, .erp-child-edit h4, .erp-detail-extra h4{font-size:13px; margin:0 0 6px;}
table.erp-mini{font-size:12px; border-radius:8px;}
table.erp-mini thead th{padding:7px 9px; font-size:10px;}
table.erp-mini tbody td, table.erp-mini tfoot td{padding:6px 9px; font-size:12.5px;}
table.erp-mini tfoot td{font-weight:700; border-top:2px solid var(--line); background:var(--surface-alt);}
.erp-actions{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px;}
.erp-btn{padding:9px 14px; border-radius:9px; border:1px solid var(--line); background:var(--surface); color:var(--ink); font-weight:700; font-size:12.5px; cursor:pointer;}
.erp-btn:hover{background:var(--surface-alt);}
.erp-btn.primary{background:var(--orange); border-color:var(--orange); color:#1f2a30;}
.erp-btn.danger{color:var(--danger); border-color:var(--danger);}
.erp-btn[disabled]{opacity:.5; pointer-events:none;}

.erp-form-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:0 16px;}
.erp-form-grid .field.full{grid-column:1 / -1;}
.erp-form-group{grid-column:1 / -1; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:var(--blue-deep); margin:6px 0 8px; padding-bottom:4px; border-bottom:1px solid var(--line);}
.erp-fld input[type=text], .erp-fld input[type=number], .erp-fld input[type=email], .erp-fld input[type=date], .erp-fld input[type=datetime-local], .erp-fld input[type=time], .erp-fld input[type=password], .erp-fld select, .erp-fld textarea{width:100%; padding:9px 10px; border:1px solid var(--line); border-radius:8px; font-size:13px; background:var(--bg); font-family:inherit;}
.erp-fld input:focus, .erp-fld select:focus, .erp-fld textarea:focus{outline:none; border-color:var(--blue); background:var(--surface);}
.erp-fld input[type=color]{width:60px; height:36px; padding:2px; border:1px solid var(--line); border-radius:8px; background:var(--bg);}
.erp-req{color:var(--danger);}
.field-hint{font-size:11px; color:var(--muted); margin-top:4px; line-height:1.4;}

.erp-ref{position:relative; display:flex; align-items:center;}
.erp-ref .erp-ref-input{width:100%; padding:9px 26px 9px 10px; border:1px solid var(--line); border-radius:8px; font-size:13px; background:var(--bg);}
.erp-mini .erp-ref .erp-ref-input{padding:6px 8px; font-size:12px; min-width:170px;}
.erp-ref-clear{position:absolute; right:6px; border:none; background:none; color:var(--muted); cursor:pointer; font-size:15px;}
.erp-ref-list{position:absolute; top:100%; left:0; right:0; z-index:50; background:var(--surface); border:1px solid var(--line); border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.15); max-height:240px; overflow-y:auto; margin-top:2px; min-width:220px;}
.erp-ref-item{padding:8px 10px; font-size:12.5px; cursor:pointer;}
.erp-ref-item:hover, .erp-ref-item.active{background:var(--tint-info);}
.erp-ref-empty{padding:8px 10px; font-size:12px; color:var(--muted);}
.erp-chips{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px;}
.erp-chip{display:inline-flex; align-items:center; gap:4px; background:var(--tint-info); color:var(--blue-deep); border-radius:14px; padding:3px 4px 3px 10px; font-size:12px; font-weight:600;}
.erp-chip button{border:none; background:none; color:inherit; cursor:pointer; font-size:13px;}
.erp-caps{display:flex; flex-wrap:wrap; gap:8px 16px; border:1px solid var(--line); border-radius:8px; padding:10px; background:var(--bg);}
.erp-capgroup{border:1px solid var(--line); border-radius:8px; padding:6px 10px 8px; flex:1 1 260px; display:flex; flex-direction:column; gap:4px; background:var(--surface);}
.erp-capgroup legend{font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--blue-deep); padding:0 4px;}
.erp-capall{border:none; background:none; color:var(--muted); font-size:10.5px; text-decoration:underline; cursor:pointer;}
.erp-sig canvas{width:100%; max-width:520px; height:150px; border:1px dashed var(--muted); border-radius:8px; background:#fff; touch-action:none; display:block; margin-bottom:6px;}
.erp-sig-img{max-width:260px; max-height:90px; background:#fff; border:1px solid var(--line); border-radius:6px;}

.erp-child-edit{margin-top:12px; border-top:1px solid var(--line); padding-top:10px;}
.erp-lines{overflow-x:auto;}
table.erp-edit td{padding:4px 5px;}
table.erp-edit input, table.erp-edit select{width:100%; padding:6px 7px; border:1px solid var(--line); border-radius:6px; font-size:12px; background:var(--bg); min-width:70px;}
table.erp-edit input.erp-num{max-width:110px; text-align:right;}
table.erp-edit input[type=checkbox]{width:auto; min-width:0;}
.erp-rm{border:none; background:none; color:var(--danger); font-size:16px; cursor:pointer;}
.erp-calc{font-weight:600; white-space:nowrap;}
.erp-addline{margin-top:6px; padding:7px 12px !important; font-size:12px !important;}

.erp-attach, .erp-notes{margin-top:14px; border-top:1px solid var(--line); padding-top:10px;}
.erp-files{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:8px;}
.erp-file{position:relative; width:110px; border:1px solid var(--line); border-radius:8px; padding:6px; background:var(--surface-alt);}
.erp-file img{width:100%; height:70px; object-fit:cover; border-radius:5px; display:block;}
.erp-file-icon{display:flex; align-items:center; justify-content:center; height:70px; font-size:28px; text-decoration:none; background:var(--surface); border-radius:5px;}
.erp-file-name{font-size:10.5px; margin-top:4px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.erp-file-del{position:absolute; top:2px; right:2px; border:none; background:var(--surface); border-radius:50%; width:20px; height:20px; cursor:pointer; color:var(--danger);}
.erp-upload{display:flex; gap:6px; flex-wrap:wrap; align-items:center;}
.erp-upload input[type=text]{flex:1; min-width:200px; padding:8px 10px; border:1px solid var(--line); border-radius:8px; font-size:12.5px; background:var(--bg);}
.erp-upload input[type=file]{font-size:12px;}
.erp-note{background:var(--surface-alt); border:1px solid var(--line); border-radius:8px; padding:8px 10px; font-size:12.5px; margin-bottom:6px;}
.erp-note-add{display:flex; gap:6px; align-items:flex-start;}
.erp-note-add textarea{flex:1; padding:8px 10px; border:1px solid var(--line); border-radius:8px; font:inherit; font-size:12.5px; background:var(--bg);}

/* custom screens */
.erp-cards{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:12px;}
.erp-card{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:14px 16px;}
.erp-card h4{font-size:14px; margin:0 0 4px;}
.erp-card p{font-size:12px; color:var(--muted); line-height:1.45; margin:0;}
.erp-card.on{border-color:var(--orange); box-shadow:0 0 0 1px var(--orange) inset;}
.erp-toggle{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.erp-switch{position:relative; width:42px; height:24px; flex:0 0 42px;}
.erp-switch input{opacity:0; width:0; height:0;}
.erp-switch span{position:absolute; inset:0; background:var(--line); border-radius:24px; cursor:pointer; transition:.15s;}
.erp-switch span::before{content:''; position:absolute; width:18px; height:18px; left:3px; top:3px; background:#fff; border-radius:50%; transition:.15s;}
.erp-switch input:checked + span{background:var(--orange);}
.erp-switch input:checked + span::before{transform:translateX(18px);}
.erp-switch input:disabled + span{opacity:.6; cursor:not-allowed;}
.erp-section{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:16px 18px; margin-bottom:16px;}
.erp-section h3{font-family:'Space Grotesk',sans-serif; font-size:15px; margin:0 0 10px;}
.erp-tabs{display:flex; gap:4px; flex-wrap:wrap; margin-bottom:14px; border-bottom:1px solid var(--line);}
.erp-tabs button{border:none; background:none; padding:9px 14px; font-weight:700; font-size:12.5px; color:var(--muted); cursor:pointer; border-bottom:3px solid transparent; margin-bottom:-1px;}
.erp-tabs button.active{color:var(--ink); border-bottom-color:var(--orange);}
.erp-kanban{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(220px, 1fr); gap:12px; overflow-x:auto; padding-bottom:8px;}
.erp-kcol{background:var(--surface-alt); border:1px solid var(--line); border-radius:12px; padding:10px; min-height:200px;}
.erp-kcol h4{font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin:0 0 8px; display:flex; justify-content:space-between;}
.erp-kcard{background:var(--surface); border:1px solid var(--line); border-radius:9px; padding:9px 10px; margin-bottom:8px; cursor:pointer; font-size:12.5px;}
.erp-kcard:hover{border-color:var(--blue);}
.erp-kcard b{display:block; margin-bottom:2px;}
.erp-kcard small{color:var(--muted);}
.erp-kcol.drop{outline:2px dashed var(--orange);}
.erp-cal{display:grid; grid-template-columns:repeat(7, 1fr); gap:4px;}
.erp-cal .erp-cal-h{font-size:10.5px; font-weight:800; text-transform:uppercase; color:var(--muted); text-align:center; padding:4px;}
.erp-cal .erp-cal-d{min-height:92px; background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:4px 5px; font-size:11px; overflow:hidden;}
.erp-cal .erp-cal-d.other{opacity:.45;}
.erp-cal .erp-cal-d.today{border-color:var(--orange);}
.erp-cal .erp-cal-n{font-weight:800; font-size:11px; margin-bottom:3px;}
.erp-cal-ev{display:block; border-radius:5px; padding:2px 5px; margin-bottom:2px; font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; color:#fff; background:var(--blue-deep);}
.erp-gantt{overflow-x:auto; border:1px solid var(--line); border-radius:10px; background:var(--surface);}
.erp-gantt table{border:none; border-radius:0;}
.erp-gantt td.gcell{position:relative; padding:0 !important; height:34px; min-width:640px;}
.erp-gbar{position:absolute; top:6px; height:22px; border-radius:6px; background:var(--blue); color:#fff; font-size:10.5px; padding:3px 6px; overflow:hidden; white-space:nowrap; cursor:pointer;}
.erp-gbar.done{background:var(--good);} .erp-gbar.late{background:var(--danger);}
.erp-seatmap{display:inline-flex; flex-direction:column; gap:4px; padding:12px; background:var(--surface-alt); border-radius:10px; border:1px solid var(--line);}
.erp-seatrow{display:flex; gap:4px; align-items:center;}
.erp-seatrow .rl{width:22px; font-size:11px; font-weight:800; color:var(--muted);}
.erp-seat{width:26px; height:24px; border-radius:6px 6px 3px 3px; border:1px solid var(--line); background:var(--surface); font-size:9px; cursor:pointer; padding:0;}
.erp-seat.sold{background:var(--danger); color:#fff; border-color:var(--danger); cursor:not-allowed;}
.erp-seat.held{background:var(--orange); color:#1f2a30;}
.erp-seat.sel{background:var(--good); color:#fff; border-color:var(--good);}
.erp-seat.off{visibility:hidden;}
.erp-stage{text-align:center; font-size:11px; font-weight:800; letter-spacing:.2em; color:var(--muted); padding:6px; border:1px dashed var(--line); border-radius:6px; margin-bottom:6px;}
.erp-scan-result{border-radius:16px; padding:40px 20px; text-align:center; color:#fff; font-size:22px; font-weight:800; margin-top:14px;}
.erp-scan-result.ok{background:var(--good);} .erp-scan-result.bad{background:var(--danger);} .erp-scan-result.wait{background:var(--chrome);}
.erp-scan-result small{display:block; font-size:14px; font-weight:600; margin-top:6px; opacity:.9;}
.erp-scan-video{width:100%; max-width:420px; border-radius:12px; background:#000;}
.erp-pill{display:inline-block; padding:2px 8px; border-radius:10px; font-size:11px; font-weight:700; background:var(--surface-alt); border:1px solid var(--line);}
.erp-roster td{padding:6px !important; vertical-align:top;}
.erp-shift{display:block; background:var(--tint-info); color:var(--blue-deep); border-radius:6px; padding:3px 6px; font-size:11px; font-weight:700; margin-bottom:3px; cursor:pointer;}
.erp-add-shift{border:1px dashed var(--line); background:none; color:var(--muted); border-radius:6px; width:100%; font-size:11px; cursor:pointer; padding:2px;}
.erp-statement td{padding:6px 10px !important;}
.erp-statement tr.sum td{font-weight:800; border-top:2px solid var(--line);}
.erp-statement tr.head td{font-weight:800; background:var(--surface-alt); text-transform:uppercase; font-size:11px; letter-spacing:.05em;}
.erp-statement td.ind{padding-left:26px !important;}
.erp-flex{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.erp-grow{flex:1;}
.erp-split{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@media (max-width: 900px){ .erp-split{grid-template-columns:1fr;} }
.erp-big{font-family:'Space Grotesk',sans-serif; font-size:28px; font-weight:800;}
.erp-help-sec{margin-bottom:12px;}
.erp-help-sec h5{font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:var(--blue-deep); margin:0 0 4px;}
.erp-help-sec p, .erp-help-sec li{font-size:12.5px; line-height:1.5;}
.erp-help-sec ol, .erp-help-sec ul{padding-left:18px;}
.erp-kpi-row{display:grid; grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); gap:10px; margin-bottom:14px;}
.erp-kpi-row .stat-card small{display:block; font-size:11px; color:var(--muted); margin-top:3px;}
.erp-delta-up{color:var(--good); font-weight:700;} .erp-delta-down{color:var(--danger); font-weight:700;}
.erp-bars{display:flex; align-items:flex-end; gap:3px; height:120px; padding-top:6px;}
.erp-bars div{flex:1; background:var(--blue); border-radius:3px 3px 0 0; min-height:1px; position:relative;}
.erp-bars div:hover::after{content:attr(data-t); position:absolute; bottom:100%; left:50%; transform:translateX(-50%); background:var(--chrome); color:#fff; font-size:10px; padding:2px 5px; border-radius:4px; white-space:nowrap;}
.erp-bar-labels{display:flex; gap:3px; font-size:9px; color:var(--muted);}
.erp-bar-labels span{flex:1; text-align:center; overflow:hidden;}

/* till */
.erp-quickkeys{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px;}
.erp-quickkeys button{border:none; color:#fff; font-weight:800; font-size:13px; padding:12px 16px; border-radius:10px; cursor:pointer; min-width:96px; box-shadow:0 2px 0 rgba(0,0,0,.15);}
.erp-quickkeys button:active{transform:translateY(1px);}
.erp-cust-info{font-size:11.5px; color:var(--blue-deep); background:var(--tint-info); border-radius:8px; padding:6px 9px; margin-top:6px; line-height:1.5;}
.erp-cust-info a{color:inherit; font-weight:700;}
.erp-issued-wrap{margin:10px 0; text-align:left;}
.erp-issued{font-size:12.5px; background:var(--surface-alt); border:1px solid var(--line); border-radius:8px; padding:7px 10px; margin-bottom:6px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; color:var(--ink);}
.erp-issued .ghost-btn{padding:4px 10px; font-size:11.5px; margin-left:auto;}
.erp-pext{border-top:1px solid var(--line); margin-top:10px; padding-top:10px;}
.erp-pext summary{cursor:pointer; font-weight:800; font-size:12.5px; color:var(--blue-deep); margin-bottom:8px;}
.erp-pext .field-row{flex-wrap:wrap;}
.erp-pext .field{min-width:160px;}
.erp-pext input[type=text], .erp-pext input[type=number], .erp-pext select, .erp-pext textarea{width:100%; padding:9px 10px; border:1px solid var(--line); border-radius:8px; font-size:13px; background:var(--bg); font-family:inherit;}
.erp-dash{margin:6px 0 10px;}
.erp-dash-group h4{font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin:10px 0 6px;}
.erp-click{cursor:pointer;} .erp-click:hover{border-color:var(--blue);}
.stat-card.bad .stat-value{color:var(--danger);} .stat-card.warn .stat-value{color:var(--orange-deep);} .stat-card.good .stat-value{color:var(--good);}
.erp-help-drawer{position:fixed; top:0; right:0; bottom:0; width:min(420px,100vw); background:var(--card,#fff); border-left:1px solid var(--line); box-shadow:-8px 0 30px rgba(0,0,0,.15); z-index:9000; display:flex; flex-direction:column; transform:translateX(105%); transition:transform .2s ease;}
.erp-help-drawer.open{transform:none;}
.erp-hd-head{display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid var(--line); font-size:15px;}
.erp-hd-head button{background:none; border:0; font-size:24px; line-height:1; cursor:pointer; color:var(--muted);}
#erpHdBody{flex:1; overflow:auto; padding:6px 16px 12px; font-size:13px; line-height:1.55;}
.erp-help-sec h5{font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin:14px 0 6px;}
.erp-help-sec p{margin:0 0 6px;} .erp-help-sec ol, .erp-help-sec ul{margin:0; padding-left:20px;} .erp-help-sec li{margin-bottom:4px;}
.erp-help-sec dl{margin:0;} .erp-help-sec dt{font-weight:600; margin-top:6px;} .erp-help-sec dd{margin:0 0 2px; color:var(--muted);}
.erp-hd-ask{border-top:1px solid var(--line); padding:10px 12px; display:flex; flex-direction:column; gap:8px; max-height:45%;}
#erpHdChat{overflow:auto; display:flex; flex-direction:column; gap:6px;} #erpHdChat:empty{display:none;}
#erpHdQ{padding:9px 10px; border:1px solid var(--line); border-radius:8px; font-size:13px; background:var(--bg); font-family:inherit;}
.erp-help-btn{padding:6px 12px; font-size:12px; margin-left:auto;}
@media print{.erp-help-drawer,.erp-help-btn{display:none !important;}}

.erp-sales-person{display:flex; align-items:center; gap:8px; margin:6px 0 2px; font-size:12px; color:var(--muted);}
.erp-sales-person select{flex:1; padding:6px 8px; border:1px solid var(--line); border-radius:8px; font-size:12.5px; background:var(--card,#fff); color:var(--ink, inherit);}
/* Product catalogue & Link barcodes */
.cat-list{max-height:48vh; overflow:auto; border:1px solid var(--line); border-radius:8px; padding:2px 10px;}
.cat-sec{padding:6px 0; border-bottom:1px solid var(--line);}
.cat-sec:last-child{border-bottom:none;}
.cat-sec-head{display:flex; align-items:center; gap:8px; font-weight:800; font-size:13px; padding:6px 0; position:sticky; top:0; background:var(--surface); z-index:1; cursor:pointer;}
.cat-item{display:flex; gap:10px; align-items:flex-start; padding:5px 0 5px 24px; flex-wrap:wrap;}
.cat-name{flex:1 1 220px; font-size:12.5px; padding-top:5px;}
.cat-tag{display:inline-block; font-size:10px; font-weight:700; color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:0 6px; margin-left:2px;}
.cat-sizes{display:flex; flex-wrap:wrap; gap:5px; flex:2 1 300px;}
.cat-size{display:inline-flex; align-items:center; gap:4px; border:1px solid var(--line); border-radius:8px; padding:3px 6px; font-size:12px; cursor:pointer; background:var(--surface);}
.cat-size.on{border-color:var(--blue); background:rgba(41,121,255,.08);}
.cat-size.have{color:var(--muted); cursor:default; border-style:dashed;}
.cat-size .cat-r{color:var(--muted); font-size:11px;}
.cat-size .cat-price{width:72px; padding:3px 5px; font-size:12px; border:1px solid var(--line); border-radius:6px;}
.cat-badge{display:inline-block; min-width:18px; padding:0 5px; border-radius:999px; background:var(--orange); color:#fff; font-size:10.5px; line-height:17px; text-align:center;}
.lb-row{display:flex; gap:10px; align-items:center; padding:7px 0; border-bottom:1px solid var(--line);}
.lb-row:last-child{border-bottom:none;}
.lb-name{flex:1; min-width:0; font-size:12.5px;}
.lb-scan{width:190px; max-width:45%; padding:7px 9px; border:1px solid var(--line); border-radius:8px; font-size:13px;}
.lb-row.done .lb-scan{border-color:var(--green, #2e7d32);}
.lb-row.done .lb-name b::after{content:' ✓'; color:var(--green, #2e7d32);}
@media (max-width:600px){ .cat-item{padding-left:6px;} .cat-size .cat-price{width:84px;} }
.cat-search{padding:9px 12px; border:1px solid var(--line); border-radius:8px; font-size:12.5px; background:var(--surface); color:var(--ink);}
.cat-search:focus{outline:none; border-color:var(--blue);}