@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');
:root{--green:#245b89;--green2:#1e4d73;--ink:#173b58;--muted:#7596b0;--line:#d3e0e9;--bg:#f2f6f9;--white:#fff;--shadow:0 8px 28px #163d5a0a;--blue-light:#7899b4;--blue-deep:#163d5a}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px 'IBM Plex Sans Arabic',Tahoma,sans-serif}button,input,select{font:inherit}button{cursor:pointer}.layout{min-height:100vh}.sidebar{width:250px;position:fixed;inset:0 0 0 auto;background:var(--green);color:white;padding:25px 17px 16px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;gap:11px;align-items:center;color:white;text-decoration:none;padding:0 10px}.brand-icon{width:43px;height:43px;border:1px solid #ffffff28;background:#ffffff12;border-radius:14px;display:grid;place-items:center;color:#dceaf4;font-size:24px;font-weight:bold}.brand b{display:block;font-size:19px}.brand small{display:block;color:#b6cadb;font-size:11px}.branch{margin:16px 5px 12px;padding:8px 10px;background:#ffffff0c;border:1px solid #ffffff12;border-radius:8px;color:#dceaf4;font-size:11px;display:flex;gap:8px;align-items:center}.branch i{width:7px;height:7px;background:#7899b4;border-radius:50%}.branch span{margin-right:auto;background:#ffffff17;padding:2px 6px;border-radius:4px;font-size:9px}nav{display:flex;flex-direction:column;gap:2px}nav>small{padding:0 11px 4px;color:#83a397;font-size:10px}.nav{display:flex;align-items:center;gap:10px;background:transparent;color:#dceaf4;border:0;text-align:right;border-radius:8px;padding:6px 10px;min-height:34px;font-size:14px}.nav span{font-size:12px}.nav:hover{background:#ffffff0c;color:white}.nav.active{background:#ffffff18;color:white;font-weight:bold;position:relative}.nav.active:before{content:'';position:absolute;right:-17px;top:5px;bottom:5px;width:3px;background:#7899b4;border-radius:3px 0 0 3px}.nav em{margin-right:auto;background:#ffffff1b;border-radius:12px;padding:1px 7px;font-size:9px;font-style:normal}.group-label{margin-top:10px;margin-bottom:2px}.sidebar-bottom{margin-top:auto;border-top:1px solid #ffffff20;padding:15px 5px 2px;display:flex;align-items:center;gap:9px;font-size:11px}.sidebar-bottom small{display:block;color:#a9c1d3;font-size:9px;margin-top:3px}.admin-avatar{width:34px;height:34px;border-radius:50%;background:#dceaf4;color:var(--green);display:grid;place-items:center;font-weight:bold}.dots{margin-right:auto;font-size:19px;color:#b6cadb}main{margin-right:250px;min-height:100vh}.topbar{height:67px;background:#fff;border-bottom:1px solid var(--line);padding:0 36px;display:flex;align-items:center;justify-content:space-between}.crumb{color:#929f98;font-size:11px}.crumb span{padding:0 9px;color:#c4ccc7}.crumb b{color:#527b9b;font-weight:500}.top-actions{display:flex;gap:15px;align-items:center}.top-actions time{font-size:10px;color:#839088}.top-actions button{width:32px;height:32px;background:#fff;border:1px solid var(--line);border-radius:8px;color:#5a6c61;font-size:18px}.mini{width:29px;height:29px;font-size:11px}.hamb{display:none}.content{max-width:1450px;padding:30px 36px 55px;margin:auto}.heading{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:23px}.heading small,.modal-head small{font-size:10px;color:#91a097;font-weight:600}.heading h1{font-size:24px;margin:3px 0;color:#173b58}.heading p{font-size:11px;color:#85928b;margin:0}.button{border:1px solid transparent;border-radius:7px;padding:9px 14px;font-size:11px;font-weight:600}.primary{background:var(--green);color:white}.primary:hover{background:var(--green2)}.secondary{background:white;border-color:var(--line);color:#56675d}.plus{font-size:16px;margin-left:5px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:17px}.stat{background:white;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:9px;padding:15px 17px;min-height:112px}.stat-top{display:flex;align-items:center;justify-content:space-between;color:#839188;font-size:10px}.stat-icon{width:29px;height:29px;border-radius:8px;background:#e6eff6;color:#245b89;display:grid;place-items:center;font-size:15px}.stat-value{font-size:23px;font-weight:bold;color:#173b58;margin-top:8px}.stat-value small{font-size:10px;color:#89968e;font-weight:400;margin-right:4px}.stat-foot{font-size:9px;color:#89968e;margin-top:4px}.panels{display:grid;grid-template-columns:1.5fr 1fr;gap:14px}.panel{background:#fff;border:1px solid var(--line);border-radius:9px;box-shadow:var(--shadow);overflow:hidden}.panel-head{padding:15px 17px;border-bottom:1px solid #eff2f0;display:flex;align-items:center;justify-content:space-between}.panel-head b{display:block;font-size:12px}.panel-head small{display:block;font-size:9px;color:#95a199;margin-top:3px}.link{border:0;background:none;color:#245b89;font-size:10px}.chart-wrap{height:208px;padding:13px 17px}.chart{width:100%;height:100%;overflow:visible}.gridline{stroke:#edf1ee}.axis{fill:#99a59e;font:10px inherit}.area{fill:url(#fade)}.line{fill:none;stroke:#245b89;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.point{fill:white;stroke:#245b89;stroke-width:2}.activity{padding:4px 16px}.activity-row{display:flex;align-items:center;gap:9px;padding:11px 0;border-bottom:1px solid #f0f2f1}.activity-row:last-child{border:0}.activity-ico{width:30px;height:30px;border-radius:8px;background:#e6eff6;color:#245b89;display:grid;place-items:center}.activity-ico.warn{background:#fff3df;color:#b48137}.activity-info{flex:1}.activity-info b{display:block;font-size:10px}.activity-info small{display:block;font-size:9px;color:#95a099;margin-top:3px}.amount{font-size:10px;font-weight:bold;white-space:nowrap}.table-panel{margin-top:14px}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:right;background:#fafbfa;color:#95a098;font-size:9px;font-weight:500;padding:10px 14px}td{padding:11px 14px;border-top:1px solid #f0f2f1;color:#4e5d54;font-size:10px}.customer{display:flex;align-items:center;gap:8px}.customer b{color:#173b58}.face{width:27px;height:27px;border-radius:8px;background:#e6eff6;color:#245b89;display:grid;place-items:center;font-size:9px;font-weight:bold}.status{display:inline-block;padding:4px 8px;border-radius:18px;background:#e6eff6;color:#245b89;font-size:9px}.status:before{content:'●';font-size:6px;margin-left:4px}.status.pending{background:#fff4df;color:#b4873d}.status.debt{background:#fff0ed;color:#bd6a5c}.toolbar{display:flex;gap:8px;align-items:center;padding:12px 14px}.search{position:relative;flex:1;max-width:300px}.search span{position:absolute;right:10px;top:8px;color:#9aa69f}.search input{width:100%;height:35px;border:1px solid var(--line);border-radius:7px;padding:0 30px 0 9px;outline:none;font-size:10px}.filter{height:35px;border:1px solid var(--line);border-radius:7px;background:#fff;padding:0 9px;color:#56675e;font-size:10px}.empty{padding:38px;text-align:center;color:#85928a;font-size:11px}.empty b{display:block;color:#46584d;font-size:12px}.agents{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.agent-card{background:#fff;border:1px solid var(--line);border-radius:9px;padding:16px;box-shadow:var(--shadow)}.agent-head{display:flex;align-items:center;gap:9px}.agent-face{width:38px;height:38px;border-radius:11px;background:#e6eff6;color:#245b89;display:grid;place-items:center;font-weight:bold}.agent-name{flex:1}.agent-name b{display:block;font-size:12px}.agent-name small{display:block;font-size:9px;color:#96a199;margin-top:3px}.agent-more{border:0;background:none;color:#8a9890}.agent-kpis{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #eef1ef;margin-top:14px;padding-top:12px}.agent-kpis small{display:block;font-size:9px;color:#94a099}.agent-kpis b{display:block;margin-top:4px;font-size:14px}.agent-foot{display:flex;justify-content:space-between;align-items:center;margin-top:13px}.agent-foot small{font-size:9px;color:#929e97}.agent-foot button{border:0;background:none;color:#245b89;font-size:9px}.user-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.user-row{padding:12px 14px;display:flex;align-items:center;gap:9px;border-bottom:1px solid #eff2f0}.user-row:last-child{border:0}.user-details{flex:1}.user-details b{display:block;font-size:10px}.user-details small{display:block;font-size:9px;color:#97a39b;margin-top:3px}.user-details .password-note{color:#a07b52;font-size:8px}.role{font-size:9px;color:#245b89;background:#e6eff6;padding:4px 7px;border-radius:5px;white-space:nowrap}.role.admin{color:#667b9a;background:#edf1f8}.code{font:10px monospace;letter-spacing:.5px;color:#76847b}.row-action{border:0;background:none;color:#91a097}.notice{font-size:10px;color:#829087;margin-top:14px}.shade{display:none}dialog{width:min(450px,calc(100% - 28px));border:1px solid var(--line);border-radius:12px;padding:0;box-shadow:0 20px 70px #071c2c38;color:var(--ink)}dialog::backdrop{background:#11241d8a;backdrop-filter:blur(2px)}dialog form{padding:20px}.modal-head{display:flex;justify-content:space-between;margin-bottom:17px}.modal-head h2{font-size:18px;margin:3px 0}.close{width:29px;height:29px;border:0;border-radius:7px;background:#f0f3f1;color:#68766e;font-size:20px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.field.full{grid-column:1/-1}.field label{display:block;font-size:10px;color:#5f7066;margin-bottom:5px}.field input,.field select{width:100%;height:36px;border:1px solid #e3e9e5;border-radius:6px;padding:0 9px;outline:none;color:#34463c;background:#fff;font-size:10px}.field input:focus,.field select:focus{border-color:#7899b4;box-shadow:0 0 0 3px #527b9b1a}.modal-actions{display:flex;gap:8px;padding-top:15px;margin-top:16px;border-top:1px solid #eef1ef}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,20px);background:#163d5a;color:#fff;padding:10px 15px;border-radius:8px;font-size:11px;opacity:0;transition:.2s;z-index:10;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
.account-tools{margin-bottom:14px}
@media(max-width:1050px){.content{padding-left:22px;padding-right:22px}.topbar{padding:0 22px}.agents{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.sidebar{transform:translateX(100%);transition:.2s;width:260px;box-shadow:-15px 0 45px #0002}.sidebar.open{transform:translateX(0)}main{margin:0}.topbar{height:58px;padding:0 15px}.hamb{display:block;border:0;background:none;color:#245b89;font-size:18px}.crumb{margin-left:auto;margin-right:11px}.top-actions{gap:9px}.top-actions time{display:none}.content{padding:22px 15px 36px}.heading h1{font-size:21px}.heading p{font-size:10px;line-height:1.6}.heading .button{padding:9px 10px}.stats{grid-template-columns:1fr 1fr;gap:9px}.stat{padding:12px;min-height:101px}.stat-value{font-size:20px}.panels{grid-template-columns:1fr}.agents{grid-template-columns:repeat(2,1fr)}.user-grid{grid-template-columns:1fr}.shade{display:block;position:fixed;inset:0;background:#071c2c77;z-index:4;opacity:0;pointer-events:none;transition:.2s}.shade.show{opacity:1;pointer-events:auto}}@media(max-width:480px){.content{padding-left:12px;padding-right:12px}.heading h1{font-size:19px}.heading p{max-width:230px}.heading .secondary{display:none}.agents{grid-template-columns:1fr}.toolbar{flex-wrap:wrap}.search{max-width:none;flex-basis:100%}.chart-wrap{height:180px}.fields{grid-template-columns:1fr}.field.full{grid-column:auto}}

/* تحسينات العرض على الهواتف */
@media(max-width:760px){
  html,body{width:100%;min-width:320px;overflow-x:hidden}
  .layout,main,.content{width:100%;max-width:100%;min-width:0}
  .topbar{position:sticky;top:0;z-index:3;padding-inline:12px;gap:6px}
  .crumb{font-size:10px;white-space:nowrap}
  .top-actions{gap:7px}
  .content{padding:18px 12px calc(28px + env(safe-area-inset-bottom))}
  .heading{align-items:center;gap:8px;margin-bottom:16px}
  .heading>div{min-width:0}
  .heading h1{margin-top:2px;margin-bottom:2px;font-size:20px}
  .heading p{font-size:10px;max-width:250px}
  .heading>.button{flex:none;padding:9px 10px;font-size:10px;white-space:nowrap}
  .stats{gap:8px;margin-bottom:12px}
  .stat{min-width:0;padding:11px 10px;min-height:98px}
  .stat-top{font-size:9px;gap:4px}
  .stat-icon{width:25px;height:25px;flex:none}
  .stat-value{font-size:clamp(16px,5vw,20px);overflow-wrap:anywhere}
  .stat-value small{font-size:9px}
  .stat-foot{line-height:1.5}
  .panels{gap:11px}
  .panel{min-width:0;border-radius:8px}
  .panel-head{padding:12px}
  .chart-wrap{height:175px;padding:10px 8px}
  .activity{padding:3px 12px}
  .activity-row{gap:7px}
  .activity-info{min-width:0}
  .activity-info b,.activity-info small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .amount{font-size:9px}
  .table-panel{margin-top:11px}
  .table-scroll{width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
  .table-scroll table{min-width:660px}
  .toolbar{padding:10px;gap:7px}
  .search{min-width:0;max-width:none;flex:1 1 100%}
  .filter{max-width:100%;flex:1}
  .agents{grid-template-columns:minmax(0,1fr);gap:9px}
  .agent-card{padding:13px}
  .user-grid{gap:11px}
  .user-row{gap:7px;padding:10px;flex-wrap:wrap}
  .user-details{min-width:calc(100% - 55px)}
  .user-row .code{margin-right:38px}
  .notice{line-height:1.8}
  dialog{max-height:calc(100dvh - 24px);overflow:auto}
  dialog form{padding:16px}
  .fields{grid-template-columns:1fr 1fr;gap:9px}
  .field.full{grid-column:1/-1}
  .field input,.field select{font-size:16px;height:40px}
}
@media(max-width:390px){
  .content{padding-inline:9px}
  .heading h1{font-size:18px}
  .heading p{max-width:190px;font-size:9px}
  .heading>.button{padding:8px;font-size:9px}
  .stat{padding:9px 8px;min-height:93px}
  .stat-value{font-size:16px}
  .fields{grid-template-columns:1fr}
  .field.full{grid-column:auto}
  .modal-actions .button{flex:1}
}

/* الأكواد والطباعة */
.code-toolbar{flex-wrap:wrap}.code-toolbar>.field{min-width:110px;max-width:150px;margin:0}.code-toolbar>.field span{display:block;font-size:9px;color:#718078;margin-bottom:4px}.code-toolbar>.field input{height:36px}.upload-button{position:relative;overflow:hidden}.print-config{padding:0 15px 13px;display:flex;gap:12px;align-items:center;color:#75847a;font-size:10px}.print-config label{display:flex;gap:7px;align-items:center}.print-config select{border:1px solid var(--line);border-radius:6px;padding:6px;background:var(--white);color:var(--ink)}.serial-code{font-family:monospace;font-size:13px;font-weight:700;letter-spacing:1px;color:#1e4d73}.codes-table{min-width:620px}.qr-preview{min-height:280px;display:grid;place-items:center;margin:4px auto 15px}.qr-preview img,.qr-preview canvas{max-width:100%;height:auto}.scanner-box{padding:20px;min-width:min(400px,80vw)}#scan-video{width:100%;max-height:55vh;object-fit:cover;background:#111;border-radius:8px}#scan-message{font-size:11px;color:#738177}.reports-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.reports-grid h3{font-size:14px;margin:12px 0 4px}.reports-grid p{font-size:11px;color:#819087;line-height:1.6;min-height:38px}.reports-grid .button{margin:3px}
.manual-scan{margin-top:12px}.manual-scan label{display:block;margin-bottom:6px;color:#76847b;font-size:10px}.manual-scan>div{display:flex;gap:7px}.manual-scan input{min-width:0;flex:1;height:39px;border:1px solid var(--line);border-radius:6px;padding:0 10px;font:700 16px monospace;letter-spacing:1px;color:var(--ink);background:var(--white)}
@media(max-width:760px){.code-toolbar{align-items:stretch}.code-toolbar>.field{flex:1 1 100%;max-width:none}.code-toolbar>.button,.code-toolbar>.upload-button{flex:1 1 calc(50% - 8px);text-align:center;font-size:10px;padding:9px 7px}.print-config{align-items:flex-start;flex-direction:column;gap:6px}.reports-grid{grid-template-columns:1fr}.scanner-box{min-width:0;padding:15px}}

/* Barcode management page */
.code-banner{min-height:118px;margin:0 0 20px;padding:25px 28px;border-radius:15px;background:linear-gradient(110deg,#245b89,#163d5a);color:#fff;display:flex;align-items:center;gap:16px;box-shadow:0 8px 20px #4736b622}.code-banner-icon{width:48px;height:48px;border:1px solid #ffffff35;border-radius:13px;background:#ffffff19;display:grid;place-items:center;font-size:25px}.code-banner h2{margin:0;font-size:20px}.code-banner p{margin:5px 0 0;color:#dceaf4;font-size:12px}.code-total{margin-right:auto;padding:7px 12px;border-radius:18px;background:#ffffff24;font-size:12px;white-space:nowrap}
.code-actions{padding:17px 16px;margin-bottom:20px;background:#fff;border:1px solid #dce5ef;border-radius:15px;box-shadow:0 2px 2px #1b30450c;display:grid;grid-template-columns:1fr;gap:10px}.code-action-group{display:flex;align-items:center;justify-content:flex-start;gap:10px;flex-wrap:wrap}.code-action-group:first-child{justify-content:flex-start}.code-action-group:nth-child(2){justify-content:flex-end}.code-action-group.code-bulk{justify-content:space-between}.code-actions .button{min-height:38px;border:0;border-radius:9px;padding:9px 15px;font-size:11px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}.code-number-field{height:38px;width:190px;padding:0 10px;border:1px solid #dae3ee;border-radius:9px;display:flex;align-items:center;gap:8px;color:#8291a1;font-size:10px}.code-number-field span{white-space:nowrap}.code-number-field input{width:100%;min-width:0;border:0;outline:0;color:#445667;background:transparent;font:12px monospace;text-align:right}.code-add{background:#245b89;color:#fff}.code-add b{font-size:16px}.code-camera{background:#245b89;color:#fff}.code-import{background:#7899b4;color:#fff;position:relative;overflow:hidden}.code-import input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.code-print{background:#ed0754;color:#fff}.code-export{background:#edf3fa!important;border:1px solid #dbe4ee!important;color:#53677c}.code-delete-all{background:#293b55;color:#fff}.code-select{background:#edf3fa!important;border:1px solid #dbe4ee!important;color:#53677c}.code-actions select{height:36px;padding:0 10px;border:1px solid #dbe4ee;border-radius:8px;background:#fff;color:#53677c;font-size:10px}
.barcode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.barcode-card{min-width:0;padding:13px;background:#f7f9fb;border:1px solid #dce5ef;border-radius:13px;box-shadow:0 2px 2px #1b30450c}.barcode-label{height:20px;color:#718399;text-align:right;font-size:9px}.barcode-number{height:41px;margin-bottom:10px;padding:0 11px;border:1px solid #cbd8e8;border-radius:8px;background:#fff;color:#245b89;display:flex;align-items:center;justify-content:flex-end;overflow:hidden;font:700 12px monospace;letter-spacing:1px;direction:ltr;white-space:nowrap}.barcode-body{min-height:112px;padding:10px;background:#fff;border:1px solid #dce5ef;border-radius:10px;display:flex;align-items:center;gap:10px}.barcode-controls{flex:1;display:flex;flex-direction:column;gap:5px}.barcode-controls button{height:25px;border-radius:7px;cursor:pointer}.barcode-edit{border:1px solid #b6cadb;background:#e6eff6;color:#245b89}.barcode-delete{border:1px solid #ffc9d4;background:#fff0f2;color:#e8235d}.barcode-select{display:flex;align-items:center;gap:5px;color:#7d8a98;font-size:9px}.barcode-select input{accent-color:#245b89}.barcode-qr{width:92px;height:92px;flex:none;padding:6px;border:1px solid #edf1f6;border-radius:9px;background:#f9fbfd;display:grid;place-items:center}.barcode-qr img,.barcode-qr canvas{width:100%!important;height:100%!important;image-rendering:pixelated}.barcode-empty{grid-column:1/-1;min-height:150px;border:1px dashed #ccd8e5;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#8291a1;font-size:12px}.barcode-empty b{color:#43556a;font-size:14px}
.agent-card .settle-agent{flex:none;width:auto;margin:0;padding:7px 9px;font-size:9px}.agent-card .settle-agent:disabled{opacity:.5;cursor:not-allowed}.agent-sort{display:flex;align-items:center;gap:8px;color:#718078;font-size:10px}.agent-sort select{height:32px;padding:0 9px;border:1px solid var(--line);border-radius:6px;background:var(--white);color:var(--ink)}.settle-sales{max-height:250px;overflow:auto;border:1px solid var(--line);border-radius:7px}.settle-sales label{display:flex;align-items:center;gap:8px;padding:9px;border-bottom:1px solid var(--line);font-size:10px}.settle-sales label:last-child{border:0}.settle-sales label span{flex:1}.settle-sales input{accent-color:var(--green)}.settle-hint{padding:9px;border-radius:6px;background:#fff5df;color:#926c24;font-size:10px}
.agent-card .agent-delete{padding:5px 7px;border:1px solid #f1c7cb;border-radius:6px;background:#fff0f0;color:#a13f46;font-size:9px;white-space:nowrap}.agent-card .agent-more{padding:5px 7px;border:1px solid var(--line);border-radius:6px;background:var(--white);font-size:9px;white-space:nowrap}body.dark .agent-card .agent-delete{background:#553440;border-color:#805360;color:#ffe3e5}
.top-actions .logout-button{width:auto;padding:0 10px;font-size:10px;white-space:nowrap}.top-actions time{white-space:nowrap;font-variant-numeric:tabular-nums}
body.dark .code-actions,body.dark .barcode-card{background:#1e4d73;border-color:#315c7d}body.dark .code-number-field,body.dark .barcode-body,body.dark .barcode-number{background:#163d5a;border-color:#527b9b;color:#d7cfff}body.dark .barcode-qr{background:#f9fbfd;border-color:#527b9b}body.dark .barcode-empty{border-color:#527b9b}
@media(max-width:760px){.code-banner{min-height:100px;padding:17px;border-radius:12px}.code-banner h2{font-size:17px}.code-banner p{font-size:10px}.code-actions{padding:12px;gap:9px}.code-action-group,.code-action-group:first-child,.code-action-group:nth-child(2),.code-action-group.code-bulk{justify-content:stretch}.code-action-group>*{flex:1 1 calc(50% - 8px)}.code-number-field{width:auto}.code-actions .button{padding:8px;font-size:10px}.code-bulk .code-delete-all{flex-basis:100%}.code-actions select{flex:1 1 calc(50% - 8px)}.barcode-grid{grid-template-columns:1fr;gap:10px}.barcode-card{padding:11px}.barcode-body{min-height:106px}.barcode-qr{width:86px;height:86px}}
/* Barcode card controls and responsive QR sizing */
.barcode-controls button{height:22px;border-radius:6px;font-size:10px;padding:0 6px}.barcode-qr{width:108px;height:108px;padding:5px}
@media(min-width:761px) and (max-width:1100px){.barcode-grid{grid-template-columns:1fr;gap:12px}.barcode-card{padding:12px}.barcode-qr{width:116px;height:116px}.barcode-body{min-height:130px}}
@media(max-width:760px){.barcode-controls button{height:21px;font-size:9px;padding:0 5px}.barcode-qr{width:100px;height:100px;padding:5px}.barcode-body{min-height:116px}}
@media(max-width:390px){.barcode-controls button{height:19px;font-size:8px}.barcode-qr{width:88px;height:88px;padding:4px}.barcode-body{gap:7px;padding:8px}}
@media(max-width:760px){.top-actions time{display:block;font-size:8px;max-width:124px;overflow:hidden;text-overflow:ellipsis}.top-actions .logout-button{height:30px;padding:0 6px;font-size:8px}.top-actions{gap:5px}}
@media print{body{background:#fff!important;color:#000!important}.sidebar,.topbar,.heading,.toolbar,.panel-head,.toast{display:none!important}.content,main{margin:0!important;padding:0!important;width:100%!important}.panel,.stat{box-shadow:none!important;border:1px solid #ddd!important;color:#000!important}.codes-table{min-width:0!important;width:100%}.qr-preview{filter:none!important}}

/* الوضع الداكن */
body.dark{--ink:#e5eef5;--muted:#a9c1d3;--line:#315c7d;--bg:#163d5a;--white:#1e4d73;--shadow:0 8px 26px #0003;color:var(--ink)}
body.dark main,body.dark .content{background:var(--bg)}body.dark .topbar,body.dark .panel,body.dark .stat,body.dark .agent-card,body.dark dialog{background:#1e4d73;color:var(--ink);border-color:#315c7d}body.dark .crumb b,body.dark .heading h1,body.dark .stat-value,body.dark td,body.dark .customer b,body.dark .panel-head b,body.dark .agent-name b,body.dark .agent-kpis b,body.dark .user-details b{color:#e5eef5}body.dark th,body.dark .panel-head,body.dark .activity-row,body.dark .user-row,body.dark td{border-color:#315c7d;background:#1e4d73}body.dark .filter,body.dark .search input,body.dark .field input,body.dark .field select,body.dark .print-config select{background:#163d5a;color:#e5eef5;border-color:#527b9b}body.dark .secondary,body.dark .top-actions button{background:#245b89;color:#e1edf5;border-color:#527b9b}body.dark .face,body.dark .stat-icon,body.dark .agent-face,body.dark .activity-ico{background:#315c7d;color:#e1edf5}body.dark .activity-ico.warn{background:#315c7d;color:#f2cf8c}body.dark .role,body.dark .status{background:#245b89;color:#e1edf5}body.dark .role.admin{background:#303c51;color:#c2d3f1}
/* Blue palette from the supplied reference */
.logout-button{border:1px solid #d9a7a7!important;border-radius:7px!important;background:#fff7f7!important;color:#a13f46!important;font-size:10px!important;font-weight:600;padding:0 10px!important;min-width:94px;transition:.15s}.logout-button:hover{background:#fbe9e9!important;border-color:#c98282!important}
body.dark{--ink:#e5eef5;--muted:#a9c1d3;--line:#315c7d;--bg:#163d5a;--white:#1e4d73;--green:#245b89;--green2:#7899b4;--shadow:0 8px 26px #071c2c66;color:var(--ink)}body.dark main,body.dark .content{background:#163d5a}body.dark .topbar,body.dark .panel,body.dark .stat,body.dark .agent-card,body.dark dialog{background:#1e4d73;color:#e5eef5;border-color:#315c7d}body.dark th,body.dark .panel-head,body.dark .activity-row,body.dark .user-row,body.dark td{background:#1e4d73;border-color:#315c7d}body.dark .crumb b,body.dark .heading h1,body.dark .stat-value,body.dark td,body.dark .customer b,body.dark .panel-head b,body.dark .agent-name b,body.dark .agent-kpis b,body.dark .user-details b{color:#e5eef5}body.dark .filter,body.dark .search input,body.dark .field input,body.dark .field select,body.dark .print-config select,body.dark .agent-sort select{background:#163d5a;color:#e5eef5;border-color:#527b9b}body.dark .secondary,body.dark .top-actions button:not(.logout-button){background:#245b89;color:#e5eef5;border-color:#527b9b}body.dark .role,body.dark .status{background:#245b89;color:#e1edf5}body.dark .face,body.dark .stat-icon,body.dark .agent-face,body.dark .activity-ico{background:#315c7d;color:#e1edf5}body.dark .logout-button{background:#294d68!important;border-color:#a66c75!important;color:#ffd7d7!important}body.dark .logout-button:hover{background:#365e79!important}
.top-actions .logout-button{width:36px;height:36px;min-width:36px;padding:0!important;display:grid;place-items:center}.logout-button svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.top-actions .logout-button:hover{transform:translateY(-1px)}@media(max-width:760px){.top-actions .logout-button{width:30px;height:30px;min-width:30px;padding:0!important}}
.logout-dialog{width:min(360px,calc(100% - 32px));padding:28px 24px 22px;text-align:center;border:1px solid #d3e0e9;border-radius:16px;background:#fff;color:#173b58;box-shadow:0 20px 60px #071c2c40}.logout-dialog::backdrop{background:#071c2c80;backdrop-filter:blur(3px)}.logout-dialog-icon{width:54px;height:54px;margin:0 auto 14px;border-radius:16px;display:grid;place-items:center;background:#e6eff6;color:#245b89}.logout-dialog-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.logout-dialog h2{margin:0;color:inherit;font-size:18px}.logout-dialog p{margin:8px 0 20px;color:#7596b0;font-size:12px}.logout-dialog-actions{display:flex;justify-content:center;gap:9px}.logout-dialog-actions .button{min-width:100px}.logout-confirm{background:#245b89;color:#fff}.logout-confirm:hover{background:#1e4d73}
body.dark .logout-dialog{background:#1e4d73;border-color:#315c7d;color:#e5eef5}body.dark .logout-dialog p{color:#b6cadb}body.dark .logout-dialog-icon{background:#315c7d;color:#e5eef5}body.dark .logout-confirm{background:#7899b4;color:#163d5a}
.confirm-dialog{width:min(380px,calc(100% - 32px));padding:28px 24px 22px;text-align:center;border:1px solid #d3e0e9;border-radius:16px;background:#fff;color:#173b58;box-shadow:0 20px 60px #071c2c40}.confirm-dialog::backdrop{background:#071c2c80;backdrop-filter:blur(3px)}.confirm-dialog-icon{width:54px;height:54px;margin:0 auto 14px;border-radius:16px;display:grid;place-items:center;background:#fff0ed;color:#bd6a5c;font-size:25px;font-weight:700}.confirm-dialog h2{margin:0;color:inherit;font-size:18px}.confirm-dialog p{margin:8px 0 20px;color:#7596b0;font-size:12px;line-height:1.8}.confirm-dialog-actions{display:flex;justify-content:center;gap:9px}.confirm-dialog-actions .button{min-width:100px}.confirm-danger{background:#bd3948;color:#fff}.confirm-danger:hover{background:#a92f3e}body.dark .confirm-dialog{background:#1e4d73;border-color:#315c7d;color:#e5eef5}body.dark .confirm-dialog p{color:#b6cadb}body.dark .confirm-dialog-icon{background:#583b48;color:#ffd7d7}body.dark .confirm-danger{background:#d45c69;color:#fff}
.codes-print-modal{width:min(940px,calc(100% - 24px));max-width:940px;max-height:calc(100dvh - 24px);padding:0;border:1px solid var(--line);border-radius:14px;background:#e9eef2;color:var(--ink);box-shadow:0 20px 70px #071c2c55}.codes-print-modal::backdrop{background:#071c2c99;backdrop-filter:blur(3px)}.codes-print-toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:var(--white);border-bottom:1px solid var(--line)}.codes-print-toolbar>div{display:flex;gap:8px}.codes-print-content{max-height:calc(100dvh - 90px);overflow:auto;padding:12px}.codes-print-sheet{width:194mm;height:277mm;margin:0 auto 12px;padding:0;background:#fff;color:#000;page-break-after:always;break-after:page;break-inside:avoid;page-break-inside:avoid}.codes-print-sheet:last-child{page-break-after:auto;break-after:auto}.codes-print-grid{width:100%;height:100%;padding-top:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));column-gap:.5mm;row-gap:0}.codes-print-sheet.pdf-three-rows .codes-print-grid{grid-template-rows:repeat(3,minmax(0,1fr))}.codes-print-item{min-width:0;min-height:0;border:1px solid #999;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;padding:.5mm;break-inside:avoid;page-break-inside:avoid}.codes-print-qr{width:52mm;height:52mm;display:grid;place-items:center;flex:none}.codes-print-qr img,.codes-print-qr canvas{width:52mm!important;height:52mm!important;max-width:100%;image-rendering:pixelated}.codes-print-code{margin-top:0;font:700 16pt monospace;letter-spacing:1px;color:#000;direction:ltr;text-align:center;overflow-wrap:anywhere}body.dark .codes-print-modal{background:#163d5a;color:#e5eef5}body.dark .codes-print-toolbar{background:#1e4d73;border-color:#315c7d}@media print{body>*:not(#codes-print-modal){display:none!important}#codes-print-modal{position:static!important;display:block!important;width:auto!important;max-width:none!important;max-height:none!important;overflow:visible!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:#fff!important;box-shadow:none!important}#codes-print-modal::backdrop,.codes-print-toolbar{display:none!important}.codes-print-content{max-height:none!important;overflow:visible!important;padding:0!important}.codes-print-sheet{width:194mm;height:277mm;margin:0 auto!important;page-break-after:always;break-after:page;break-inside:avoid;page-break-inside:avoid}.codes-print-sheet:last-child{page-break-after:auto;break-after:auto}.codes-print-item{break-inside:avoid;page-break-inside:avoid}body{background:#fff!important}}
.sale-device-number{padding:4px 7px;border:1px solid #b6cadb;border-radius:6px;background:#e6eff6;color:#245b89;font:700 11px monospace;direction:ltr;white-space:nowrap}.sale-device-number:hover{background:#dceaf4}body.dark .sale-device-number{background:#245b89;border-color:#527b9b;color:#e5eef5}
.sale-pending-admin td{background:#fff0f0!important;color:#8c2934!important;border-color:#f1c7cb!important}.sale-pending-admin .status{background:#f9dadd;color:#8c2934}.sale-payment-select{min-height:32px;padding:4px 8px;border:1px solid #df9aa2;border-radius:7px;background:#fff;color:#812832;font:600 11px inherit}.sale-payment-select:focus{outline:2px solid #df9aa266}body.dark .sale-pending-admin td{background:#553440!important;color:#ffe3e5!important;border-color:#805360!important}body.dark .sale-pending-admin .status{background:#805360;color:#fff}body.dark .sale-payment-select{background:#422b36;color:#ffe3e5;border-color:#a66c75}.agent-new-sale{margin-top:6px;white-space:nowrap}
.sales-filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 14px 0}.sales-filter{min-height:34px;padding:6px 13px;border:1px solid var(--line);border-radius:18px;background:var(--white);color:var(--ink);font-size:11px;white-space:nowrap}.sales-filter:hover{border-color:var(--green);color:var(--green)}.sales-filter.active{border-color:var(--green);background:var(--green);color:#fff;box-shadow:0 2px 7px #163d5a22}body.dark .sales-filter{background:#1e4d73;border-color:#527b9b;color:#e5eef5}body.dark .sales-filter.active{background:#7899b4;color:#163d5a;border-color:#7899b4}@media(max-width:600px){.sales-filter-bar{gap:6px;padding:10px 10px 0}.sales-filter{flex:1 1 auto;padding:6px 9px;font-size:10px}.sales-filter-bar+.toolbar{padding-top:9px}}
.payment-remaining{display:block;margin-top:8px;color:var(--muted);font-size:11px}.payment-remaining b{color:var(--ink);font-variant-numeric:tabular-nums}.debt-filter-bar{padding-bottom:10px}
.login-mode .layout,.login-mode .shade,.login-mode .toast{display:none!important}.login-screen{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:20px;background:linear-gradient(145deg,#f2f6f9,#dceaf4)}.login-card{width:min(410px,100%);padding:34px;border:1px solid #d3e0e9;border-radius:18px;background:#fff;box-shadow:0 22px 70px #163d5a24;color:#173b58}.login-mark{width:56px;height:56px;margin:0 auto 18px;border-radius:16px;background:#245b89;color:#fff;display:grid;place-items:center;font-size:28px;font-weight:700}.login-card h1{margin:0;text-align:center;font-size:23px;color:#173b58}.login-card>p{margin:8px 0 24px;text-align:center;color:#7596b0;font-size:12px}.login-card>label{display:block;margin-top:14px;color:#315c7d;font-size:11px;font-weight:600}.login-card input{width:100%;height:43px;margin-top:6px;padding:0 12px;border:1px solid #d3e0e9;border-radius:8px;outline:0;background:#f9fbfd;color:#173b58;font-size:14px}.login-card input:focus{border-color:#7899b4;box-shadow:0 0 0 3px #7899b433}.login-card>.button{width:100%;margin-top:20px;height:42px;font-size:13px}.login-error{min-height:18px;margin-top:10px;color:#a13f46;font-size:11px}.login-mode.dark .login-screen,body.dark .login-screen{background:linear-gradient(145deg,#163d5a,#1e4d73)}body.dark .login-card{background:#1e4d73;border-color:#315c7d;color:#e5eef5}body.dark .login-card h1{color:#e5eef5}body.dark .login-card>p,body.dark .login-card>label{color:#b6cadb}body.dark .login-card input{background:#163d5a;border-color:#527b9b;color:#e5eef5}
.pricing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.price-panel{overflow:hidden}.price-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px}.price-field{display:block;color:#315c7d;font-size:11px}.price-field>div{display:flex;align-items:center;gap:8px;margin-top:6px;padding:0 10px;border:1px solid #d3e0e9;border-radius:8px;background:#f9fbfd}.price-field input{width:100%;height:40px;border:0;outline:0;background:transparent;color:#173b58;font-size:14px}.price-field small{color:#7596b0;white-space:nowrap}.pricing-save-row{display:flex;align-items:center;gap:14px;padding:16px 0}.pricing-save-row>span{color:#7596b0;font-size:11px}.agent-mode .sidebar{display:none!important}.agent-mode main{margin:0}.agent-mode .content{max-width:1100px}.agent-mode .topbar{padding-inline:24px}body.dark .price-field>div{background:#163d5a;border-color:#527b9b}body.dark .price-field{color:#b6cadb}body.dark .price-field input{color:#e5eef5}@media(max-width:760px){.pricing-grid{grid-template-columns:1fr}.price-fields{grid-template-columns:1fr 1fr}.pricing-save-row{align-items:flex-start;flex-direction:column}.agent-mode .topbar{padding-inline:12px}}
.user-edit{padding:5px 9px;border:1px solid #d3e0e9;border-radius:6px;background:#e6eff6;color:#245b89;font-size:10px}.user-edit:hover{background:#dceaf4}body.dark .user-edit{background:#245b89;border-color:#527b9b;color:#e5eef5}body.dark .user-edit:hover{background:#315c7d}

.sale-qr-dialog{width:min(450px,calc(100% - 28px));max-height:calc(100dvh - 24px);overflow:auto}.sale-qr-dialog .scanner-box{width:100%;min-width:0}.sale-qr-dialog .qr-preview{min-height:280px}

.sales-record-table{min-width:700px}.sale-qr-dialog[open]{position:fixed;inset:50% auto auto 50%;transform:translate(-50%,-50%);margin:0}
.debt-actions{display:flex;align-items:center;gap:5px}.debt-actions .button{padding:5px 8px;font-size:9px}.debt-actions .user-edit{white-space:nowrap}

.agent-private-tabs{display:flex;gap:8px;padding:0 0 14px}.agent-private-tabs .sales-filter{min-width:120px}.agent-mode .sale-device-number{font-size:10px}
.heading-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.heading-actions .button{box-sizing:border-box;width:190px;height:42px;min-height:42px;max-width:100%;padding:8px 10px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;line-height:1}
.heading-actions [data-action="agent-invoice"],.heading-actions [data-action="sale"]{background:var(--green);border-color:transparent;color:#fff}
.heading-actions [data-action="agent-invoice"]:hover,.heading-actions [data-action="sale"]:hover{background:var(--green2)}
.sale-device-field{display:flex;gap:7px;align-items:stretch}.sale-device-field input{flex:1;min-width:0;height:40px;border:1px solid #e3e9e5;border-radius:6px;padding:0 9px;outline:none;color:#34463c;background:#fff;font-size:12px}.sale-device-field input:focus{border-color:#7899b4;box-shadow:0 0 0 3px #527b9b1a}.sale-device-field .button{flex:none;white-space:nowrap}
.field input[readonly]{background:#f2f6f9;color:#527b9b;font-weight:600}.barcode-owner{padding:6px 8px;border-radius:6px;background:#e6eff6;color:#315c7d;font-size:10px;text-align:center}.barcode-owner-edit{width:100%;margin-top:6px;padding:6px;border:1px solid #d3e0e9;border-radius:6px;background:#fff;color:#245b89;font-size:10px}.barcode-owner-edit:hover{background:#f2f6f9}body.dark .field input[readonly]{background:#163d5a;color:#dceaf4}body.dark .barcode-owner{background:#315c7d;color:#e5eef5}body.dark .barcode-owner-edit{background:#245b89;border-color:#527b9b;color:#e5eef5}
body.dark .sale-device-field input{background:#163d5a;color:#e5eef5;border-color:#527b9b}
@media(max-width:760px){.heading-actions{max-width:52%;gap:6px}.heading-actions .button{width:190px;height:42px;min-height:42px;font-size:10px;padding:8px 9px}}
@media(max-width:480px){.heading-actions{max-width:48%;flex-direction:column;align-items:stretch}.heading-actions .button{width:190px;height:42px;min-height:42px;max-width:100%;font-size:9px;padding:8px 6px}}
@media(max-width:390px){.sale-device-field{flex-wrap:wrap}.sale-device-field input{flex-basis:100%}.sale-device-field .button{width:100%;min-height:40px}}

/* Consistent tablet and phone layout */
html{min-width:320px;scroll-padding-top:64px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-width:320px;overflow-x:hidden;overscroll-behavior-x:none}
button,.button,select,input{touch-action:manipulation}
button:focus-visible,.button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #7899b488;outline-offset:2px}
.content,.panel,.stat,.agent-card,.barcode-card{min-width:0}
.group-label{margin-top:12px}
.sidebar nav{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.sidebar-bottom{flex-shrink:0}
.topbar .admin-avatar.mini{width:max-content;max-width:260px;min-width:fit-content;height:36px;padding:0 12px;border-radius:18px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:0 1 auto}
@media(min-width:761px) and (max-width:1100px){
  .sidebar{width:220px;padding-inline:13px}
  main{margin-right:220px}
  .content{padding:24px 22px 40px}
  .topbar{padding-inline:22px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .panels{grid-template-columns:minmax(0,1.25fr) minmax(270px,1fr)}
  .agents{grid-template-columns:repeat(2,minmax(0,1fr))}
  .reports-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .barcode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .layout,main,.content{width:100%;max-width:100%;min-width:0}
  .sidebar{width:min( min(300px,86vw),300px);padding:calc(18px + env(safe-area-inset-top)) 15px calc(14px + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain}
  .sidebar nav{padding-bottom:12px}
  .nav{min-height:34px}
  .topbar{height:58px;padding:0 12px;gap:8px;padding-top:env(safe-area-inset-top);height:calc(58px + env(safe-area-inset-top))}
  .hamb{width:38px;height:38px;flex:none;border-radius:8px;touch-action:manipulation}
  .crumb{min-width:0;overflow:hidden;text-overflow:ellipsis}
  .top-actions{flex:none}
  .top-actions button:not(.logout-button){width:34px;height:34px;flex:none}
  .top-actions .mini{display:none}
  .content{padding:18px 12px calc(30px + env(safe-area-inset-bottom))}
  .heading{gap:10px;align-items:center}
  .heading>div{min-width:0}
  .heading>.button{max-width:48%;white-space:normal;line-height:1.4}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .panels,.pricing-grid,.user-grid{grid-template-columns:minmax(0,1fr)}
  .agents{grid-template-columns:repeat(2,minmax(0,1fr))}
  .agent-card{min-width:0}
  .reports-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .barcode-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .barcode-card{padding:9px}
  .barcode-body{gap:7px;padding:8px}
  .barcode-qr{width:78px;height:78px}
  .table-scroll{max-width:100%;touch-action:pan-x pan-y}
  .table-scroll table{width:max-content;min-width:100%}
  .table-scroll th,.table-scroll td{padding:10px 11px}
  .toolbar,.sales-filter-bar,.debt-filter-bar{max-width:100%}
  .sales-filter-bar{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:thin;overscroll-behavior-inline:contain}
  .sales-filter{flex:0 0 auto;min-height:40px}
  dialog:not(.codes-print-modal){max-width:calc(100vw - 20px);max-height:calc(100dvh - 20px);overscroll-behavior:contain}
  dialog form{padding:16px}
  .modal-actions{position:sticky;bottom:-16px;padding:12px 0 max(8px,env(safe-area-inset-bottom));background:var(--white)}
  .modal-actions .button,.logout-dialog-actions .button,.confirm-dialog-actions .button{min-height:42px}
  .codes-print-modal{max-width:100vw;max-height:100dvh;border-radius:0}
  .codes-print-toolbar{flex-wrap:wrap;padding:10px}
  .codes-print-toolbar>div{width:100%}
  .codes-print-toolbar .button{flex:1;min-height:40px}
  .codes-print-content{max-height:calc(100dvh - 112px);padding:8px;overflow:auto}
  .codes-print-sheet{transform-origin:top center}
  .sale-qr-dialog[open]{inset:50% auto auto 50%;transform:translate(-50%,-50%)}
  .toast{width:max-content;max-width:calc(100vw - 28px);text-align:center;bottom:calc(14px + env(safe-area-inset-bottom))}
}
@media(max-width:480px){
  .top-actions time{display:none  }
  .heading{align-items:flex-start}
  .heading h1{font-size:19px}
  .heading p{max-width:220px}
  .heading>.button{font-size:10px;padding:9px}
  .agents,.reports-grid{grid-template-columns:minmax(0,1fr)}
  .barcode-grid{grid-template-columns:minmax(0,1fr)}
  .barcode-body{justify-content:flex-start}
  .barcode-qr{width:90px;height:90px}
  .price-fields{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px;gap:9px}
  .code-banner{padding:16px;gap:10px;flex-wrap:wrap}
  .code-banner h2{font-size:17px}
  .code-total{margin-right:auto}
  .code-action-group{width:100%;gap:7px}
  .code-action-group .button{flex:1 1 auto;white-space:normal}
  .fields{grid-template-columns:minmax(0,1fr)}
  .field.full{grid-column:auto}
  .manual-scan>div{flex-wrap:wrap}
  .manual-scan input{flex:1 1 150px}
}
@media(max-width:360px){
  .content{padding-inline:9px}
  .topbar{padding-inline:8px}
  .crumb{font-size:9px}
  .top-actions{gap:4px}
  .top-actions button:not(.logout-button){width:30px;height:30px}
  .stat{padding:9px 8px}
  .stat-top{font-size:8px}
  .code-number-field{width:100%}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
.agent-mode .agent-dashboard-stats{grid-template-columns:repeat(6,minmax(0,1fr))}
.agent-mode .agent-sale-actions .button{background:#245b89;color:#fff}
.whatsapp-phone-link{color:#128c7e;text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:4px}
.whatsapp-phone-link:hover{text-decoration:underline;color:#25d366}
body.dark .whatsapp-phone-link{color:#25d366}
.subscriber-table{min-width:620px}
.subscriber-row,.subscriber-actions{display:flex;align-items:center;gap:8px}
.subscriber-row{justify-content:space-between;min-width:330px}
.subscriber-actions{flex:0 0 auto}
.subscriber-actions .user-edit,.subscriber-delete{min-height:30px;padding:5px 10px;border:1px solid var(--line);border-radius:6px;font-size:10px}
.subscriber-table{min-width:1050px}
.subscriber-status{display:inline-block;padding:4px 9px;border-radius:14px;font-size:10px;white-space:nowrap}
.subscriber-status.active{background:#e6f4eb;color:#26814a}
.subscriber-status.inactive{background:#fff0ed;color:#bd6a5c}
.subscriber-delete{background:#fff0ed;color:#bd6a5c}
.subscriber-delete:hover{background:#ffe2dc}
body.dark .subscriber-status.active{background:#214a37;color:#a9e3bd}
body.dark .subscriber-status.inactive{background:#512f30;color:#ffd0c8}
body.dark .subscriber-delete{background:#512f30;border-color:#714345;color:#ffd0c8}
body.dark .subscriber-delete:hover{background:#63383a}
@media(max-width:640px){
  .subscriber-table{min-width:1050px}
  .subscriber-row{min-width:310px;gap:6px}
  .subscriber-actions{gap:5px}
  .subscriber-owner-filters,.subscriber-status-filters{overflow-x:auto;flex-wrap:nowrap}
  .subscriber-owner-filters .sales-filter,.subscriber-status-filters .sales-filter{flex:0 0 auto}
}
.agent-mode .agent-sale-actions .button:hover{background:#1e4d73}
.agent-mode .agent-sale-actions{display:grid!important;visibility:visible!important;grid-template-columns:repeat(3,minmax(120px,132px));max-width:none;flex:0 0 auto;gap:10px}
.agent-mode .agent-sale-actions .button{display:inline-flex!important;visibility:visible!important;opacity:1!important;width:100%;min-width:120px;max-width:132px;min-height:42px;padding-inline:8px;background-color:#245b89!important;border:1px solid #527b9b;color:#fff!important}
@media(max-width:1050px){.agent-mode .agent-dashboard-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.agent-mode .agent-dashboard-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.agent-mode .agent-sale-actions{max-width:100%;grid-template-columns:repeat(2,minmax(120px,1fr))}.agent-mode .agent-sale-actions .button{width:100%;min-width:0;max-width:none}}
@media(max-width:480px){.agent-mode .agent-sale-actions{grid-template-columns:1fr}}
.brand-icon{object-fit:cover;background:#fff;border:0;border-radius:10px}
.login-mark{overflow:hidden;background:#fff}
.login-mark img{display:block;width:100%;height:100%;object-fit:cover}