﻿/* styles.css — farger + layout */

:root{
  --bg:#f1f0f0;           /* bakgrunn */
  --text:#f1f0f0;         /* tekst */
  --muted:#9fb0c6;        /* hjelpetekst */

  --card:#08172e;         /* kortbakgrunn */
  --card-border:#435A7F;  /* kantlinjer */

  --input:#2B3A58;        /* inputbakgrunn */
  --input-border:#435A7F; /* inputkant */
  --control-height:42px;

  --accent:#2B3A58;       /* primæraksent (knapp/fokus) */
  --accent-weak:#435A7F;  /* lys aksent (header, logo-bakgrunn) */

  --success:#26b36a;      /* suksessstatus */
  --warning:#febe10;      /* status/varsel */
  --sidebar-width:240px;
  --sidebar-collapsed-width:72px;
}

*{box-sizing:border-box}
[hidden]{display:none !important;}
.app-icon-sprite{
  position:absolute;
  width:0;
  height:0;
  overflow:hidden;
}
html,body{height:100%}
body{
  margin:0; padding:24px;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:var(--bg); color:var(--text);
  transition:padding-left .24s cubic-bezier(.2, .8, .2, 1);
}

body:has(.app-shell){
  padding-left:calc(var(--sidebar-width) + 24px);
}

body:has(.app-shell.is-sidebar-collapsed){
  padding-left:calc(var(--sidebar-collapsed-width) + 24px);
}

main.app-views{
  display:flex;
  flex-direction:column;
  gap:16px;
  margin-top:16px;
}

.app-tab-nav{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.tab-btn{
  border:1px solid var(--card-border);
  background:transparent;
  color:var(--muted);
  border-radius:10px;
  padding:10px 14px;
  cursor:pointer;
  font:inherit;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}

.tab-btn:hover{
  color:var(--text);
  border-color:var(--accent-weak);
}

.tab-btn.is-active{
  background:var(--accent);
  border-color:var(--accent);
  color:#fff;
}

.view-stack{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.dashboard-card{
  padding:24px;
}

.dashboard-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  column-gap:16px;
  row-gap:0;
  flex-wrap:wrap;
  margin-bottom:0;
}

.dashboard-intro{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:58px;
  justify-content:flex-start;
}

.dashboard-intro h2{
  margin:0;
  color:var(--text);
}

.dashboard-intro .muted-text{
  margin:0;
}

.dashboard-actions{
  display:flex;
  flex-direction:row;
  gap:8px;
  align-items:flex-end;
  flex-wrap:wrap;
  justify-content:flex-start;
  flex-basis:100%;
  margin-top:0;
}

.dashboard-sort-row{
  display:flex;
  flex-direction:row;
  gap:8px;
  align-items:flex-end;
  justify-content:flex-start;
  flex-wrap:wrap;
}

.dashboard-sort-controls{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:180px;
}

.dashboard-sort-controls label{
  color:var(--muted);
  font-size:0.8rem;
}

.dashboard-sort-controls select{
  min-width:180px;
  height:var(--control-height);
}

.dashboard-search-controls{
  min-width:240px;
}

.dashboard-search-controls input{
  min-width:240px;
  height:var(--control-height);
}

.project-list{
  margin-top:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.project-row{
  border:1px solid var(--card-border);
  border-radius:12px;
  padding:16px;
  background:rgba(8,23,46,0.55);
  color:var(--text);
  display:flex;
  flex-direction:column;
  gap:12px;
}

.project-row-head{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:flex-start;
  gap:24px;
}

.project-row-title{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.project-title-row{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin:0 0 6px;
}

.project-row-title h3{
  margin:0;
  font-size:1.5em;
  line-height:1.2;
}

.project-flow-status-badge{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--card-border);
  border-radius:999px;
  padding:4px 10px;
  background:rgba(148,163,184,0.18);
  color:var(--muted);
  font-size:0.92rem;
  font-weight:700;
  line-height:1;
}

.project-status-badge{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--card-border);
  border-radius:999px;
  padding:4px 10px;
  background:rgba(148,163,184,0.18);
  color:var(--muted);
  font-size:0.92rem;
  font-weight:700;
  line-height:1;
  cursor:pointer;
}

.project-status-badge:disabled{
  cursor:not-allowed;
  opacity:0.7;
}

.project-flow-status-badge.is-success{
  border-color:rgba(74,222,128,0.72);
  background:rgba(34,197,94,0.16);
  color:#4ade80;
}

.project-status-badge.is-success{
  border-color:rgba(74,222,128,0.72);
  background:rgba(34,197,94,0.16);
  color:#4ade80;
}

.project-flow-status-badge.is-warning{
  border-color:rgba(254,190,16,0.82);
  background:rgba(254,190,16,0.14);
  color:var(--warning);
}

.project-flow-status-badge.is-danger{
  border-color:rgba(248,113,113,0.78);
  background:rgba(239,68,68,0.14);
  color:#f87171;
}

.project-status-badge.is-danger{
  border-color:rgba(248,113,113,0.78);
  background:rgba(239,68,68,0.14);
  color:#f87171;
}

.project-status-badge.is-done{
  border-color:rgba(96,165,250,0.72);
  background:rgba(59,130,246,0.16);
  color:#93c5fd;
}

.project-flow-status-badge.is-idle{
  border-color:rgba(148,163,184,0.36);
  background:rgba(148,163,184,0.14);
  color:rgba(203,213,225,0.78);
}

.project-status-badge.is-idle{
  border-color:rgba(148,163,184,0.36);
  background:rgba(148,163,184,0.14);
  color:rgba(203,213,225,0.78);
}

.project-row-title > p:not(.project-margin-badge){
  margin:0;
  color:var(--text);
  font-size:1rem;
}

.project-row-meta{
  margin:0;
  color:var(--text);
  font-size:1rem;
}

.project-info-row{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}

.project-info-row > span{
  min-width:0;
}

.project-field-text strong{
  color:var(--text);
  font-weight:800;
}

.project-info-row .project-inline-selectors{
  min-width:0;
}

.project-row .addon-selectors{
  color:var(--text);
}

.project-margin-badge{
  margin:0;
  border:1px solid var(--card-border);
  border-radius:999px;
  padding:0 10px;
  background:var(--input);
  color:var(--text);
  font-size:1.17em;
  font-weight:600;
  height:34px;
  min-height:34px;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
}

.project-margin-badge.is-mixed,
.project-margin-badge.is-warning{
  border-color:var(--warning);
  color:var(--warning);
}

.project-margin-row{
  margin-top:14px;
  margin-bottom:14px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.project-margin-btn{
  height:34px;
  min-height:34px;
  padding:4px 10px;
  font-size:0.95rem;
  line-height:1;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
}

.project-row-actions{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
}

.project-action-buttons{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.project-detail-toggle-btn{
  flex:0 0 98px;
  width:98px;
  min-width:98px;
  max-width:98px;
  white-space:nowrap;
}

.project-body-grid{
  display:grid;
  grid-template-columns:minmax(360px, 1fr) minmax(360px, 1fr) max-content minmax(0, 1fr) minmax(0, 1fr);
  column-gap:48px;
  align-items:start;
}

.project-info-column{
  grid-column:1;
}

.project-metrics-column{
  grid-column:2;
}

.project-action-addon-stack{
  grid-column:3;
}

.project-info-column,
.project-metrics-column{
  display:grid;
  grid-template-rows:repeat(5, 24px);
  row-gap:8px;
  color:var(--text);
}

.project-info-column{
  color:var(--text);
}

.project-action-addon-stack{
  display:grid;
  grid-template-rows:repeat(5, 24px);
  row-gap:8px;
}

.project-info-row:nth-child(1){
  grid-row:1;
}

.project-info-row:nth-child(2){
  grid-row:2;
}

.project-info-row:nth-child(3){
  grid-row:3;
}

.project-info-row:nth-child(4){
  grid-row:4;
}

.project-info-row:nth-child(5){
  grid-row:5;
}

.project-metric-row:nth-child(1),
.project-action-addon-row:nth-child(1){
  grid-row:1;
}

.project-metric-row:nth-child(2){
  grid-row:2;
}

.project-action-addon-row:nth-child(2){
  grid-row:3;
}

.project-metric-row:nth-child(3){
  grid-row:3;
}

.project-action-addon-row:nth-child(3){
  grid-row:5;
}

.project-metric-row:nth-child(4){
  grid-row:5;
}

.project-metric-row,
.project-action-addon-row{
  min-height:24px;
  display:flex;
  align-items:center;
  color:var(--text);
}

.project-metric-row.is-muted-italic{
  font-style:italic;
  opacity:.62;
}

.project-action-addon-row .addon-selectors{
  min-height:24px;
  gap:14px;
}

.project-action-addon-row .addon-selectors label{
  height:16px;
  min-height:16px;
  line-height:16px;
  pointer-events:none;
}

.project-action-addon-row .addon-selectors input[type="checkbox"]{
  width:13px;
  height:13px;
  min-width:13px;
  min-height:13px;
  padding:0;
  pointer-events:auto;
}

.btn.danger{
  background:#7f1d1d;
  border-color:#7f1d1d;
  color:#fff;
}

.btn.danger:hover{
  background:#991b1b;
  border-color:#991b1b;
}

.project-detail{
  margin-top:4px;
  border-top:1px solid var(--card-border);
  padding-top:12px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.project-detail-head{
  display:flex;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  align-items:flex-start;
}

.project-detail-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.project-detail-lines{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.project-line-item{
  display:flex;
  gap:8px;
  align-items:stretch;
}

.project-line-main{
  flex:1 1 auto;
  min-width:0;
  border:1px solid var(--card-border);
  border-radius:10px;
  background:rgba(43,58,88,0.25);
  padding:12px 16px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.project-line-empty{
  margin:0;
  font-style:italic;
  color:var(--muted);
}

.project-line-row{
  width:100%;
  flex:1 1 auto;
  border:0;
  border-radius:0;
  background:transparent;
  padding:0;
  display:flex;
  align-items:center;
  gap:16px;
  text-align:left;
}

.line-action-buttons{
  display:flex;
  flex-direction:row;
  justify-content:flex-end;
  align-items:flex-start;
  gap:8px;
  align-self:stretch;
}

.line-action-buttons .line-delete-btn{
  margin-left:auto;
}

.line-edit-btn,
.line-delete-btn{
  width:auto;
  flex:0 0 auto;
  white-space:nowrap;
}

.project-line-row span{
  flex:1 1 auto;
}

.project-line-row .line-name{
  font-weight:600;
  max-width:180px;
}

.project-line-row .line-info{
  color:var(--muted);
  font-size:0.9rem;
}

.project-line-row .line-total{
  flex:0 0 auto;
  font-weight:600;
  white-space:nowrap;
}

.project-line-row .line-material{
  flex:0 0 auto;
  color:var(--muted);
  font-size:0.9rem;
  white-space:nowrap;
}

.project-line-row .line-updated{
  flex:0 0 auto;
  color:var(--muted);
  font-size:0.85rem;
  white-space:nowrap;
}

.project-inline-selectors{
  margin-top:0;
}

.line-addon-selectors{
  padding-top:8px;
  border-top:1px solid rgba(67,90,127,0.5);
}

.empty-state{
  border:1px dashed var(--card-border);
  border-radius:12px;
  padding:32px 16px;
  text-align:center;
  color:var(--muted);
}

.view-toolbar{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  padding:0;
  margin-bottom:0;
}

.btn.ghost-btn{
  background:transparent;
  color:var(--muted);
  border-color:var(--card-border);
}

.btn.ghost-btn:hover{
  background:rgba(255,255,255,0.1);
  color:var(--text);
}

a.nav-page-btn{
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

a.nav-page-btn.is-disabled,
a.nav-page-btn[aria-disabled="true"]{
  opacity:0.55;
  cursor:not-allowed;
  pointer-events:none;
}

.project-pill{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  padding:8px 12px;
  border:1px solid var(--card-border);
  border-radius:10px;
  background:var(--card);
}

.project-pill-field{
  display:flex;
  flex-direction:column;
  min-width:120px;
}

.project-pill button{
  margin-left:auto;
}

.pill-label{
  font-size:0.75rem;
  text-transform:uppercase;
  letter-spacing:0.08em;
  color:var(--muted);
}

.pill-value{
  font-weight:600;
  color:var(--text);
}

header h1{margin:0 0 6px 0; color:var(--muted)}
header p{margin:0 0 16px 0;color:var(--muted)}
.results-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  font-size:1.5rem;
  padding-bottom:12px;
  margin-bottom:24px;
  border-bottom:1px solid var(--card-border);
}
.results-heading h2{
  margin:0;
  font-size:inherit;
}
.header-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
}
.auth-controls{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.auth-controls .btn,
.auth-controls button{
  width:auto;
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  font-size:1rem;
  line-height:1.2;
}
.auth-user{
  color:var(--muted);
  font-size:0.9rem;
}
.market-bar{
  margin:16px 0;
  padding:12px;
  border:1px solid var(--card-border);
  border-radius:12px;
  background:rgba(8,23,46,0.65);
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.market-item{
  flex:1 1 160px;
  min-width:160px;
  padding:10px 12px;
  border:1px solid rgba(67,90,127,0.6);
  border-radius:10px;
  background:rgba(43,58,88,0.25);
  display:flex;
  flex-direction:column;
  gap:4px;
}
.market-item.market-updated{
  max-width:240px;
}
.market-label{
  font-size:0.75rem;
  letter-spacing:0.05em;
  text-transform:uppercase;
  color:var(--muted);
}
.market-value{
  font-size:1.35rem;
  font-weight:600;
  color:var(--text);
  white-space:nowrap;
}
.market-fx-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:4px 12px;
  align-items:end;
}
.market-change-value{
  font-size:1.35rem;
  font-weight:600;
  white-space:nowrap;
}
.market-change-value.is-up{
  color:var(--success);
}
.market-change-value.is-down{
  color:var(--warning);
}
.market-change-value.is-flat{
  color:var(--muted);
}
.market-value.small{
  font-size:1rem;
}
#marketUpdated{
  font-size:1.35rem;
  color:var(--warning);
}
#marketUpdated.market-updated-ok{
  color:var(--success);
}
#marketUpdated.market-updated-warning{
  color:var(--warning);
}
.market-note{
  font-size:0.85rem;
  color:var(--muted);
}
.market-status{
  font-size:0.8rem;
  color:var(--muted);
}
.market-status.error{
  color:var(--warning);
}
.market-status.ok{
  color:var(--success);
}
.login-form,
.project-form{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.login-form label,
.project-form label{
  font-size:0.95rem;
  color:var(--text);
}
.login-form input,
.project-form input{
  margin-top:4px;
  border:1px solid var(--card-border);
  background:var(--card);
  color:var(--text);
}
.login-form input::placeholder,
.project-form input::placeholder{
  color:var(--text);
  opacity:0.55;
}
.login-form input:-webkit-autofill,
.login-form input:-webkit-autofill:hover,
.login-form input:-webkit-autofill:focus,
.project-form input:-webkit-autofill,
.project-form input:-webkit-autofill:hover,
.project-form input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--text);
  box-shadow:0 0 0 1000px var(--card) inset;
  transition:background-color 5000s ease-in-out 0s;
}
.project-form input:focus{
  border-color:var(--card-border);
  box-shadow:0 0 0 3px rgba(67,90,127,0.3);
}
.login-error,
.project-error{
  min-height:1em;
  margin:0;
  color:var(--warning);
}
.register-inline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:0.9rem;
}
.btn.btn-small{
  padding:6px 10px;
  font-size:0.85rem;
}
.project-form .actions{
  margin-top:4px;
}
.project-status-options{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  margin:12px 0 16px;
}
.project-status-options .btn.is-active{
  border-color:var(--warning);
  box-shadow:0 0 0 2px rgba(254,190,16,0.22);
}
.suggest-wrapper{
  position:relative;
}
.suggestions{
  list-style:none;
  margin:6px 0 0 0;
  padding:4px 0;
  position:absolute;
  left:0;
  right:0;
  top:100%;
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:8px;
  max-height:160px;
  overflow-y:auto;
  z-index:60;
}
.suggestions li{
  padding:6px 10px;
  cursor:pointer;
  color:var(--text);
}
.suggestions li:hover{
  background:rgba(43,58,88,0.35);
}
.project-meta{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  font-size:inherit;
  color:var(--muted);
}
.project-meta .project-field{
  display:flex;
  gap:6px;
  align-items:center;
}
.project-meta strong{
  color:var(--text);
  font-weight:600;
}
.project-meta button{
  margin-left:4px;
}
.btn-inline{
  padding:6px 12px;
}
.card-header h2{margin:0; color:var(--text)}

.card{
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:14px;
  padding:16px;
  margin-bottom:16px;
}

/* Logo + tittel inne i parametre-boksen */
.card-header{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
  margin-bottom:8px;
  padding-bottom:8px;
  border-bottom:1px solid var(--card-border);
}
.logo{
  display:block;
  width:180px;            /* tilpasset, ikke bredere enn boksen */
  max-width:100%;
  height:auto;
  background:var(--card);
  border-radius:8px;
  padding:6px;
}

.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin:12px 0;
}

label{display:block;color:var(--text)}

input,select,button{
  width:100%;
  min-height:var(--control-height);
  padding:10px;
  border-radius:10px;
  border:1px solid var(--input-border);
  background:var(--input);
  color:var(--text);
  outline:none;
}
input::placeholder{color:#6b7280}

input:focus,select:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(59,130,246,0.25); /* diskret fokus */
}

button{
  width:auto;
  padding:10px 14px;
  cursor:pointer;
  background:var(--accent);
  border:1px solid var(--accent);
  color:white;
  border-radius:10px;
  font:inherit;
}
button:hover{filter:brightness(1.05)}
button:disabled{
  opacity:0.6;
  cursor:not-allowed;
}
button:disabled:hover{filter:none}

.btn{
  width:auto;
  min-height:var(--control-height);
  height:var(--control-height);
  padding:10px 14px;
  cursor:pointer;
  background:var(--accent);
  border:1px solid var(--accent);
  color:#fff;
  border-radius:10px;
  font:inherit;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1.2;
  box-sizing:border-box;
}

.btn:hover{
  filter:brightness(1.05);
}

.btn.alt{
  background:var(--input);
  border-color:var(--input-border);
}
.app-shell{
  display:block;
  margin-top:16px;
}
.app-shell .view-toolbar{
  display:none;
}
.dashboard-sidebar{
  position:fixed;
  inset:0 auto 0 0;
  width:var(--sidebar-width);
  background:var(--card);
  border-right:1px solid var(--card-border);
  padding:12px;
  min-height:100vh;
  z-index:40;
  overflow:hidden auto;
  transition:width .24s cubic-bezier(.2, .8, .2, 1);
  display:flex;
  flex-direction:column;
}
body.is-auth-locked .dashboard-sidebar::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  background:rgba(8,23,46,0.45);
  backdrop-filter:blur(10px);
}
body.is-auth-locked .sidebar-nav-section:not(.is-bottom),
body.is-auth-locked #dashboardAdminNav,
body.is-auth-locked .sidebar-auth-block .auth-user,
body.is-auth-locked #logoutBtn{
  filter:blur(7px);
  opacity:.28;
  pointer-events:none;
  user-select:none;
}
body.is-auth-locked .sidebar-top-row{
  position:relative;
  z-index:6;
  filter:none;
  opacity:1;
  pointer-events:auto;
}
body.is-auth-locked .sidebar-auth-block{
  position:relative;
  z-index:5;
  margin-top:auto;
}
body.is-auth-locked .sidebar-auth-actions{
  position:relative;
  z-index:6;
}
body.is-auth-locked #loginBtn{
  position:relative;
  z-index:7;
  filter:none;
  opacity:1;
  pointer-events:auto;
}
body.is-auth-locked .dashboard-main,
body.is-auth-locked > header{
  filter:blur(9px);
  opacity:.38;
  pointer-events:none;
  user-select:none;
}
.app-shell.is-sidebar-collapsed .dashboard-sidebar{
  width:var(--sidebar-collapsed-width);
}
.sidebar-top-row{
  display:flex;
  align-items:center;
  gap:12px;
  padding-bottom:14px;
  margin-bottom:10px;
  border-bottom:1px solid var(--card-border);
  min-height:58px;
}
.sidebar-collapse-btn{
  width:44px;
  height:44px;
  padding:0;
  border-radius:8px;
  border:1px solid var(--input-border);
  background:var(--input);
  color:var(--text);
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 44px;
}
.sidebar-collapse-icon{
  position:relative;
  width:18px;
  height:18px;
  display:block;
}
.sidebar-collapse-icon::before,
.sidebar-collapse-icon::after{
  content:"";
  position:absolute;
  left:1px;
  right:1px;
  top:8px;
  height:2px;
  border-radius:2px;
  background:currentColor;
  transition:transform .24s cubic-bezier(.2, .8, .2, 1), box-shadow .24s cubic-bezier(.2, .8, .2, 1);
}
.sidebar-collapse-icon::before{
  transform:rotate(45deg);
}
.sidebar-collapse-icon::after{
  transform:rotate(-45deg);
}
.app-shell.is-sidebar-collapsed .sidebar-collapse-icon{
  transform:none;
}
.app-shell.is-sidebar-collapsed .sidebar-collapse-icon::before{
  transform:translateY(-6px);
  box-shadow:0 6px 0 currentColor;
}
.app-shell.is-sidebar-collapsed .sidebar-collapse-icon::after{
  transform:translateY(6px);
}
.sidebar-brand{
  display:flex;
  align-items:center;
  transition:opacity .16s ease;
  min-width:0;
  flex:1 1 auto;
  text-decoration:none;
}
.app-shell.is-sidebar-collapsed .sidebar-brand{
  opacity:0;
  pointer-events:none;
}
.sidebar-brand .logo-mask{
  width:150px;
  max-width:100%;
}
.sidebar-nav{
  display:flex;
  flex-direction:column;
  gap:6px;
  flex:1 1 auto;
  min-height:0;
}

.sidebar-nav-section{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.sidebar-nav-section.is-bottom{
  margin-top:auto;
  flex:0 0 auto;
}

.sidebar-separator{
  border-top:1px solid var(--card-border);
  margin:10px 0 8px;
}
.sidebar-nav-item{
  width:100%;
  min-height:44px;
  justify-content:flex-start;
  text-align:left;
  text-decoration:none;
  color:var(--text);
  background:transparent;
  border:1px solid transparent;
  border-radius:8px;
  padding:10px 12px;
  font:inherit;
  display:flex;
  align-items:center;
  gap:10px;
  overflow:hidden;
  transition:background-color .16s ease, border-color .16s ease, color .16s ease;
}
.sidebar-nav-item:hover{
  background:rgba(43,58,88,0.45);
  border-color:var(--input-border);
  filter:none;
}
.sidebar-nav-item.is-active{
  background:var(--input);
  border-color:var(--card-border);
}
.sidebar-nav-icon{
  width:24px;
  height:24px;
  flex:0 0 24px;
  border-radius:6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--text);
  fill:currentColor;
  padding:3px;
  background:rgba(67,90,127,0.45);
}
.sidebar-nav-label{
  white-space:nowrap;
  opacity:1;
  transition:opacity .12s ease;
}
.app-shell.is-sidebar-collapsed .sidebar-nav-label{
  opacity:0;
  pointer-events:none;
}
.app-shell.is-sidebar-collapsed .sidebar-nav-icon{
  margin:0;
}
.sidebar-auth-block{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.sidebar-auth-block .auth-user{
  display:block;
  min-height:18px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:0.82rem;
  padding:0 4px;
}
.sidebar-auth-actions{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.sidebar-auth-actions .btn{
  width:100%;
  min-height:44px;
}
.sidebar-auth-btn{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  overflow:hidden;
  transition:background-color .16s ease, border-color .16s ease, color .16s ease;
}
.sidebar-auth-btn .sidebar-nav-icon{
  flex:0 0 24px;
}
.sidebar-auth-label{
  white-space:nowrap;
}
.app-shell.is-sidebar-collapsed .sidebar-auth-block .auth-user:not([hidden]){
  visibility:hidden;
}
.app-shell.is-sidebar-collapsed .sidebar-auth-block{
  align-items:stretch;
}
.app-shell.is-sidebar-collapsed .sidebar-auth-actions{
  align-items:stretch;
  width:100%;
}
.app-shell.is-sidebar-collapsed .sidebar-auth-actions .btn{
  width:100%;
  min-width:0;
  height:44px;
  min-height:44px;
  justify-content:flex-start;
}
.app-shell.is-sidebar-collapsed .sidebar-auth-label{
  opacity:0;
  pointer-events:none;
}
.dashboard-main{
  min-width:0;
  padding-bottom:16px;
}
.dashboard-page{
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:14px;
  padding:16px;
  margin-bottom:16px;
}
.placeholder-page{
  min-height:360px;
}
.placeholder-header{
  max-width:680px;
  min-height:58px;
}
.placeholder-header h2{
  margin:0 0 8px;
  color:var(--text);
}
.placeholder-header .muted-text{
  margin:0;
}
.graph-toolbar{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin:18px 0 12px;
  padding-bottom:12px;
  border-bottom:1px solid var(--card-border);
}
.section-toolbar{
  margin:18px 0 12px;
  padding-bottom:12px;
  border-bottom:1px solid var(--card-border);
  min-height:76px;
  box-sizing:border-box;
}
.toolbar-left,
.toolbar-right{
  display:flex;
  align-items:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
.toolbar-left{
  justify-content:flex-start;
}
.toolbar-right{
  flex-direction:column;
  align-items:flex-end;
  justify-content:flex-end;
  margin-left:auto;
  gap:4px;
  min-height:64px;
}
.toolbar-right .graph-status{
  flex-basis:auto;
  text-align:right;
  align-self:flex-end;
  min-height:18px;
}
.graph-status{
  margin:0;
}
.graph-status.ok{
  color:var(--success);
}
.graph-status.error{
  color:var(--warning);
}
.form-modal-backdrop{
  position:fixed;
  inset:0;
  z-index:120;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(0,0,0,0.62);
}
.form-modal-backdrop[hidden]{
  display:none;
}
.form-modal-panel{
  width:min(1120px, calc(100vw - 48px));
  max-height:calc(100vh - 48px);
  display:flex;
  flex-direction:column;
  border:1px solid var(--card-border);
  border-radius:12px;
  background:var(--card);
  box-shadow:0 26px 80px rgba(0,0,0,0.48);
  overflow:visible;
}
.form-modal-panel:has(.project-flow-form){
  overflow:hidden;
}
.form-modal-header{
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid var(--card-border);
  background:rgba(43,58,88,0.42);
}
.form-modal-header h3{
  margin:0;
  color:var(--text);
  font-size:1.1rem;
}
.form-modal-close{
  width:36px;
  height:36px;
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--input-border);
  border-radius:8px;
  background:var(--input);
  color:var(--text);
  cursor:pointer;
  font:inherit;
}
.form-modal-body{
  min-height:0;
  padding:16px;
  overflow:visible;
}
.form-modal-panel:has(.project-flow-form) .form-modal-body{
  overflow:auto;
}
.form-modal-body > form{
  margin:0;
}
body.has-form-modal-open{
  overflow:hidden;
}
.graph-edit-form{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
  margin:0 0 14px;
  padding:14px;
  border:1px solid var(--card-border);
  border-radius:8px;
  background:rgba(43,58,88,0.18);
}
#calendarEventForm{
  grid-template-columns:repeat(6, minmax(0, 1fr));
}
#calendarEventForm .calendar-attendees-field,
#calendarEventForm > label:not(.calendar-date-field):not(.calendar-compact-field):not(.graph-wide-field){
  grid-column:span 3;
}
#calendarEventForm .calendar-date-field,
#calendarEventForm .calendar-compact-field{
  grid-column:span 1;
}
.graph-edit-form[hidden]{
  display:none;
}
.graph-edit-form label{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:var(--muted);
  font-size:0.86rem;
  font-weight:700;
}
.graph-edit-form .graph-wide-field{
  grid-column:1 / -1;
}
.graph-edit-form input,
.graph-edit-form select,
.graph-edit-form textarea{
  width:100%;
  min-width:0;
  border:1px solid var(--input-border);
  border-radius:8px;
  background:var(--input);
  color:var(--text);
  padding:10px 12px;
  font:inherit;
}
.graph-edit-form textarea{
  resize:vertical;
}
.calendar-attendees-field{
  display:flex;
  flex-direction:column;
  gap:8px;
  color:var(--muted);
  font-size:0.86rem;
  font-weight:700;
}
.calendar-attendee-input-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:8px;
  align-items:end;
}
.calendar-date-input-row{
  position:relative;
  display:block;
}
.calendar-date-input-row input[type="text"]{
  padding-right:44px;
}
.calendar-date-picker-btn{
  position:absolute;
  top:50%;
  right:6px;
  width:32px;
  min-height:32px;
  height:32px;
  padding:0;
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--text);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transform:translateY(-50%);
}
.calendar-date-picker-btn svg{
  width:18px;
  height:18px;
  fill:currentColor;
  opacity:0.85;
}
.calendar-date-picker-btn:hover{
  background:rgba(255,255,255,0.08);
}
.calendar-date-picker-btn:hover svg{
  opacity:1;
}
.calendar-hidden-date-picker{
  position:absolute;
  top:50%;
  right:44px;
  width:32px;
  height:32px;
  transform:translateY(-50%);
  opacity:0;
  pointer-events:none;
}
.calendar-date-picker-popover{
  position:absolute;
  top:calc(100% + 8px);
  right:6px;
  z-index:180;
  width:300px;
  padding:12px;
  border:1px solid var(--input-border);
  border-radius:8px;
  background:#07172e;
  box-shadow:0 18px 42px rgba(0,0,0,0.48);
}
.calendar-date-picker-popover[hidden]{
  display:none;
}
.calendar-date-picker-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin:0 0 8px;
}
.calendar-date-picker-title{
  color:var(--text);
  font-weight:700;
}
.calendar-date-picker-nav{
  display:flex;
  gap:4px;
}
.calendar-date-picker-nav button,
.calendar-date-picker-day{
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--text);
  cursor:pointer;
}
.calendar-date-picker-nav button{
  width:28px;
  height:28px;
  min-height:28px;
  padding:0;
}
.calendar-date-picker-nav button:hover,
.calendar-date-picker-day:hover{
  background:rgba(255,255,255,0.08);
}
.calendar-date-picker-grid{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:4px;
}
.calendar-date-picker-weekday,
.calendar-date-picker-day{
  min-width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0.88rem;
}
.calendar-date-picker-weekday{
  color:var(--muted);
  font-weight:700;
}
.calendar-date-picker-day.is-outside{
  color:rgba(220,230,248,0.42);
}
.calendar-date-picker-day.is-selected{
  background:var(--accent);
  color:#fff;
}
.calendar-date-picker-day.is-today:not(.is-selected){
  outline:1px solid var(--accent-weak);
}
.calendar-attendees-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  min-height:var(--control-height);
  align-items:center;
}
.calendar-attendee-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:32px;
  padding:4px 8px 4px 10px;
  border:1px solid var(--input-border);
  border-radius:8px;
  background:var(--input);
  color:var(--text);
  font-weight:500;
}
.calendar-attendee-chip button{
  width:22px;
  height:22px;
  min-height:22px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,0.08);
  color:var(--text);
  cursor:pointer;
  line-height:1;
}
.calendar-attendee-empty{
  color:var(--muted);
  font-weight:500;
}
@media (max-width: 900px){
  #calendarEventForm{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  #calendarEventForm .calendar-attendees-field,
  #calendarEventForm > label:not(.calendar-compact-field):not(.graph-wide-field){
    grid-column:1 / -1;
  }
  #calendarEventForm .calendar-compact-field{
    grid-column:span 1;
  }
}
@media (max-width: 560px){
  #calendarEventForm{
    grid-template-columns:1fr;
  }
  #calendarEventForm > label,
  #calendarEventForm .graph-wide-field{
    grid-column:1 / -1;
  }
  .calendar-attendee-input-row{
    grid-template-columns:1fr;
  }
}
.graph-edit-actions,
.graph-inline-actions,
.graph-card-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.graph-edit-actions{
  grid-column:1 / -1;
}
.graph-inline-actions{
  justify-content:flex-end;
  margin:0 0 12px;
  padding:10px 0;
  border-bottom:1px solid var(--card-border);
}
.email-message-actions{
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  margin:0;
  padding:0;
  border-bottom:0;
  gap:4px;
}
.email-message-action-buttons{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.graph-card-actions{
  margin-top:8px;
}
.calendar-period-controls{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:var(--control-height);
  height:auto;
  border:0;
  border-radius:0;
  overflow:visible;
  background:transparent;
}
.calendar-period-label{
  min-width:220px;
  min-height:var(--control-height);
  height:var(--control-height);
  display:inline-flex;
  align-items:center;
  text-align:left;
  margin:0;
  text-transform:capitalize;
  color:var(--text);
  padding:0 14px;
  font-weight:600;
  border:1px solid var(--input-border);
  border-radius:10px;
  background:var(--input);
}
.calendar-today-btn,
.calendar-period-btn{
  min-width:var(--control-height);
  min-height:var(--control-height);
  height:var(--control-height);
  border:1px solid var(--input-border);
  border-radius:10px;
  background:var(--input);
  color:var(--text);
  cursor:pointer;
  font:inherit;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.calendar-today-btn{
  width:auto;
  padding:0 14px;
}
.calendar-period-btn{
  width:var(--control-height);
  padding:0;
  font-size:26px;
}
.calendar-period-icon{
  display:block;
  line-height:0.8;
  transform:translateY(-3px);
}
.calendar-period-btn + .calendar-period-btn{
  border-left:1px solid var(--input-border);
}
.calendar-today-btn:hover,
.calendar-period-btn:hover{
  border-color:var(--accent-weak);
}
.calendar-today-btn:active,
.calendar-period-btn:active{
  transform:translateY(1px);
}
.calendar-mode-select-label{
  margin:0;
}
.calendar-mode-select{
  min-height:var(--control-height);
  height:var(--control-height);
  border:1px solid var(--input-border);
  border-radius:8px;
  background:var(--input);
  color:var(--text);
  padding:0 36px 0 12px;
  font:inherit;
}
.graph-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.graph-item{
  display:grid;
  grid-template-columns:minmax(150px, 210px) minmax(0, 1fr);
  gap:14px;
  align-items:start;
  padding:12px;
  border:1px solid rgba(67,90,127,0.7);
  border-radius:8px;
  background:rgba(43,58,88,0.2);
}
button.graph-item{
  width:100%;
  color:var(--text);
  text-align:left;
  cursor:pointer;
}
.graph-item:hover{
  background:rgba(43,58,88,0.32);
}
.graph-item-time{
  color:var(--muted);
  font-size:0.88rem;
  line-height:1.35;
}
.graph-item-body{
  min-width:0;
}
.graph-item-body h3{
  margin:0 0 4px;
  color:var(--text);
  font-size:1rem;
}
.graph-item-body .muted-text{
  margin:0 0 6px;
}
.email-message-item{
  grid-template-columns:10px minmax(0, 1fr);
}
.email-read-marker{
  width:8px;
  height:8px;
  margin-top:7px;
  border-radius:999px;
  background:transparent;
}
.email-message-item.is-unread .email-read-marker{
  background:var(--warning);
}
.email-message-item.is-unread h3{
  font-weight:700;
}
.email-message-item.is-selected{
  border-color:var(--warning);
  background:rgba(254,190,16,0.08);
}

.calendar-grid-view{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.calendar-grid-view[hidden]{
  display:none;
}

.calendar-grid-header,
.calendar-grid{
  display:grid;
  grid-template-columns:32px repeat(7, minmax(0, 1fr));
  gap:8px;
}

.calendar-grid-week{
  grid-template-rows:minmax(420px, auto);
}

.calendar-grid-month{
  grid-template-rows:repeat(6, minmax(128px, auto));
}

.calendar-grid-header div{
  color:var(--muted);
  font-size:0.82rem;
  font-weight:700;
  text-align:center;
}

.calendar-week-header-spacer{
  min-width:0;
}

.calendar-week-number{
  min-height:100%;
  border:1px solid rgba(241,240,240,0.35);
  border-radius:8px;
  background:rgba(43,58,88,0.16);
  color:var(--text);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0.72rem;
  font-weight:800;
  letter-spacing:0;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  white-space:nowrap;
}

.calendar-day-cell{
  min-height:128px;
  border:1px solid rgba(241,240,240,0.75);
  border-radius:8px;
  background:rgba(43,58,88,0.18);
  padding:8px;
  overflow:hidden;
}

.calendar-grid-week .calendar-day-cell{
  min-height:420px;
}

.calendar-day-cell.is-outside-month{
  opacity:0.48;
}

.calendar-day-cell.is-past-day{
  border-color:rgba(254,190,16,0.32);
  background:rgba(254,190,16,0.06);
  opacity:0.58;
}

.calendar-day-cell.is-today{
  border-color:var(--warning);
  background:rgba(254,190,16,0.08);
  opacity:1;
}

.calendar-day-heading{
  color:var(--text);
  font-size:0.78rem;
  font-weight:700;
  margin-bottom:6px;
}

.calendar-grid-event{
  display:block;
  width:100%;
  border:0;
  margin:0 0 5px;
  padding:5px 6px;
  border-radius:6px;
  background:rgba(67,90,127,0.55);
  color:var(--text);
  text-decoration:none;
  font-size:0.78rem;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:left;
  cursor:pointer;
}

.calendar-grid-event:hover{
  background:rgba(67,90,127,0.8);
  filter:none;
}

.sharepoint-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.sharepoint-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px;
  border:1px solid rgba(67,90,127,0.7);
  border-radius:8px;
  background:rgba(43,58,88,0.2);
  color:var(--text);
  text-decoration:none;
}
.sharepoint-item-link{
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--text);
  text-decoration:none;
  flex:1 1 auto;
}
.sharepoint-item-actions{
  flex:0 0 auto;
  display:flex;
  justify-content:flex-end;
}

.sharepoint-item:hover{
  background:rgba(43,58,88,0.34);
  border-color:var(--input-border);
  filter:none;
}

.sharepoint-item-icon{
  flex:0 0 58px;
  min-height:32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  background:rgba(67,90,127,0.45);
  color:var(--text);
  font-size:0.78rem;
  font-weight:700;
}

.sharepoint-item.is-folder .sharepoint-item-icon{
  background:rgba(254,190,16,0.18);
  color:var(--warning);
}

.sharepoint-item-body{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.sharepoint-item-body strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.graph-file-upload-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.offers-sort-row{
  align-items:flex-end;
  justify-content:space-between;
  min-height:76px;
  box-sizing:border-box;
}
.offers-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.project-flow-toolbar{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.project-flow-form{
  display:grid;
  grid-template-columns:repeat(3, minmax(170px, 1fr));
  align-items:end;
  gap:12px;
  margin:0 0 14px;
  padding:14px;
  border:1px solid var(--card-border);
  border-radius:8px;
  background:rgba(43,58,88,0.18);
}
.project-flow-form[hidden]{
  display:none;
}
.project-flow-form label{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:var(--muted);
  font-size:0.86rem;
  font-weight:700;
}
.project-flow-form input,
.project-flow-form select{
  width:100%;
  min-width:0;
  min-height:var(--control-height);
  height:var(--control-height);
  border:1px solid var(--input-border);
  border-radius:8px;
  background:var(--input);
  color:var(--text);
  padding:0 12px;
  font:inherit;
}
.project-flow-form .graph-edit-actions{
  grid-column:1 / -1;
  align-self:end;
}
.project-flow-timeline{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:560px;
}
.project-flow-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.project-flow-title h3{
  margin:0;
  color:var(--text);
  font-size:1.5em;
  line-height:1.2;
}
.project-flow-title p{
  margin:0;
}
.project-flow-top-scrollbar{
  overflow-x:auto;
  overflow-y:hidden;
  height:16px;
  border:1px solid var(--card-border);
  border-radius:8px 8px 0 0;
  background:rgba(8,23,46,0.42);
  scrollbar-color:rgba(67,90,127,0.86) rgba(8,23,46,0.42);
}
.project-flow-top-scrollbar::-webkit-scrollbar{
  height:14px;
}
.project-flow-top-scrollbar::-webkit-scrollbar-track{
  background:rgba(8,23,46,0.42);
}
.project-flow-top-scrollbar::-webkit-scrollbar-thumb{
  border:3px solid rgba(8,23,46,0.42);
  border-radius:999px;
  background:rgba(67,90,127,0.86);
}
.project-flow-top-scrollbar-inner{
  --project-flow-task-width:260px;
  --project-flow-day-width:72px;
  width:calc(var(--project-flow-task-width) + (var(--project-flow-days) * var(--project-flow-day-width)));
  height:1px;
}
.project-flow-scroller{
  position:relative;
  overflow-x:hidden;
  overflow-y:auto;
  min-height:520px;
  border:1px solid var(--card-border);
  border-top:0;
  border-radius:0 0 8px 8px;
  background:rgba(8,23,46,0.42);
}
.project-flow-scroller.is-middle-panning{
  cursor:grabbing;
  user-select:none;
}
.project-flow-grid{
  --project-flow-task-width:260px;
  --project-flow-day-width:72px;
  min-width:calc(var(--project-flow-task-width) + (var(--project-flow-days) * var(--project-flow-day-width)));
  min-height:520px;
  display:grid;
  grid-template-columns:var(--project-flow-task-width) repeat(var(--project-flow-days), var(--project-flow-day-width));
  align-content:start;
}
.project-flow-phase-head,
.project-flow-week-head,
.project-flow-day-head,
.project-flow-project-label,
.project-flow-project-cell,
.project-flow-group-label,
.project-flow-group-cell,
.project-flow-task-label,
.project-flow-cell{
  border-right:1px solid rgba(67,90,127,0.68);
  border-bottom:1px solid rgba(67,90,127,0.68);
}
.project-flow-phase-head,
.project-flow-week-head,
.project-flow-day-head{
  position:sticky;
  top:0;
  z-index:2;
  background:#07172e;
}
.project-flow-phase-head{
  left:0;
  z-index:4;
  grid-row:span 2;
  min-height:88px;
  display:flex;
  align-items:center;
  padding:0 12px;
  color:var(--muted);
  font-weight:700;
}
.project-flow-week-head{
  z-index:3;
  min-height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--text);
  font-size:0.78rem;
  font-weight:800;
  letter-spacing:0.02em;
  background:#081b36;
  border-top:1px solid rgba(67,90,127,0.68);
  border-bottom:1px solid rgba(67,90,127,0.68);
}
.project-flow-day-head{
  top:30px;
  min-height:58px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  color:var(--muted);
  text-transform:capitalize;
  font-size:0.8rem;
}
.project-flow-date-line{
  display:inline-flex;
  align-items:baseline;
  justify-content:center;
  gap:5px;
}
.project-flow-date-line span{
  color:var(--text);
  font-weight:800;
  text-transform:uppercase;
}
.project-flow-day-head strong{
  color:var(--text);
  font-size:1rem;
}
.project-flow-weekday{
  color:var(--muted);
  font-size:0.72rem;
  font-weight:700;
}
.project-flow-day-head.is-week-start,
.project-flow-project-cell.is-week-start,
.project-flow-group-cell.is-week-start,
.project-flow-cell.is-week-start{
  border-left:1px solid rgba(255,255,255,0.9);
}
.project-flow-day-head.is-today,
.project-flow-project-cell.is-today,
.project-flow-group-cell.is-today,
.project-flow-cell.is-today{
  background:rgba(254,190,16,0.08);
}
.project-flow-day-head.is-today .project-flow-date-line span,
.project-flow-day-head.is-today strong{
  color:var(--warning);
}
.project-flow-project-label,
.project-flow-project-cell{
  min-height:46px;
  background:rgba(8,23,46,0.78);
}
.project-flow-project-label{
  position:sticky;
  left:0;
  z-index:13;
  display:flex;
  align-items:center;
  padding:0 12px;
  color:var(--warning);
  font-weight:800;
}
.project-flow-group-label,
.project-flow-group-cell{
  min-height:42px;
  background:rgba(67,90,127,0.32);
}
.project-flow-group-label{
  position:sticky;
  left:0;
  z-index:12;
  display:grid;
  grid-template-columns:20px minmax(0, 1fr) auto;
  align-items:center;
  gap:8px;
  width:100%;
  border-top:0;
  border-left:0;
  border-radius:0;
  color:var(--text);
  padding:0 12px;
  font:inherit;
  font-weight:700;
  text-align:left;
  cursor:pointer;
  background:#132744;
}
.project-flow-group-label strong{
  min-width:24px;
  min-height:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(8,23,46,0.7);
  color:var(--muted);
  font-size:0.78rem;
}
.project-flow-group-caret{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--warning);
  font-weight:700;
}
.project-flow-task-label{
  position:sticky;
  left:0;
  z-index:11;
  min-height:62px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:4px;
  padding:0 34px;
  background:#07172e;
  color:var(--text);
  font-weight:700;
  white-space:nowrap;
}
.project-flow-link-handle{
  position:absolute;
  top:50%;
  width:16px;
  height:16px;
  min-height:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transform:translateY(-50%);
  border:1px solid rgba(255,255,255,0.5);
  border-radius:999px;
  background:#07172e;
  color:var(--text);
  opacity:0.32;
  cursor:crosshair;
  z-index:5;
  transition:opacity 120ms ease, background 120ms ease, border-color 120ms ease;
}
.project-flow-link-handle.is-driven-by{
  left:-28px;
}
.project-flow-link-handle.is-drives{
  right:-28px;
}
.project-flow-bar:hover .project-flow-link-handle,
.project-flow-link-handle.is-linking{
  opacity:1;
}
.project-flow-link-handle:hover,
.project-flow-link-handle.is-linking,
.project-flow-link-handle.is-valid-link-target{
  border-color:var(--warning);
  background:var(--warning);
  color:#fff;
  opacity:1;
  box-shadow:0 0 0 3px rgba(245,158,11,0.22);
}
.project-flow-link-overlay{
  position:absolute;
  left:0;
  top:0;
  z-index:4;
  pointer-events:none;
  overflow:visible;
}
.project-flow-link-line{
  fill:none;
  stroke:var(--warning);
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 2px 5px rgba(0,0,0,0.35));
}
.project-flow-link-line.is-preview{
  stroke:var(--warning);
  stroke-dasharray:6 5;
}
.project-flow-task-label button{
  max-width:100%;
  border:0;
  background:transparent;
  color:var(--text);
  padding:0;
  font:inherit;
  font-weight:700;
  text-align:left;
  cursor:pointer;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.project-flow-task-label span{
  max-width:100%;
  color:var(--muted);
  font-size:0.78rem;
  font-weight:500;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.project-flow-task-label .project-flow-task-file{
  align-self:center;
  width:100%;
  text-align:center;
}
.project-flow-task-label.is-completed button{
  text-decoration:line-through;
  color:rgba(241,240,240,0.72);
}
.project-flow-task-label.is-empty{
  color:var(--muted);
  font-weight:500;
  font-style:italic;
}
.project-flow-task-label.is-empty.is-project-row{
  color:var(--text);
  font-weight:700;
  font-style:normal;
}
.project-flow-cell{
  position:relative;
  min-height:62px;
  padding:6px;
  background:rgba(43,58,88,0.12);
  overflow:visible;
}
.project-flow-cell.is-empty{
  background:rgba(43,58,88,0.07);
}
.project-flow-cell.is-empty.is-today{
  background:rgba(254,190,16,0.08);
}
.project-flow-cell.is-covered-continuation{
  pointer-events:none;
}
.project-flow-bar{
  position:absolute;
  left:6px;
  top:50%;
  z-index:3;
  width:calc((var(--project-flow-span-days) * var(--project-flow-day-width)) - 12px);
  min-width:58px;
  min-height:36px;
  transform:translateY(-50%);
  display:grid;
  grid-template-columns:8px 20px minmax(0, 1fr) 20px 8px;
  column-gap:9px;
  align-items:center;
  padding:7px 8px;
  border:1px solid var(--warning);
  border-radius:8px;
  background:#9a6f06;
  color:var(--text);
  box-shadow:0 8px 18px rgba(0,0,0,0.18);
  cursor:grab;
  user-select:none;
  touch-action:none;
}
.project-flow-bar.is-dragging{
  opacity:0.9;
}
.project-flow-bar.is-dragging:not(.is-resizing-start):not(.is-resizing-end){
  cursor:grabbing;
  transform:translate(calc(var(--project-flow-drag-days, 0) * var(--project-flow-day-width)), -50%);
}
.project-flow-bar.is-resizing-start,
.project-flow-bar.is-resizing-end{
  cursor:ew-resize;
}
.project-flow-bar.is-dragging.is-resizing-start{
  transform:translate(calc(var(--project-flow-resize-days, 0) * var(--project-flow-day-width)), -50%);
  width:calc(((var(--project-flow-span-days) - var(--project-flow-resize-days, 0)) * var(--project-flow-day-width)) - 12px);
}
.project-flow-bar.is-dragging.is-resizing-end{
  width:calc(((var(--project-flow-span-days) + var(--project-flow-resize-days, 0)) * var(--project-flow-day-width)) - 12px);
}
.project-flow-resize-handle{
  width:8px;
  height:100%;
  min-height:28px;
  border-radius:999px;
  background:rgba(255,255,255,0.18);
  cursor:ew-resize;
  align-self:center;
  justify-self:center;
}
.project-flow-resize-handle:hover{
  background:rgba(255,255,255,0.48);
}
.project-flow-bar.is-completed{
  border-color:rgba(74,222,128,0.72);
  background:#166534;
}
.project-flow-bar.is-single-day{
  grid-template-columns:1fr;
  place-items:center;
  padding:7px;
  min-width:44px;
}
.project-flow-bar input[type="checkbox"]{
  appearance:none;
  box-sizing:border-box;
  width:20px;
  height:20px;
  min-width:20px;
  min-height:20px;
  margin:0;
  display:inline-grid;
  place-content:center;
  align-self:center;
  justify-self:center;
  border:1px solid rgba(255,255,255,0.72);
  border-radius:5px;
  background:rgba(8,23,46,0.45);
  cursor:pointer;
}
.project-flow-bar input[type="checkbox"]::before{
  content:"";
  width:9px;
  height:5px;
  border-left:2px solid #07172e;
  border-bottom:2px solid #07172e;
  transform:rotate(-45deg) scale(0);
  transform-origin:center;
  transition:transform 120ms ease;
}
.project-flow-bar input[type="checkbox"]:checked{
  border-color:rgba(74,222,128,0.95);
  background:#4ade80;
}
.project-flow-bar input[type="checkbox"]:checked::before{
  transform:rotate(-45deg) scale(1);
}
.project-flow-bar-title,
.project-flow-delete{
  border:0;
  background:transparent;
  color:inherit;
  cursor:pointer;
  padding:0;
}
.project-flow-bar .project-flow-link-handle{
  border:1px solid rgba(255,255,255,0.5);
  background:#07172e;
  color:var(--text);
  padding:0;
}
.project-flow-bar .project-flow-link-handle:hover,
.project-flow-bar .project-flow-link-handle.is-linking{
  border-color:var(--warning);
  background:var(--warning);
}
.project-flow-bar-title{
  min-width:0;
  text-align:left;
  font:inherit;
  font-size:0.84rem;
  font-weight:700;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.project-flow-bar.is-completed .project-flow-bar-title{
  text-decoration:line-through;
  color:rgba(241,240,240,0.72);
}
.project-flow-delete{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  border-radius:999px;
  color:rgba(255,255,255,0.86);
  font-size:1rem;
  opacity:0.78;
}
.project-flow-delete:hover{
  opacity:1;
  background:rgba(239,68,68,0.24);
  color:#fff;
}
.project-flow-empty{
  margin-top:0;
  min-height:96px;
}
@media (max-width: 980px){
  .project-row-head{
    grid-template-columns:1fr;
  }
  .project-body-grid{
    grid-template-columns:1fr;
    row-gap:12px;
  }
  .project-flow-form{
    grid-template-columns:1fr 1fr;
  }
  .project-flow-form .graph-edit-actions{
    grid-column:1 / -1;
  }
}
@media (max-width: 620px){
  .project-flow-form{
    grid-template-columns:1fr;
  }
  .project-flow-grid{
    --project-flow-task-width:190px;
    --project-flow-day-width:64px;
  }
}
.offer-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:14px;
  align-items:flex-start;
  padding:14px;
  border:1px solid rgba(67,90,127,0.7);
  border-radius:8px;
  background:rgba(43,58,88,0.2);
}
.offer-row.is-missing-offer{
  opacity:0.72;
}
.offer-row-body{
  min-width:0;
}
.offer-row-body h3{
  margin:0 0 10px;
  color:var(--text);
  font-size:1.5em;
  line-height:1.2;
}
.offer-row-body p{
  margin:0;
}
.offer-row-actions{
  display:flex;
  justify-content:flex-end;
  align-items:flex-start;
  gap:8px;
  flex-wrap:wrap;
}
.email-preview{
  margin:0;
  color:var(--muted);
  line-height:1.4;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.graph-empty{
  padding:18px;
  border:1px dashed var(--card-border);
  border-radius:8px;
  color:var(--muted);
  background:rgba(43,58,88,0.16);
}
.microsoft-login-btn{
  width:100%;
  margin-bottom:10px;
}
.login-divider{
  display:flex;
  align-items:center;
  gap:10px;
  margin:6px 0 12px;
  color:var(--muted);
  font-size:13px;
}
.login-divider::before,
.login-divider::after{
  content:"";
  height:1px;
  flex:1;
  background:var(--card-border);
}

input[type="checkbox"]{
  width:auto;
  padding:0;
  margin:0;
  cursor:pointer;
}

.status{margin-left:12px;color:var(--warning)}

table{width:100%;border-collapse:collapse;margin-top:10px}
th,td{border-bottom:1px solid var(--card-border);padding:8px;text-align:left}
thead th{background:var(--accent-weak)}
tbody tr:hover{background:rgba(255,255,255,0.03)}

.totals{
  display:flex;
  flex-direction:column;
  gap:16px;
  margin:10px 0;
}
.totals-line{
  display:grid;
  grid-template-columns:repeat(3, minmax(220px,1fr));
  gap:12px;
}
.total-item{ white-space:nowrap; }
.margin-item{
  display:grid;
  grid-template-columns:max-content 88px max-content;
  align-items:center;
  gap:8px;
  justify-content:start;
}
.margin-item strong{
  display:inline-block;
  min-width:88px;
}
.margin-config-btn{
  min-width:0;
  padding:10px 14px;
}
#calcBtn,
#resetBtn{
  min-width:0px;
  padding:10px 14px;
}
/* usynlig plassholder for kolonne-justering */
.total-item.placeholder{ visibility:hidden; }
/* Keep same font size across all rows */
.totals-montasje .total, .total{ font-size:inherit; }

.freight-item{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.freight-item strong{margin-right:4px;}
#freightRate{
  width:auto;
  min-width:120px;
  padding:8px 12px;
}
.freight-value{
  margin-right:10px;
}

/* Egen firkant rundt montasje-blokken */
.totals-montasje{
  padding:12px;
  border:1px solid var(--card-border);
  border-radius:10px;
  background:rgba(43,58,88,0.25);
}

/* tre kolonner inni montasje-boksen */
.totals-montasje .totals-line{
  grid-template-columns:repeat(3, minmax(220px,1fr));
}
.totals-montasje .totals-line + .totals-line{
  margin-top:8px;
}
.totals-selectors{
  padding:0;
  margin-top:24px;
  margin-bottom:24px;
}
.addon-selectors{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}

.addon-config-panel{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.addon-selectors label{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin:0;
  white-space:nowrap;
}

.addon-selectors .addon-selectors-title{
  display:inline-flex;
  align-items:center;
  white-space:nowrap;
}

.totals-selectors .addon-selectors{
  grid-column:1 / 3;
}
.addon-total strong{
  margin-right:4px;
}
.addon-total{
  grid-column:3;
  grid-row:1 / span 2;
  align-self:center;
  justify-self:start;
  white-space:nowrap;
}
.tap-off-offer-rows{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:-12px;
  margin-bottom:18px;
  padding:12px;
  border:1px solid var(--card-border);
  border-radius:10px;
  background:rgba(43,58,88,0.18);
}
.tap-off-offer-rows[hidden]{
  display:none;
}
.tap-off-offer-row{
  grid-template-columns:repeat(3, minmax(220px,1fr));
  align-items:center;
}
.tap-off-margin-item{
  grid-template-columns:max-content 88px max-content;
}
.tap-off-total-item{
  display:flex;
  align-items:center;
  gap:6px;
  justify-content:flex-start;
}
.tap-off-delete-btn{
  margin-left:10px;
}
.tap-off-summary-row{
  padding-top:8px;
  border-top:1px solid var(--card-border);
}
.aligned-total-right{
  padding-left:12px;
}

/* Spacing for export button under BOM */
.result-actions{
  margin-top:16px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.result-actions button{
  flex:0 0 auto;
}

footer{margin-top:20px;color:var(--muted)}

.logo-mask{
  width:200px;
  height:60px;
  background-image:url("assets/Busbar_original_hvit.png");
  background-repeat:no-repeat;
  background-size:contain;
  background-position:left center;
}

:root{ --form-gap:16px; }

.rows{ display:flex; flex-direction:column; gap:var(--form-gap); }

.row{
  display:grid;
  grid-template-columns:repeat(5, minmax(180px, 1fr));
  gap:var(--form-gap);
  align-items:end;
}

.row label{ width:100%; }
.row input, .row select{ width:100%; }
.row label > input,
.row label > select,
.row label > .stepper{
  margin-top:6px;
}

.row-actions{
  display:flex;
  flex-wrap:wrap;
  gap:var(--form-gap);
  margin-top:var(--form-gap);
  padding-top:var(--form-gap);
  border-top:1px solid var(--card-border);
  align-items:flex-end;
}
.row-actions .actions-group{
  display:flex;
  gap:var(--form-gap);
  align-items:center;
  flex-wrap:wrap;
}
.admin-form-grid{
  display:grid;
  grid-template-columns:repeat(5, minmax(160px, 1fr));
  gap:12px;
}
.admin-customer-form .actions{
  justify-content:flex-start;
  flex-wrap:wrap;
}
.admin-table td:last-child{
  white-space:nowrap;
}
.admin-row-actions{
  display:flex;
  gap:8px;
  align-items:center;
}
.missing-details-list{
  margin:0 0 12px 20px;
  color:var(--warning);
}
.line-number-field{
  max-width:240px;
  flex:1 1 220px;
}

.full-width{ grid-column:1 / -1; }
.montasje-row{ align-items:flex-start; }
.montasje-box{
  margin:0;
  border:1px solid var(--card-border);
  border-radius:12px;
  padding:12px;
}
.montasje-box legend{
  padding:0 6px;
  color:var(--muted);
  font-size:0.95rem;
}
.montasje-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:12px;
  margin-top:4px;
  align-items:start;
}
.montasje-rate{
  grid-column:span 1;
  width:100%;
}
.oppheng-rate{
  grid-column:span 1;
  width:100%;
}
.montasje-rates{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:repeat(2, minmax(160px, 220px)) auto;
  gap:12px;
  align-items:end;
  justify-content:flex-start;
  justify-items:flex-start;
}
.engineering-rates{
  grid-template-columns:minmax(160px, 220px) auto;
}
.montasje-rate,
.oppheng-rate{
  max-width:220px;
  width:100%;
}
.montasje-rates .rate-toggle{
  display:flex;
  align-items:center;
  gap:6px;
  min-height:var(--control-height);
  height:var(--control-height);
  font-size:0.9rem;
  color:var(--muted);
  border:1px solid var(--card-border);
  border-radius:10px;
  padding:0 12px;
  background:rgba(43,58,88,0.25);
  justify-self:flex-start;
  cursor:pointer;
  max-width:220px;
  width:100%;
}
.montasje-rates .rate-toggle input[type="checkbox"]{
  flex:0 0 auto;
  cursor:pointer;
  margin:0;
  width:20px;
  height:18px;
}
.montasje-box label{ font-size:0.95rem; }
.montasje-box input{ margin-top:4px; }
.montasje-box input.tight-input{
  width:50%;
  min-width:90px;
}
.montasje-box input.locked{
  color:var(--muted);
  cursor:not-allowed;
}
.montasje-box input.locked::placeholder{
  color:var(--muted);
}
.montasje-stats{
  grid-column:1 / -1;
  padding:8px 12px;
  border:1px solid var(--card-border);
  border-radius:10px;
  display:flex;
  flex-direction:column;
  gap:8px;
  background:rgba(43,58,88,0.25);
}
.montasje-stats p{ margin:0; }
.montasje-breakdown{
  margin:0;
  display:grid;
  gap:6px;
}
.montasje-breakdown div{
  display:flex;
  justify-content:space-between;
  gap:8px;
}
.montasje-breakdown dt{
  margin:0;
  font-weight:600;
}
.montasje-breakdown dd{
  margin:0;
  font-weight:600;
  text-align:right;
}
.montasje-breakdown span{ white-space:nowrap; }
.muted-text{ color:var(--muted); font-size:0.85rem; margin-top:8px; }

/* samme headerbredde som i index.html */
.card-header{ align-items:stretch; width:100%; }

@media (max-width:720px){
  body:has(.app-shell),
  body:has(.app-shell.is-sidebar-collapsed){
    padding:84px 14px 14px;
  }
  .app-shell{
    margin-top:12px;
  }
  .dashboard-sidebar{
    right:0;
    bottom:auto;
    width:100%;
    min-height:0;
    height:72px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 14px;
    overflow-x:auto;
    overflow-y:hidden;
  }
  .app-shell.is-sidebar-collapsed .dashboard-sidebar{
    width:100%;
  }
  .sidebar-collapse-btn{
    flex:0 0 44px;
    margin:0;
  }
  .sidebar-top-row{
    flex:0 0 auto;
    min-height:0;
    padding:0;
    margin:0;
    border:0;
  }
  .sidebar-brand,
  .app-shell.is-sidebar-collapsed .sidebar-brand{
    display:none;
  }
  .sidebar-nav{
    flex-direction:row;
    overflow-x:auto;
    padding-bottom:2px;
    flex:1 1 auto;
  }
  .sidebar-nav-section{
    flex-direction:row;
    flex:0 0 auto;
  }
  .sidebar-nav-section.is-bottom{
    margin-top:0;
    margin-left:auto;
  }
  .sidebar-separator{
    border-top:0;
    border-left:1px solid var(--card-border);
    margin:0 4px;
  }
  .sidebar-auth-block{
    display:none;
  }
  .sidebar-nav-item{
    width:auto;
    flex:0 0 auto;
    white-space:nowrap;
  }
  .app-shell.is-sidebar-collapsed .sidebar-nav-label{
    display:inline;
    opacity:1;
  }
  .app-shell.is-sidebar-collapsed .sidebar-nav-item{
    justify-content:flex-start;
    padding:10px 12px;
  }
  .graph-item{
    grid-template-columns:1fr;
  }
  .calendar-grid-header,
  .calendar-grid{
    min-width:800px;
  }
  .calendar-grid-view{
    overflow-x:auto;
  }
  .email-message-item{
    grid-template-columns:10px minmax(0, 1fr);
  }
  .totals-montasje{
    grid-template-columns:1fr;
  }
  .montasje-rates{
    grid-template-columns:1fr;
    justify-items:stretch;
  }
  .montasje-rates .rate-toggle{
    justify-self:flex-start;
  }
}

.admin-login-form{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:16px;
  align-items:end;
}

.admin-summary{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
  gap:10px;
  margin:12px 0 18px 0;
}

.admin-summary-card{
  border:1px solid var(--card-border);
  border-radius:10px;
  padding:10px 12px;
  background:rgba(43,58,88,0.25);
  display:flex;
  flex-direction:column;
  gap:4px;
}

.admin-summary-label{
  color:var(--muted);
  font-size:0.8rem;
}

.admin-summary-value{
  font-size:1.25rem;
}

.admin-table-wrap{
  width:100%;
  overflow:auto;
  border:1px solid var(--card-border);
  border-radius:10px;
  margin-bottom:14px;
}

.admin-table{
  width:100%;
  border-collapse:collapse;
  min-width:1200px;
  background:rgba(8,23,46,0.65);
}

.admin-table th,
.admin-table td{
  border-bottom:1px solid var(--card-border);
  padding:8px 10px;
  text-align:left;
  vertical-align:top;
}

.admin-table th{
  color:var(--muted);
  background:rgba(43,58,88,0.35);
  position:sticky;
  top:0;
}

.admin-col-sort-btn{
  appearance:none;
  border:none;
  background:transparent;
  color:inherit;
  font:inherit;
  font-weight:600;
  cursor:pointer;
  padding:0;
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.admin-col-sort-btn .sort-indicator{
  font-size:0.8em;
  opacity:0.8;
}

.admin-col-sort-btn.is-active{
  color:var(--text);
}

.admin-col-sort-btn.is-active .sort-indicator{
  opacity:1;
}

.global-data-toolbar{
  display:flex;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:10px;
  justify-content:space-between;
  margin:18px 0 12px;
  padding-bottom:12px;
  border-bottom:1px solid var(--card-border);
  min-height:76px;
  box-sizing:border-box;
}

.global-owner-hint{
  flex-basis:auto;
  margin-left:0;
  text-align:left;
  align-self:center;
  min-height:18px;
  white-space:nowrap;
}

.global-edit-form{
  display:grid;
  grid-template-columns:max-content repeat(4, minmax(170px, 220px));
  justify-content:start;
  gap:12px;
  align-items:end;
  border:1px solid var(--card-border);
  border-radius:8px;
  padding:14px;
  margin:0 0 16px;
  background:rgba(8,23,46,0.55);
}

#companyEditForm{
  grid-template-columns:max-content repeat(5, minmax(140px, 1fr));
}

.global-edit-form[hidden]{
  display:none;
}

.global-edit-form label{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:var(--muted);
  font-size:0.85rem;
}

.global-edit-form input{
  width:100%;
  min-width:0;
}

.global-edit-actions{
  display:flex;
  gap:8px;
  align-items:center;
}

@media (max-width: 1120px){
  .global-edit-form{
    grid-template-columns:max-content repeat(auto-fit, minmax(170px, 220px));
  }
}

@media (max-width: 720px){
  .global-edit-form{
    grid-template-columns:1fr;
  }
  .global-edit-actions{
    justify-content:flex-start;
  }
}

.global-data-list{
  display:grid;
  gap:10px;
}

.global-data-card,
.global-data-empty{
  border:1px solid var(--card-border);
  border-radius:8px;
  background:rgba(8,23,46,0.55);
  padding:14px;
}

.global-data-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.global-data-card-body{
  min-width:0;
}

.global-data-card h3{
  margin:0 0 10px;
  font-size:1.5em;
  line-height:1.2;
}

.global-data-card p{
  margin:0;
}

.global-data-details{
  display:grid;
  gap:4px;
}

.global-data-meta,
.global-data-detail{
  color:var(--muted);
  font-size:1rem;
}

.global-data-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}

@media (max-width: 720px){
  .global-owner-hint{
    margin-left:0;
    flex-basis:auto;
  }

  .global-data-card{
    align-items:flex-start;
    flex-direction:column;
  }

  .global-data-actions{
    justify-content:flex-start;
  }
}

