/* FamilienCloud V42.202 – refined optional glass layer
   Goal: preserve the selected theme's readability and colour, while surfaces become visibly frosted glass. */

body.glass-effect{
  --fc-glass-blur:18px;
  --fc-glass-sat:135%;
  --fc-glass-shadow:0 12px 34px rgba(13,42,68,.10);
  --fc-glass-border:rgba(255,255,255,.42);
  --fc-glass-surface:rgba(255,255,255,.62);
  --fc-glass-surface-strong:rgba(255,255,255,.78);
  --fc-glass-surface-soft:rgba(255,255,255,.42);
}
body.glass-effect.theme-blue{
  --fc-glass-border:rgba(190,225,250,.25);
  --fc-glass-surface:rgba(19,74,112,.62);
  --fc-glass-surface-strong:rgba(18,69,105,.80);
  --fc-glass-surface-soft:rgba(28,91,135,.45);
  --fc-glass-shadow:0 14px 36px rgba(0,29,52,.15);
}
body.glass-effect.theme-dark{
  --fc-glass-border:rgba(176,215,244,.18);
  --fc-glass-surface:rgba(18,47,68,.58);
  --fc-glass-surface-strong:rgba(17,43,63,.78);
  --fc-glass-surface-soft:rgba(29,65,90,.42);
  --fc-glass-shadow:0 15px 38px rgba(0,12,24,.18);
}

/* Do NOT replace the theme's page background. This was the main V42.201 problem. */
body.glass-effect{background-color:inherit!important}

/* Main glass surfaces – explicit selectors only, no broad wildcard selectors. */
body.glass-effect .sidebar,
body.glass-effect .settings-sidebar,
body.glass-effect .settings-card,
body.glass-effect .module-card,
body.glass-effect .glass-panel,
body.glass-effect .widget-card,
body.glass-effect .dashboard-card,
body.glass-effect .quick-module,
body.glass-effect .storage-card,
body.glass-effect .profile-popover,
body.glass-effect .life-side-card,
body.glass-effect .life-design-side > section{
  background:var(--fc-glass-surface)!important;
  border-color:var(--fc-glass-border)!important;
  box-shadow:var(--fc-glass-shadow)!important;
  -webkit-backdrop-filter:blur(var(--fc-glass-blur)) saturate(var(--fc-glass-sat));
  backdrop-filter:blur(var(--fc-glass-blur)) saturate(var(--fc-glass-sat));
}

/* Navigation is a single calm sheet; don't darken or wash out menu items. */
body.glass-effect .sidebar,
body.glass-effect .settings-sidebar{
  background:var(--fc-glass-surface-strong)!important;
  border-right:1px solid var(--fc-glass-border)!important;
}
body.glass-effect .sidebar a,
body.glass-effect .settings-sidebar a{
  opacity:1!important;
  filter:none!important;
}

/* Mein Leben area cards keep their own selected colour/image.
   Only the lower information surface gets a restrained glass treatment. */
body.glass-effect .life-card,
body.glass-effect .life-room-card{
  opacity:1!important;
  filter:none!important;
  box-shadow:0 12px 30px rgba(8,35,58,.12)!important;
}
body.glass-effect .life-card [class*="body"],
body.glass-effect .life-room-card [class*="body"]{
  -webkit-backdrop-filter:blur(10px) saturate(120%);
  backdrop-filter:blur(10px) saturate(120%);
}

/* Header/search controls: subtle, not foggy. */
body.glass-effect .app-global-search,
body.glass-effect .round-btn,
body.glass-effect .profile-menu summary{
  background:var(--fc-glass-surface-soft)!important;
  border-color:var(--fc-glass-border)!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:blur(14px) saturate(125%);
  backdrop-filter:blur(14px) saturate(125%);
}

/* Forms remain highly legible. */
body.glass-effect input:not([type="checkbox"]):not([type="radio"]),
body.glass-effect select,
body.glass-effect textarea{
  background:var(--fc-glass-surface-strong)!important;
  border-color:var(--fc-glass-border)!important;
  opacity:1!important;
}

/* Popups may be the strongest glass element. */
body.glass-effect .modal-card,
body.glass-effect [role="dialog"]:not(.life-entry-editor){
  background:var(--fc-glass-surface-strong)!important;
  border:1px solid var(--fc-glass-border)!important;
  box-shadow:0 24px 70px rgba(4,25,43,.22)!important;
  -webkit-backdrop-filter:blur(24px) saturate(145%);
  backdrop-filter:blur(24px) saturate(145%);
}
body.glass-effect .modal-backdrop{
  background:rgba(5,25,42,.20)!important;
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
}

/* Fine glass highlight without changing content opacity. */
body.glass-effect .settings-card,
body.glass-effect .module-card,
body.glass-effect .widget-card,
body.glass-effect .dashboard-card,
body.glass-effect .quick-module,
body.glass-effect .life-side-card{
  position:relative;
}
body.glass-effect .settings-card:before,
body.glass-effect .module-card:before,
body.glass-effect .widget-card:before,
body.glass-effect .dashboard-card:before,
body.glass-effect .quick-module:before,
body.glass-effect .life-side-card:before{
  content:"";position:absolute;z-index:0;left:16px;right:16px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.58),transparent);
  pointer-events:none;
}
body.glass-effect .settings-card > *,
body.glass-effect .module-card > *,
body.glass-effect .widget-card > *,
body.glass-effect .dashboard-card > *,
body.glass-effect .quick-module > *,
body.glass-effect .life-side-card > *{position:relative;z-index:1}

/* Absolutely never dim actual content in glass mode. */
body.glass-effect main,
body.glass-effect .content,
body.glass-effect .life-main,
body.glass-effect .life-card,
body.glass-effect .life-card *,
body.glass-effect .life-side,
body.glass-effect .life-side *,
body.glass-effect nav,
body.glass-effect nav *{
  opacity:1;
}

/* Settings UI from V42.201 */
.glass-effect-form{margin-top:16px;padding-top:16px;border-top:1px solid rgba(100,140,175,.14)}
.glass-setting-row{display:flex;align-items:center;justify-content:space-between;gap:18px}
.glass-setting-copy{display:flex;align-items:center;gap:12px}
.glass-setting-copy strong,.glass-setting-copy small{display:block}
.glass-setting-copy small{font-size:.78rem;color:var(--muted,#8293a6);margin-top:3px}
.glass-setting-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(52,151,255,.11);color:#168cff;font-size:20px}
.fc-switch{position:relative;width:50px;height:29px;display:block;flex:0 0 auto}
.fc-switch input{position:absolute;opacity:0;pointer-events:none}
.fc-switch span{position:absolute;inset:0;border-radius:999px;background:#c9d5df;transition:.2s;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}
.fc-switch span:after{content:"";position:absolute;width:23px;height:23px;left:3px;top:3px;border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.18);transition:.2s}
.fc-switch input:checked+span{background:#168cff}
.fc-switch input:checked+span:after{transform:translateX(21px)}
.glass-preview-strip{position:relative;height:62px;margin-top:13px;border-radius:14px;overflow:hidden;background:linear-gradient(135deg,#4da8f5,#dceeff 52%,#8abdf0)}
.glass-preview-strip i{position:absolute;width:82px;height:42px;top:10px;border:1px solid rgba(255,255,255,.62);border-radius:11px;background:rgba(255,255,255,.28);backdrop-filter:blur(10px)}
.glass-preview-strip i:nth-child(1){left:14px}.glass-preview-strip i:nth-child(2){left:70px}.glass-preview-strip i:nth-child(3){left:126px}
.glass-preview-strip span{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:.72rem;font-weight:700;color:#214b70;background:rgba(255,255,255,.62);padding:6px 9px;border-radius:9px;backdrop-filter:blur(8px)}

@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 body.glass-effect{--fc-glass-surface:rgba(255,255,255,.94);--fc-glass-surface-strong:rgba(255,255,255,.98)}
 body.glass-effect.theme-blue{--fc-glass-surface:#174d70;--fc-glass-surface-strong:#153f5d}
 body.glass-effect.theme-dark{--fc-glass-surface:#17384f;--fc-glass-surface-strong:#142f44}
}