/* === Reset === */
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f4f4f0;color:#1a1a1a;font-size:15px;}

/* === Topbar === */
.topbar{background:#fff;border-bottom:1px solid #e0e0dc;padding:.75rem 1.25rem;display:flex;align-items:center;justify-content:space-between;}
.topbar-title{font-size:17px;font-weight:700;}
.topbar-right{display:flex;align-items:center;gap:12px;}
.topbar-user{font-size:13px;color:#555;}
.role-badge{background:#EEEDFE;color:#3C3489;border-radius:99px;font-size:11px;padding:1px 8px;margin-left:5px;font-weight:500;}
.logout-btn{font-size:13px;color:#888;text-decoration:none;border:1px solid #ddd;border-radius:6px;padding:4px 10px;}
.logout-btn:hover{background:#f4f4f0;}

/* === Layout === */
.container{max-width:1000px;margin:0 auto;padding:1rem;}
.loading{text-align:center;padding:3rem;color:#888;}
.error-msg{background:#FCEBEB;color:#791F1F;border-radius:10px;padding:1rem;}

/* === Tabs === */
.nav-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:1rem;}
.tab{padding:7px 13px;border-radius:8px;font-size:13px;border:1px solid #ddd;background:#fff;color:#555;cursor:pointer;white-space:nowrap;}
.tab:hover{background:#f0f0ec;}
.tab.active{background:#3C3489;color:#fff;border-color:#3C3489;font-weight:500;}
.tab.order-tab.active{background:#A32D2D;border-color:#A32D2D;}
.tab.admin-tab.active{background:#1a5276;border-color:#1a5276;}
.order-badge{background:#fff;color:#A32D2D;border-radius:99px;font-size:11px;padding:1px 7px;margin-left:5px;font-weight:700;}

/* === Group actions bar === */
.group-actions-bar{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:10px;flex-wrap:wrap;gap:10px;}
.section-lbl{font-size:14px;font-weight:600;color:#333;}
.group-actions-buttons{display:flex;gap:8px;flex-wrap:wrap;}
.fill-btn{background:#fff;border:1px solid #3C3489;color:#3C3489;border-radius:8px;padding:6px 14px;font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap;}
.fill-btn:hover{background:#EEEDFE;}
.savebar-top{margin-bottom:10px;}
.savebar-top .save-info{font-size:13px;}

/* === Count table === */
.count-table{background:#fff;border:1px solid #e0e0dc;border-radius:12px;overflow:hidden;margin-bottom:1rem;}
.count-header{display:grid;grid-template-columns:2fr 1fr 70px 150px 130px;gap:8px;padding:10px 16px;background:#f4f4f0;font-size:12px;font-weight:600;color:#666;letter-spacing:.03em;border-bottom:1px solid #e0e0dc;}
.count-row{display:grid;grid-template-columns:2fr 1fr 70px 150px 130px;gap:8px;padding:10px 16px;border-bottom:1px solid #f4f4f0;align-items:center;}
.count-row:last-child{border-bottom:none;}
.count-row:hover{background:#fafaf8;}
.count-name{font-size:14px;font-weight:500;}
.count-note{display:block;font-size:11px;color:#aaa;font-style:italic;margin-top:2px;}
.count-supplier{font-size:13px;color:#666;}
.count-buffer{font-size:13px;color:#888;text-align:center;}
.count-input-wrap{display:flex;justify-content:center;align-items:center;gap:6px;}
.count-input-wrap .cbtn{width:32px;height:32px;border-radius:7px;border:1px solid #ddd;background:#f4f4f0;font-size:18px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;user-select:none;}
.count-input-wrap .cbtn:active{transform:scale(.92);background:#e8e8e4;}
.count-input{width:56px;border:1px solid #ddd;border-radius:8px;padding:6px 4px;font-size:16px;font-weight:600;text-align:center;color:#1a1a1a;}
.count-input:focus{outline:none;border-color:#3C3489;box-shadow:0 0 0 2px #EEEDFE;}

/* === Badges === */
.badge{display:inline-block;font-size:11px;padding:3px 9px;border-radius:99px;white-space:nowrap;}
.ok  {background:#EAF3DE;color:#27500A;}
.warn{background:#FCEBEB;color:#791F1F;}
.low {background:#FAEEDA;color:#633806;}

/* === Timestamps === */
.last-saved{display:block;font-size:12px;color:#999;margin-top:3px;}

/* === Save bar === */
.savebar{background:#fff;border:1px solid #e0e0dc;border-radius:12px;padding:.75rem 1.25rem;display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;}
.savebtn{background:#3C3489;color:#fff;border:none;border-radius:8px;padding:10px 22px;font-size:14px;font-weight:600;cursor:pointer;}
.savebtn:hover{background:#2e2870;}
.savebtn:active{transform:scale(.97);}
.savebtn.small{padding:7px 16px;font-size:13px;}
.save-info{font-size:13px;color:#888;}
.save-info.saved  {color:#27500A;font-weight:500;}
.save-info.changed{color:#A32D2D;}

/* === Order list === */
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:1rem;}
.stat{background:#fff;border:1px solid #e0e0dc;border-radius:10px;padding:.75rem 1rem;}
.stat-label{font-size:12px;color:#888;margin-bottom:4px;}
.stat-val{font-size:24px;font-weight:600;}
.stat-val.red{color:#A32D2D;}

.order-section{background:#fff;border:1px solid #e0e0dc;border-radius:12px;overflow:hidden;}
.order-table{width:100%;border-collapse:collapse;table-layout:fixed;}
.order-table th{padding:8px 16px;font-size:12px;font-weight:600;color:#666;text-align:left;background:#fafaf8;border-bottom:1px solid #e0e0dc;position:sticky;top:0;}
.order-table td{padding:10px 16px;font-size:14px;border-bottom:1px solid #f4f4f0;vertical-align:middle;overflow:hidden;text-overflow:ellipsis;}
.group-header-row{width:100%;}
.group-header-row td{background:#f0effc;color:#3C3489;font-size:13px;padding:0;cursor:pointer;user-select:none;border-bottom:1px solid #dddaf8;border-top:2px solid #dddaf8;width:100%;}
.group-header-row:hover td{background:#e8e6f8;}
.group-header-inner{display:flex;align-items:center;flex-wrap:wrap;gap:4px;padding:8px 16px;width:100%;box-sizing:border-box;}
.group-header-row .collapse-arrow{margin-right:6px;}
.group-header-row .supplier-count{margin-left:8px;font-size:11px;color:#8b89c0;font-weight:400;}
.group-header-row .group-header-ts{margin-left:auto;font-size:11px;color:#8b89c0;font-weight:400;}

/* Skiftende rækkefarver i bestillingsliste */
.order-table tbody tr.item-row:nth-of-type(even) td{background:#f7f7f5;}
.order-table tbody tr.item-row:hover td{background:#efefe9;}

.empty{text-align:center;padding:2.5rem 1rem;color:#888;font-size:14px;}
.empty-icon{font-size:36px;display:block;margin-bottom:8px;}

/* === Collapse === */
.collapsible{cursor:pointer;user-select:none;}
.collapse-arrow{font-size:11px;color:#888;width:14px;display:inline-block;flex-shrink:0;}
.group-count,.supplier-count{margin-left:auto;font-size:11px;color:#999;font-weight:400;}

/* === Admin === */
.admin-add-card{background:#fff;border:1px solid #e0e0dc;border-radius:12px;padding:1rem 1.25rem;margin-bottom:1rem;}
.admin-add-title{font-size:14px;font-weight:600;margin-bottom:10px;color:#333;}
.admin-add-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.admin-add-row input,.admin-add-row select{border:1px solid #ddd;border-radius:8px;padding:8px 10px;font-size:13px;min-width:0;}
.admin-group{background:#fff;border:1px solid #e0e0dc;border-radius:12px;margin-bottom:10px;overflow:hidden;}
.admin-group-header{background:#f4f4f0;padding:10px 1rem;font-size:13px;font-weight:600;color:#444;display:flex;align-items:center;gap:8px;}
.admin-empty{padding:10px 1rem;font-size:13px;color:#aaa;border-top:1px solid #f4f4f0;}
.admin-item{display:flex;align-items:center;justify-content:space-between;padding:10px 1rem;border-top:1px solid #f4f4f0;gap:8px;}
.admin-item.editing{background:#fafaf8;}
.admin-item-info{flex:1;min-width:0;}
.admin-item-name{font-size:14px;font-weight:500;display:block;}
.admin-item-meta{font-size:12px;color:#888;}
.admin-item-actions{display:flex;gap:5px;flex-shrink:0;}
.abtn{padding:5px 10px;border-radius:6px;border:1px solid #ddd;background:#f8f8f6;font-size:12px;cursor:pointer;color:#444;}
.abtn:hover{background:#eee;}
.abtn:disabled{opacity:.3;cursor:default;}
.abtn.edit{border-color:#3C3489;color:#3C3489;}
.abtn.edit:hover{background:#EEEDFE;}
.abtn.del{border-color:#A32D2D;color:#A32D2D;}
.abtn.del:hover{background:#FCEBEB;}
.edit-label{font-size:12px;color:#888;display:block;margin-bottom:4px;}
.inline-edit{width:100%;padding:4px 0;}
.inline-edit-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.inline-field{display:flex;flex-direction:column;flex:1;min-width:120px;}
.inline-field input,.inline-field select{border:1px solid #ddd;border-radius:8px;padding:7px 10px;font-size:13px;}
.inline-edit-actions{display:flex;gap:8px;}

/* === Responsive === */
@media(max-width:700px){
  .count-header{display:none;}
  .count-row{grid-template-columns:1fr 1fr;gap:6px;padding:12px 14px;}
  .count-name{grid-column:1/-1;font-size:15px;}
  .count-supplier{font-size:12px;color:#888;}
  .count-buffer::before{content:"Buffer: ";color:#aaa;}
  .count-input-wrap .cbtn{width:42px;height:42px;font-size:22px;}
  .count-input{width:54px;font-size:18px;padding:8px 2px;}
  .group-actions-bar{flex-direction:column;align-items:stretch;}
  .group-actions-buttons{justify-content:stretch;}
  .group-actions-buttons .savebtn,.group-actions-buttons .fill-btn{flex:1;}
  .admin-add-row{flex-direction:column;}
  .admin-add-row input,.admin-add-row select,.admin-add-row .savebtn{width:100%;}
  .inline-edit-row{flex-direction:column;}
}