/* CHIEL_NIGHT_GLASS_V1
   Shared visual layer for CHIEL CORE. Functional module behavior stays local. */
:root{
  --chiel-bg:#071525;
  --chiel-bg-deep:#04101d;
  --chiel-surface:#0d2034;
  --chiel-surface-raised:#122a42;
  --chiel-surface-soft:#10263c;
  --chiel-border:rgba(151,181,207,.18);
  --chiel-border-strong:rgba(151,181,207,.30);
  --chiel-text:#f4f8fb;
  --chiel-text-muted:#9db1c3;
  --chiel-text-soft:#71899e;
  --chiel-green:#8bdc65;
  --chiel-green-strong:#6fc94d;
  --chiel-blue:#5ca9ff;
  --chiel-yellow:#f4c95d;
  --chiel-red:#ff7777;
  --chiel-radius-card:22px;
  --chiel-radius-panel:18px;
  --chiel-radius-control:14px;
  --chiel-radius-small:12px;
  --chiel-shadow-card:0 18px 45px rgba(0,0,0,.22);
  --chiel-shadow-soft:0 8px 24px rgba(0,0,0,.16);
  --chiel-space-1:4px;
  --chiel-space-2:8px;
  --chiel-space-3:12px;
  --chiel-space-4:16px;
  --chiel-space-5:20px;
  --chiel-space-6:24px;
  --chiel-space-7:32px;
  --chiel-space-8:40px;
  --chiel-font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,Arial,sans-serif;
}

html,body{
  min-height:100%;
  color:var(--chiel-text);
  font-family:var(--chiel-font)!important;
  background:
    radial-gradient(circle at 18% 0%,rgba(54,105,151,.16),transparent 34%),
    var(--chiel-bg)!important;
}
body{
  color:var(--chiel-text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
button,input,select,textarea{font-family:var(--chiel-font)!important}

/* Shared page headings */
.head,.topbar,.chiel-page-header{
  position:relative;
}
.head h1,.brandtext strong,.chiel-page-title{
  color:var(--chiel-text);
  letter-spacing:-.035em;
}
.head h1{
  margin:.35rem 0 .4rem;
  font-size:clamp(28px,4vw,42px);
  line-height:1.05;
}
.muted,.hint,.small,.footnote,.brandtext small{
  color:var(--chiel-text-muted)!important;
}

/* Shared cards and panels. Specific visual canvases such as Energy scene-stage are excluded. */
.card,.panel,.chiel-card,.chiel-panel{
  border-color:var(--chiel-border)!important;
  box-shadow:var(--chiel-shadow-card);
}
.card,.chiel-card{
  border-radius:var(--chiel-radius-card)!important;
}
.panel:not(.scene-panel),.chiel-panel{
  border-radius:var(--chiel-radius-panel)!important;
  background:linear-gradient(145deg,rgba(18,42,66,.96),rgba(13,32,52,.96))!important;
}
.info-card,.metric,.weather>div,.source,.lamp,.lamp-room,.advice-item,.mode-banner{
  border-color:var(--chiel-border)!important;
  background:rgba(13,32,52,.88)!important;
  box-shadow:var(--chiel-shadow-soft);
}
.card-head{
  border-bottom-color:var(--chiel-border)!important;
  background:linear-gradient(180deg,rgba(18,42,66,.98),rgba(13,32,52,.98))!important;
}

/* General controls */
button,.chiel-button,.top-actions a,.ai-link,.quick-actions a,.scene-row a{
  border:1px solid var(--chiel-border)!important;
  border-radius:var(--chiel-radius-control)!important;
  color:var(--chiel-text)!important;
  background:rgba(92,169,255,.12)!important;
  box-shadow:none!important;
  transition:background-color 160ms ease,border-color 160ms ease,color 160ms ease,transform 160ms ease,box-shadow 160ms ease;
}
button:hover,.chiel-button:hover,.top-actions a:hover,.ai-link:hover,.quick-actions a:hover,.scene-row a:hover{
  transform:translateY(-1px);
  border-color:rgba(92,169,255,.34)!important;
  background:rgba(92,169,255,.18)!important;
}
button:active,.chiel-button:active,.top-actions a:active,.ai-link:active,.quick-actions a:active,.scene-row a:active{
  transform:translateY(0);
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--chiel-blue)!important;
  outline-offset:3px;
}
button#save,.chiel-button--primary{
  border-color:rgba(139,220,101,.26)!important;
  background:var(--chiel-green)!important;
  color:#071525!important;
  box-shadow:0 8px 20px rgba(139,220,101,.18)!important;
}
button#save:hover,.chiel-button--primary:hover{background:var(--chiel-green-strong)!important}
button.secondary,.chiel-button--secondary{
  border-color:rgba(92,169,255,.28)!important;
  background:rgba(92,169,255,.14)!important;
  color:var(--chiel-text)!important;
}
button:disabled,input:disabled,select:disabled{opacity:.52!important}

/* Forms */
input[type="text"],input[type="number"],input[type="time"],input[type="password"],input:not([type]),select,textarea,.chiel-input,.chiel-select{
  min-height:42px;
  border:1px solid var(--chiel-border)!important;
  border-radius:var(--chiel-radius-control)!important;
  outline:none;
  background:var(--chiel-surface-raised)!important;
  color:var(--chiel-text)!important;
  box-shadow:none!important;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--chiel-blue)!important;
  box-shadow:0 0 0 3px rgba(92,169,255,.14)!important;
}
input[type="checkbox"]{accent-color:var(--chiel-green)!important}

/* Status language */
.status,.pill,.chiel-status{
  border-color:var(--chiel-border)!important;
  background:rgba(13,32,52,.86)!important;
  color:var(--chiel-text-muted)!important;
}
.status.ok,.chiel-status--live{border-color:rgba(139,220,101,.28)!important;color:var(--chiel-green)!important}
.status.warning,.warn,.chiel-status--warning{border-color:rgba(244,201,93,.30)!important;color:var(--chiel-yellow)!important}
.status.error,.error,.chiel-status--error{border-color:rgba(255,119,119,.30)!important;color:var(--chiel-red)!important}

/* Dashboard V5 */
.shell{width:min(1600px,100%)}
.brandmark{
  border-color:var(--chiel-border)!important;
  background:linear-gradient(145deg,var(--chiel-surface-raised),var(--chiel-surface))!important;
  box-shadow:var(--chiel-shadow-soft)!important;
}
.status-strip .pill{
  backdrop-filter:blur(10px);
}
.preview-link{
  background:var(--chiel-bg-deep)!important;
}
.tap-badge{
  border-color:var(--chiel-border-strong)!important;
  background:rgba(4,16,29,.78)!important;
}
.quick-actions a{
  min-height:54px;
}

/* Energy: keep scene canvas, badges, lines and drag/touch untouched. */
main[data-energy-canonical="v1"]{
  width:min(1100px,100%);
}
/* Photo-first Energy layout: keep controls in the DOM for compatibility, but hide the complete header visually. */
main[data-energy-canonical="v1"]>.head{
  display:none!important;
}
main[data-energy-canonical="v1"]>.scene-panel{
  margin-top:0;
}
main[data-energy-canonical="v1"]>.head{
  margin-bottom:var(--chiel-space-5);
}
main[data-energy-canonical="v1"]>.head .pill{
  padding:7px 11px;
  border-radius:999px!important;
  color:var(--chiel-green)!important;
  border-color:rgba(139,220,101,.26)!important;
}
main[data-energy-canonical="v1"]>.head .actions>button,
main[data-energy-canonical="v1"]>.head .visual-wrap>button{
  min-height:42px;
  padding:0 15px;
}
main[data-energy-canonical="v1"]>.scene-panel{
  border:1px solid var(--chiel-border)!important;
  border-radius:var(--chiel-radius-card)!important;
  box-shadow:var(--chiel-shadow-card)!important;
  overflow:hidden;
}
main[data-energy-canonical="v1"]>.panel:not(.scene-panel){
  padding:var(--chiel-space-5)!important;
}
main[data-energy-canonical="v1"] .visual-popover{
  border-color:var(--chiel-border)!important;
  border-radius:var(--chiel-radius-panel)!important;
  background:rgba(7,21,37,.96)!important;
  box-shadow:var(--chiel-shadow-card)!important;
  backdrop-filter:blur(18px);
}
main[data-energy-canonical="v1"] .scene-panel>.status{
  background:rgba(4,16,29,.94)!important;
  border-top-color:var(--chiel-border)!important;
}
main[data-energy-canonical="v1"] .weather{
  gap:10px;
}
main[data-energy-canonical="v1"] .weather>div{
  border-radius:var(--chiel-radius-small)!important;
}

/* Settings pages and Light Coach */
.grid{gap:16px!important}
.grid>.card{
  background:linear-gradient(145deg,rgba(18,42,66,.96),rgba(13,32,52,.96))!important;
}
.row label,.dayname,.lamp-title strong{color:var(--chiel-text)}
.permissions label,.dim-limits label,.advice-meta,.lamp-title small{color:var(--chiel-text-muted)!important}
.lamp-room summary{color:var(--chiel-text)}
.actions{gap:10px!important}

/* Optional native Night Glass shell for pages migrated later. */
.chiel-app{min-height:100vh;background:transparent}
.chiel-main{min-width:0;padding:var(--chiel-space-7)}
.chiel-page-content,.chiel-page-header{width:min(100%,1480px);margin-left:auto;margin-right:auto}
.chiel-page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--chiel-space-6);margin-bottom:var(--chiel-space-7)}
.chiel-page-kicker{margin-bottom:6px;color:var(--chiel-text-soft);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.chiel-page-title{margin:0;font-size:clamp(28px,4vw,42px);font-weight:750;line-height:1.05}
.chiel-page-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:var(--chiel-space-3)}
.chiel-card{padding:var(--chiel-space-6);background:linear-gradient(145deg,rgba(18,42,66,.96),rgba(13,32,52,.96))}
.chiel-panel{padding:var(--chiel-space-5)}
.chiel-section-title{margin:0;color:var(--chiel-text);font-size:20px;font-weight:700;line-height:1.2}
.chiel-subsection-title{margin:0;color:var(--chiel-text);font-size:15px;font-weight:700}
.chiel-body{color:var(--chiel-text);font-size:15px;line-height:1.55}
.chiel-muted{color:var(--chiel-text-muted);font-size:13px;line-height:1.45}
.chiel-small{color:var(--chiel-text-soft);font-size:12px;line-height:1.4}
.chiel-settings-list{display:grid;gap:1px;overflow:hidden;border:1px solid var(--chiel-border);border-radius:var(--chiel-radius-panel);background:var(--chiel-border)}
.chiel-setting-row{display:flex;align-items:center;justify-content:space-between;gap:var(--chiel-space-5);padding:var(--chiel-space-5);background:rgba(13,32,52,.96)}
.chiel-setting-copy{min-width:0}.chiel-setting-copy p{margin:6px 0 0}.chiel-setting-control{flex:0 0 auto}
.chiel-dashboard-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--chiel-space-5)}
.chiel-dashboard-grid>.span-4{grid-column:span 4}.chiel-dashboard-grid>.span-6{grid-column:span 6}.chiel-dashboard-grid>.span-8{grid-column:span 8}.chiel-dashboard-grid>.span-12{grid-column:span 12}

@media(max-width:720px){
  .chiel-main{padding:20px 16px 32px}
  .chiel-page-header{display:grid;gap:16px;margin-bottom:20px}
  .chiel-page-actions{justify-content:flex-start}
  .chiel-card{padding:18px;border-radius:18px!important}
  .chiel-dashboard-grid{grid-template-columns:1fr}
  .chiel-dashboard-grid>[class*="span-"]{grid-column:span 1}
  .chiel-setting-row{align-items:flex-start;flex-direction:column}
  .chiel-setting-control{width:100%}
  .chiel-setting-control input,.chiel-setting-control select,.chiel-setting-control button{width:100%}
  main[data-energy-canonical="v1"]>.head{gap:16px}
}

@media(min-width:721px) and (max-width:820px){
  .chiel-main{padding:24px}
  .chiel-dashboard-grid>.span-4{grid-column:span 6}
  .chiel-dashboard-grid>.span-8{grid-column:span 12}
}

@media(prefers-reduced-motion:reduce){
  button,.chiel-button,.top-actions a,.ai-link,.quick-actions a,.scene-row a{transition:none!important}
}


/* CHIEL_NIGHT_GLASS_MODULES_V2 */
html[data-chiel-night-glass="module"]{
  color-scheme:dark;
  background:var(--chiel-bg)!important;
}
html[data-chiel-night-glass="module"] body{
  color:var(--chiel-text)!important;
  background:
    radial-gradient(circle at 18% 0%,rgba(54,105,151,.16),transparent 34%),
    var(--chiel-bg)!important;
}
html[data-chiel-night-glass="module"] body>main,
html[data-chiel-night-glass="module"] .wrap{
  width:min(1100px,100%)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
html[data-chiel-night-glass="module"] .card,
html[data-chiel-night-glass="module"] .panel,
html[data-chiel-night-glass="module"] .item,
html[data-chiel-night-glass="module"] .box,
html[data-chiel-night-glass="module"] .kpi,
html[data-chiel-night-glass="module"] .check,
html[data-chiel-night-glass="module"] .switch{
  border-color:var(--chiel-border)!important;
  background:linear-gradient(145deg,rgba(18,42,66,.96),rgba(13,32,52,.96))!important;
  color:var(--chiel-text)!important;
}
html[data-chiel-night-glass="module"] .card,
html[data-chiel-night-glass="module"] dialog{
  border-radius:var(--chiel-radius-card)!important;
}
html[data-chiel-night-glass="module"] .eyebrow,
html[data-chiel-night-glass="module"] .chip,
html[data-chiel-night-glass="module"] .badge,
html[data-chiel-night-glass="module"] .tag{
  border-color:var(--chiel-border)!important;
  background:rgba(92,169,255,.10)!important;
  color:var(--chiel-text-muted)!important;
}
html[data-chiel-night-glass="module"] h1,
html[data-chiel-night-glass="module"] h2,
html[data-chiel-night-glass="module"] h3,
html[data-chiel-night-glass="module"] strong,
html[data-chiel-night-glass="module"] label{
  color:var(--chiel-text)!important;
}
html[data-chiel-night-glass="module"] .muted,
html[data-chiel-night-glass="module"] .lead,
html[data-chiel-night-glass="module"] .sub,
html[data-chiel-night-glass="module"] .hint,
html[data-chiel-night-glass="module"] .meta{
  color:var(--chiel-text-muted)!important;
}
html[data-chiel-night-glass="module"] dialog{
  border:1px solid var(--chiel-border)!important;
  background:var(--chiel-surface)!important;
  color:var(--chiel-text)!important;
  box-shadow:var(--chiel-shadow-card)!important;
}
html[data-chiel-night-glass="module"] dialog::backdrop{
  background:rgba(2,8,16,.72)!important;
  backdrop-filter:blur(6px);
}
html[data-chiel-night-glass="module"] button.danger{
  border-color:rgba(255,119,119,.35)!important;
  background:rgba(255,119,119,.14)!important;
  color:var(--chiel-red)!important;
}
html[data-chiel-night-glass="module"] button.amber,
html[data-chiel-night-glass="module"] button.warning{
  border-color:rgba(244,201,93,.35)!important;
  background:rgba(244,201,93,.14)!important;
  color:var(--chiel-yellow)!important;
}
html[data-chiel-night-glass="module"] .notice.good,
html[data-chiel-night-glass="module"] .ok,
html[data-chiel-night-glass="module"] .good{
  color:var(--chiel-green)!important;
}
html[data-chiel-night-glass="module"] .notice.error,
html[data-chiel-night-glass="module"] .bad{
  color:var(--chiel-red)!important;
}
@media(max-width:720px){
  html[data-chiel-night-glass="module"] body{padding-left:14px!important;padding-right:14px!important}
  html[data-chiel-night-glass="module"] .actions{gap:8px!important}
}

/* CHIEL_NO_FLOATING_AGENDA_SMART_V2
   Agenda/Smart blijven via normale navigatie en overlays beschikbaar; alleen zwevende launchers zijn verborgen. */
#chielAgenda3443Btn,
#chielAgendaFloatBtn,
#chiel-agenda-button-v4,
#chielSmart3443Btn,
#chielSmartFloatBtn,
#chiel-homey-button-v4,
#smartHubButton,
.smart-hub-button{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
