/* AIORES-App – Light-Theme-Ergänzung zu panel-ui.css (Dunkel bleibt Standard). Aktiv, sobald gesetzt ist. Akzentfarben (amber/teal) bleiben in beiden Modi gleich. */ html[data-theme="light"]{ --ink:#eef1f6; /* Seitenhintergrund */ --ink-2:#ffffff; /* Karten hell */ --ink-3:#f5f8fc; --paper:#18213a; /* Haupttext dunkel */ --line:#e4e9f0; --line-2:#d5dde8; --muted:#5a6577; --muted-lt:#3b4557; } html[data-theme="light"] body{background:var(--ink);color:var(--paper);} /* Kopfleiste hell + leicht transluzent */ html[data-theme="light"] nav{ background:rgba(255,255,255,0.82); border-bottom:1px solid rgba(0,0,0,0.07); } /* Dekor-Raster/Glow dezenter auf hellem Grund */ html[data-theme="light"] .grid-bg{ background-image: linear-gradient(rgba(90,110,150,0.10) 1px,transparent 1px), linear-gradient(90deg,rgba(90,110,150,0.10) 1px,transparent 1px); } html[data-theme="light"] .g1{background:radial-gradient(ellipse,rgba(232,163,61,0.10),transparent 70%);} html[data-theme="light"] .g2{background:radial-gradient(ellipse,rgba(91,143,168,0.12),transparent 70%);} /* Karten hell mit weichem Schatten statt Innenglanz */ html[data-theme="light"] .panel{ background:linear-gradient(148deg,#ffffff,#f3f7fc); border:1px solid rgba(0,0,0,0.08); box-shadow:0 8px 24px -14px rgba(20,30,55,0.30); } /* Formularfelder hell */ html[data-theme="light"] input[type=text], html[data-theme="light"] input[type=password], html[data-theme="light"] input[type=email], html[data-theme="light"] input[type=number], html[data-theme="light"] textarea, html[data-theme="light"] select{ background:#ffffff;border-color:var(--line-2);color:var(--paper); } /* Buttons/Listen im Hellmodus */ html[data-theme="light"] .btn-ghost{background:rgba(0,0,0,0.03);color:var(--paper);} html[data-theme="light"] .nav-logout{color:var(--muted-lt);border-color:var(--line-2);} html[data-theme="light"] .tbl td{color:var(--muted-lt);} html[data-theme="light"] .tbl tr:hover td{color:var(--paper);} html[data-theme="light"] ::selection{background:var(--amber);color:#fff;} /* Theme-Umschalter (in beiden Modi) */ .theme-toggle{ display:inline-flex;align-items:center;justify-content:center;gap:7px; font-family:'IBM Plex Mono',monospace;font-size:11.5px; color:var(--muted-lt);background:transparent;cursor:pointer; border:1px solid var(--line-2);border-radius:9px;padding:7px 12px; transition:all .2s var(--ease); } .theme-toggle:hover{color:var(--amber);border-color:rgba(232,163,61,0.4);} .theme-toggle svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;} .theme-toggle .t-sun{display:none;} .theme-toggle .t-moon{display:inline;} html[data-theme="light"] .theme-toggle .t-sun{display:inline;} html[data-theme="light"] .theme-toggle .t-moon{display:none;} /* Kopfleiste auf dem Handy kompakt in EINER Reihe halten: Umschalter nur als Icon, kleinere Abstände. */ @media (max-width:600px){ nav{padding:12px 4vw;gap:10px;flex-wrap:nowrap;} .nav-left{gap:10px;min-width:0;} .nav-right{gap:10px;flex-wrap:nowrap;} .theme-toggle{padding:7px 9px;gap:0;} .theme-toggle span{display:none;} /* Text "Design" ausblenden */ .nav-logout{padding:7px 11px;} }