/* Q21 Flow Glass V2, source: Sachte98/q21-flow-glass-design-system
   v2 tokens + interaction spec @ 7f2171f. Shared intranet chrome, calm work surfaces.
   Preserve semantic module colors (especially energy) and all permission hiding. */
:root{--q21-page:#edf0f2;--q21-text:#101316;--q21-muted:#62676b;--q21-line:rgba(12,16,20,.14);--q21-solid:#f7f8f9;--q21-glass:rgba(255,255,255,.78);--q21-control:14px;--q21-card:18px;--q21-panel:26px;--q21-ease:cubic-bezier(.22,.7,.18,1);--flow-ink:var(--q21-text);--flow-muted:var(--q21-muted);--flow-line:var(--q21-line);--flow-page:var(--q21-page);--flow-control:var(--q21-control);--flow-panel:var(--q21-panel)}
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Helvetica,Arial,sans-serif}
body:not(.energy-view-active){background:var(--q21-page)}
:is(.primary-button,.secondary-button,.pm-sheet-action){border-radius:var(--q21-control);font-weight:650;transition:border-color 180ms ease,background-color 180ms ease}
body :is(.primary-button,.secondary-button):not(:disabled){min-height:44px}
:is(.portal-view,dialog) :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #487d75;outline-offset:3px}
:is(.module-card,.planner-link-card,.employee-tool-grid article,.settings-section,.integration-card,.service-card,.help-grid article,.tenant-planner-column,.tenant-planner-card,.p21d-order-shell,.p21d-kpi,.p21-tenant-settings,.account-password-card){border-radius:var(--q21-card);border-color:var(--q21-line);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 7px 22px rgba(16,19,22,.045)}
:is(.module-card,.planner-link-card,.employee-tool-grid article,.settings-section,.integration-card,.service-card,.help-grid article,.tenant-planner-card,.p21d-order-shell,.p21-tenant-settings){background:var(--q21-solid);color:var(--q21-text);-webkit-backdrop-filter:none;backdrop-filter:none}
.module-card:hover{transform:translateY(-1px);border-color:rgba(12,16,20,.22);background:#fff;box-shadow:inset 0 1px 0 #fff,0 11px 29px rgba(16,19,22,.08)}
.module-card :is(h3,p),.employee-tool-grid article :is(h3,p){color:inherit}.module-card p,.employee-tool-grid article p{color:var(--q21-muted)}
:is(.tenant-planner-dialog,.pm-sheet){border-color:var(--q21-line);color:var(--q21-text);background:var(--q21-solid);box-shadow:0 24px 64px rgba(0,0,0,.16)}
:is(.tenant-planner-dialog,.pm-sheet) :is(h2,h3){font-weight:650;letter-spacing:-.025em}
:is(.tenant-planner-dialog-shell>header,.tenant-planner-dialog-shell>footer,.pm-sheet>header){background:var(--q21-glass);border-color:var(--q21-line)}
:is(.tenant-planner-dialog,.pm-sheet,.customize-panel,.roe-dialog,.documents-dialog)::backdrop{background:rgba(16,19,22,.34);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
:is(.pm-bottom,.mobile-app-header,.mobile-nav){background:var(--q21-glass);border-color:var(--q21-line);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 11px 29px rgba(16,19,22,.1)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  :is(.pm-bottom,.mobile-app-header,.mobile-nav){-webkit-backdrop-filter:blur(28px) saturate(145%);backdrop-filter:blur(28px) saturate(145%)}
  #plannerView #pmPlannerSelection{background:rgba(237,240,242,.85);-webkit-backdrop-filter:blur(20px) saturate(125%);backdrop-filter:blur(20px) saturate(125%)}
}
.sidebar{background:linear-gradient(165deg,#24282d,#0e1114);color:#f6f7f8}
.sidebar .main-nav a:hover:not(.active){background:transparent;color:#fff;box-shadow:none}
.sidebar .main-nav a{border-radius:14px}.sidebar .main-nav a.active{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.10);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.portal-view:not(.energy-statistics-view) :is(input:not([type=checkbox]):not([type=radio]),select,textarea){border-color:var(--q21-line);border-radius:var(--q21-control);color:var(--q21-text);background:rgba(255,255,255,.82)}
.portal-view:not(.energy-statistics-view) :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus{border-color:rgba(35,124,57,.62);box-shadow:0 0 0 3px rgba(35,124,57,.10)}
.portal-view:not(.energy-statistics-view) :is(.primary-button,button.primary-button){color:#fff;border-color:#252b30;background:#252b30;box-shadow:inset 0 1px 0 rgba(255,255,255,.15)}
.portal-view:not(.energy-statistics-view) :is(.primary-button,button.primary-button):hover{color:#fff;border-color:#101316;background:#101316}
.pm-department-bar button[aria-pressed=true]{background:#252b30!important;color:#f6f7f8!important;border-color:#252b30!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.15)}
.p21-material-panel{border:1px solid var(--q21-line);border-radius:18px;background:var(--q21-solid);margin:0 0 18px;min-width:0;scroll-margin-top:12px}
.p21-material-panel>summary{display:flex;align-items:center;justify-content:space-between;gap:11px;min-height:56px;padding:11px 18px;font-size:15px;font-weight:650;cursor:pointer;list-style:none}
.p21-material-panel>summary::-webkit-details-marker{display:none}
.p21-material-panel>summary::after{content:'+';font-size:22px;font-weight:400}
.p21-material-panel[open]>summary::after{content:'−'}
.p21-material-panel>summary small{margin-left:auto;color:var(--q21-muted);font-size:12px;font-weight:500}
.p21-material-content{padding:0 18px 18px}.p21-material-list{display:grid;gap:18px}
.p21-material-state,.p21-material-total,.p21-material-line>small{font-size:13px!important;line-height:1.5;color:var(--q21-muted);margin:0 0 18px}
.p21-material-state{display:grid;gap:3px;padding:12px 14px;border:1px solid var(--suite-accent-line,var(--q21-line));border-radius:14px;background:var(--suite-accent-soft,var(--q21-solid))}.p21-material-state strong{color:var(--q21-text);font-size:13px}.p21-material-state span{font-size:12px}
.p21-material-total{margin:18px 0 11px;color:var(--q21-text);font-weight:650}
.p21-material-line{padding:18px;border:1px solid var(--q21-line);border-radius:14px;background:var(--q21-solid);color:var(--q21-text);min-width:0}
.p21-material-line-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:7px;min-height:44px;cursor:pointer;list-style:none}.p21-material-line-head strong{font-size:15px;overflow-wrap:anywhere}.p21-material-line-head::-webkit-details-marker{display:none}.p21-material-line-head::after{content:'+';grid-column:2;grid-row:1/3;font-size:22px}.p21-material-line[open]>.p21-material-line-head{margin-bottom:18px}.p21-material-line[open]>.p21-material-line-head::after{content:'−'}.p21-material-line-head small{grid-column:1;color:var(--q21-muted);font-size:12px;line-height:1.5}
.p21-material-panel button{min-height:44px;min-width:44px;padding:10px 14px;border:1px solid var(--q21-line);border-radius:14px;color:var(--q21-text);background:var(--suite-soft,var(--q21-solid));font:inherit;font-size:13px;cursor:pointer;box-shadow:none}
.p21-material-line-head button{color:var(--suite-danger,#9b2929);background:var(--suite-danger-soft,var(--q21-solid));flex:none}
.p21-material-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.p21-material-grid label{display:grid;gap:7px;min-width:0;margin:0!important}
.p21-material-grid label>span{color:var(--q21-muted)!important;font-size:12px!important;font-weight:500!important}
.p21-material-grid .p21-material-wide{grid-column:1/-1}
.p21-material-grid :is(input,select,textarea){box-sizing:border-box;width:100%;min-width:0;max-width:100%;min-height:44px;padding:11px;border:1px solid var(--q21-line);border-radius:14px;background:var(--q21-solid);color:var(--q21-text);font:inherit;font-size:16px}
.p21-material-grid :disabled{opacity:1;-webkit-text-fill-color:var(--q21-text)}
.p21-material-delta{font-size:14px;font-weight:650;font-variant-numeric:tabular-nums;margin:18px 0 7px}
.p21-material-line>small{display:block;margin:0}
.p21-material-line>button{margin-top:11px;color:var(--suite-danger,#9b2929);background:var(--suite-danger-soft,var(--q21-solid))}
.p21-material-settings{display:grid;gap:11px;border-top:1px solid var(--q21-line);padding-top:18px}
.p21-material-settings p,.p21-material-settings small{font-size:13px;line-height:1.5;color:var(--q21-muted);margin:0}
.p21-material-settings fieldset{display:flex;flex-wrap:wrap;gap:11px;padding:11px;border:1px solid var(--q21-line);border-radius:14px}
.p21-material-settings fieldset label{display:flex;align-items:center;gap:7px;min-height:44px;font-size:15px}
.p21-material-settings input[type=checkbox]{width:22px;min-height:22px;height:22px;margin:0;accent-color:var(--suite-accent,var(--q21-text))}
/* Material surfaces always pair a theme-owned background with its matching text. */
.p21-material-config-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:3px 0 7px;padding:0;list-style:none}.p21-material-config-flow li{display:flex;align-items:center;gap:8px;min-width:0;padding:10px;border:1px solid var(--q21-line);border-radius:12px;background:var(--suite-soft,var(--q21-solid));color:var(--q21-text);font-size:13px}.p21-material-config-flow b{display:grid;flex:0 0 auto;width:28px;height:28px;place-items:center;border:1px solid var(--suite-accent-line,var(--q21-line));border-radius:50%;color:var(--suite-accent,var(--q21-text));background:var(--suite-accent-soft,var(--q21-solid));font-size:12px}.p21-material-config-flow span{overflow-wrap:anywhere}
.p21-material-legacy{background:var(--suite-soft,var(--q21-solid))}.p21-material-legacy-detail{display:grid;gap:5px;padding-top:14px}.p21-material-legacy-detail p{margin:0;color:var(--q21-muted);font-size:12px;line-height:1.5}
.tools-view .module-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:1180px}
.tools-view .module-card{aspect-ratio:auto;min-height:250px}
.erp-tabs{grid-template-columns:repeat(7,minmax(0,1fr))}
.erp-supply-panel{padding:0;overflow:hidden}
.erp-supply-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:26px 28px;border-bottom:1px solid var(--q21-line);background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(232,239,239,.82))}
.erp-supply-heading h3{margin:4px 0 7px;font-size:1.35rem;letter-spacing:-.025em}.erp-supply-heading p:last-child{max-width:690px;margin:0;color:var(--q21-muted);font-size:.85rem;line-height:1.55}
.erp-supply-state{flex:0 0 auto;padding:8px 11px;border:1px solid rgba(157,104,26,.22);border-radius:999px;color:#74501f;background:#fff7e9;font-size:.72rem;font-weight:700;white-space:nowrap}
.erp-supply-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:22px 28px}
.erp-supply-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;min-height:112px;padding:17px;border:1px solid var(--q21-line);border-radius:18px;color:var(--q21-text);background:#fff;text-decoration:none;box-shadow:inset 0 1px 0 #fff,0 6px 18px rgba(16,19,22,.045);transition:transform .18s var(--q21-ease),border-color .18s var(--q21-ease),box-shadow .18s var(--q21-ease)}
.erp-supply-card:hover{transform:translateY(-1px);border-color:rgba(12,16,20,.28);box-shadow:inset 0 1px 0 #fff,0 11px 28px rgba(16,19,22,.08)}.erp-supply-card.primary{border-color:rgba(35,111,105,.32);background:linear-gradient(135deg,#faffff,#eef6f5)}
.erp-supply-mark{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;color:#f7fbfb;background:#26343a;font-size:.72rem;font-weight:800;letter-spacing:.03em}.erp-supply-card.primary .erp-supply-mark{background:#216e69}
.erp-supply-card span:nth-child(2){display:grid;gap:3px;min-width:0}.erp-supply-card small{color:var(--q21-muted);font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.055em}.erp-supply-card strong{font-size:.96rem}.erp-supply-card em{color:var(--q21-muted);font-size:.75rem;font-style:normal;line-height:1.4}.erp-supply-card>b{font-size:1.2rem;font-weight:500}
.erp-supply-flow{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px;margin:0 28px 22px;padding:18px;border:1px solid var(--q21-line);border-radius:18px;background:#f3f5f6}.erp-supply-flow>div{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px}.erp-supply-flow div>span{grid-row:1/3;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:#fff;background:#26343a;font-size:.72rem;font-weight:800}.erp-supply-flow strong{font-size:.8rem}.erp-supply-flow small{color:var(--q21-muted);font-size:.68rem;line-height:1.35}.erp-supply-flow>i{color:#788085;font-style:normal}
.erp-supply-notice{display:flex;gap:9px;margin:0 28px 28px;padding:15px 17px;border-left:3px solid #9b712f;border-radius:4px 14px 14px 4px;color:#4f3b20;background:#fff7e9;font-size:.76rem;line-height:1.5}.erp-supply-notice span{color:#6d5b41}
@media(max-width:1024px){#plannerOrderForm #plannerMaterials{order:-2}}
@media(min-width:1001px){
  #plannerView{width:100%;max-width:none!important;margin-inline:0}
  #plannerView .p21-workspace{grid-template-columns:clamp(174px,11vw,210px) minmax(0,1fr);gap:clamp(12px,1.2vw,20px)}
  #plannerView #plannerBoard:not(.is-list):not(.is-dashboard):not(.is-schedule){display:grid;grid-template-columns:repeat(auto-fit,minmax(min(248px,100%),1fr));grid-auto-flow:row;grid-auto-columns:auto;align-items:start;gap:clamp(12px,1vw,18px);padding:4px 0 20px;overflow:visible;scrollbar-gutter:auto}
  #plannerView #plannerBoard:not(.is-list):not(.is-dashboard):not(.is-schedule) .tenant-planner-column{width:auto;min-width:0}
  #plannerView .tenant-planner-card{min-height:clamp(210px,13vw,245px)}
}
@media(min-width:761px) and (max-width:1100px){.erp-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.tools-view .module-grid{grid-template-columns:1fr}.tools-view .module-card{min-height:205px}.erp-supply-heading{display:grid;gap:13px;padding:19px 16px}.erp-supply-state{justify-self:start;white-space:normal}.erp-supply-grid{grid-template-columns:1fr;padding:14px}.erp-supply-card{min-height:104px;padding:14px}.erp-supply-flow{grid-template-columns:1fr;margin:0 14px 14px;padding:14px}.erp-supply-flow>i{display:none}.erp-supply-notice{display:grid;margin:0 14px 18px;padding:14px}.erp-supply-mark{width:44px;height:44px}.erp-supply-card em{font-size:.72rem}}
@media(max-width:600px){
  .p21-material-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.p21-material-content{padding:0 11px 11px}.p21-material-line{padding:11px}
  .p21-material-grid label:has([data-material-field=reference]),.p21-material-grid label:has([data-material-field=availability]),.p21-material-grid label:has([data-material-field=unitNet]){grid-column:1/-1}
  .p21-material-grid label:has([data-material-field=unit]){grid-column:1/-1}
  .p21-material-config-flow{grid-template-columns:1fr 1fr}.p21-material-panel>summary{padding-inline:13px}.p21-material-panel>summary small{max-width:90px;text-align:right}
}
@media(prefers-reduced-transparency:reduce){:is(.pm-bottom,.mobile-app-header,.mobile-nav,.tenant-planner-dialog-shell>header,.tenant-planner-dialog-shell>footer),#plannerView #pmPlannerSelection{background:var(--q21-solid);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){:is(.primary-button,.secondary-button,.pm-sheet-action){transition:none}}