Illustrations/web/static/themes/midnight.css

92 lines
2.5 KiB
CSS

/* =========================================
Midnight — Command Center fixes
========================================= */
/* Panel containers */
html[data-theme="midnight"] .settings-console .cc-panel{
background:#121a2b; /* match other cards */
border:1px solid #1f2a44;
color:#e6edf3;
}
/* Titles, labels, kickers */
html[data-theme="midnight"] .settings-console .cc-title,
html[data-theme="midnight"] .settings-console .cc-panel-title{
color:#f0f4ff;
}
html[data-theme="midnight"] .settings-console .cc-kicker{
color:#9fb0c6; /* muted header label */
}
/* Buttons inside Command Center reuse midnight buttons,
but ensure the “Save/Publish” contrast is right */
html[data-theme="midnight"] .settings-console .btn{
background:#0f1728;
border:1px solid #273455;
color:#e6edf3;
}
html[data-theme="midnight"] .settings-console .btn-primary{
background:#3b82f6;
border-color:#3b82f6;
color:#fff;
}
html[data-theme="midnight"] .settings-console .btn-danger{
background:#ef4444;
border-color:#ef4444;
color:#fff;
}
/* Theme swatches: soften label pill + tile hover */
html[data-theme="midnight"] .settings-console .swatch{
border-color:#273455;
background:linear-gradient(135deg,#0f1728,#1c2741);
}
html[data-theme="midnight"] .settings-console .swatch:hover{
filter:brightness(1.06);
}
html[data-theme="midnight"] .settings-console .swatch-name{
background:rgba(255,255,255,.12);
color:#e6edf3;
}
/* Security tiles */
html[data-theme="midnight"] .settings-console .sec-tile{
background:rgba(18,26,43,.92);
border-color:rgba(34,197,94,.25);
color:#e6edf3;
}
html[data-theme="midnight"] .settings-console .sec-tile:hover{
border-color:rgba(34,197,94,.45);
box-shadow:0 10px 24px rgba(0,0,0,.35);
}
html[data-theme="midnight"] .settings-console .sec-icon{
background:rgba(34,197,94,.16);
color:#86efac;
}
html[data-theme="midnight"] .settings-console .sec-sub{
color:#9fb0c6;
}
html[data-theme="midnight"] .settings-console .sec-cta{
color:#e6edf3;
opacity:.8;
}
/* Inputs in Comms panel */
html[data-theme="midnight"] .settings-console .tool-input{
background:#0f1728;
border:1px solid #253151;
color:#e6edf3;
}
html[data-theme="midnight"] .settings-console .tool-input::placeholder{
color:#8692a6;
}
html[data-theme="midnight"] .settings-console .tool-input:focus{
border-color:#3b82f6;
box-shadow:0 0 0 3px rgba(59,130,246,.28);
outline:none;
}
/* Toggle switch track looks a bit dark otherwise */
html[data-theme="midnight"] .settings-console .slider{
background:#223055;
}