Files
Alfredv2/alfred/app/static/css/alfred-admin-glass.css
T

72 lines
7.9 KiB
CSS

/* Alfred Glass Admin — identité visuelle de l'accueil Glass V1 */
:root{--glass-border:#b8d9fa32;--glass-field:#08182bd8;--glass-shadow:0 16px 45px #0006;--glass-text:#eff7ff}
body.alfred-admin-glass{color:var(--glass-text);background:#0b1726;font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;min-height:100dvh}
body.alfred-admin-glass::before{content:"";position:fixed;inset:-18px;z-index:-2;pointer-events:none;background:url('/static/img/alfred-ambience.webp') center/cover no-repeat;filter:blur(4px) saturate(1.05)}
body.alfred-admin-glass::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(120deg,#07101ce8,#06111f90 45%,#051324d5 100%)}
.alfred-admin-glass .admin-layout{max-width:none;padding:0 30px 65px 132px;min-height:100dvh}
.alfred-admin-glass .admin-header{height:94px;border:0;gap:20px;padding:10px 5px;background:transparent}
.alfred-admin-glass .brand{gap:15px}
.alfred-admin-glass .brand-orb{width:53px;height:53px;border-radius:15px;font-size:32px;background:linear-gradient(140deg,#7acaff,#0866f0);box-shadow:0 10px 25px #006cff45}
.alfred-admin-glass .brand strong{font-size:28px;font-weight:700;letter-spacing:-.04em;text-shadow:0 2px 10px #0007}
.alfred-admin-glass .brand small{color:#e4efff;font-size:12px}
.alfred-admin-glass .admin-header nav{gap:9px}
.alfred-admin-glass .admin-header nav a,.alfred-admin-glass .admin-header nav button{color:#d9e6f6;border:1px solid #d6e7ff2b;border-radius:23px;background:#0e1c2dbd;backdrop-filter:blur(14px);font-size:12px;padding:10px 15px}
.alfred-admin-glass .admin-header nav .selected{background:linear-gradient(145deg,#188af2,#0750c4);border-color:#6bbcff8a;color:white}
.alfred-admin-glass .ag-rail{position:fixed;z-index:8;top:113px;bottom:24px;left:14px;width:98px;padding:13px 8px;border-radius:20px;background:#081321e8;backdrop-filter:blur(18px);border:1px solid #d7eaff24;display:flex;flex-direction:column;gap:12px;box-shadow:var(--glass-shadow)}
.alfred-admin-glass .ag-rail a{min-height:87px;border-radius:14px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;text-align:center;font-size:12px;color:#e7f2ff}
.alfred-admin-glass .ag-rail a:hover{background:#2b405dbb}
.alfred-admin-glass .ag-rail a.is-active{background:linear-gradient(145deg,#008bff,#0a58d9);box-shadow:0 8px 23px #007afa55}
.alfred-admin-glass .ag-rail a span{font-size:28px;line-height:1.2}
.alfred-admin-glass .admin-main{padding-top:23px;max-width:1800px;margin:0 auto}
.alfred-admin-glass .page-top{margin:6px 0 23px;align-items:center}
.alfred-admin-glass .page-top h1{font-size:clamp(31px,3vw,47px);font-weight:680;color:#fff;text-shadow:0 2px 12px #0008}
.alfred-admin-glass .eyebrow{color:#74bfff;letter-spacing:.18em}
.alfred-admin-glass .page-top p.muted{color:#d8e6f6}
.alfred-admin-glass .panel,.alfred-admin-glass .metric-card{background:linear-gradient(130deg,#15243ae8,#111c30d9)!important;border:1px solid var(--glass-border);border-radius:21px;box-shadow:var(--glass-shadow);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.alfred-admin-glass .panel:hover{border-color:#9bcaff75}
.alfred-admin-glass .panel-title{border-color:#dfeaff22}
.alfred-admin-glass .panel-title h2{font-size:1.14rem;font-weight:680;color:white}
.alfred-admin-glass .panel-title p{color:#b5cce7}
.alfred-admin-glass .panel-symbol{width:47px;height:47px;background:#144d827d;border-radius:14px;color:#bbebff;font-size:23px}
.alfred-admin-glass .field label{color:#e4f3ff}
.alfred-admin-glass .field small,.alfred-admin-glass .muted{color:#b6c9dc}
.alfred-admin-glass .field input:not([type=range]):not([type=checkbox]),.alfred-admin-glass .field select,.alfred-admin-glass .auth-box input{background:var(--glass-field);color:white;border:1px solid #9bbbde61;border-radius:12px;min-height:45px}
.alfred-admin-glass .field input:focus,.alfred-admin-glass .field select:focus,.alfred-admin-glass .ag-row-fields :focus{outline:2px solid #48a9fc;outline-offset:2px}
.alfred-admin-glass .button{border-radius:12px;background:#182b42db;border-color:#9bbadd54;color:#edf7ff}
.alfred-admin-glass .button.primary{background:linear-gradient(135deg,#058bff,#0755d3);border-color:#68beffaf;box-shadow:0 8px 20px #0875f637}
.alfred-admin-glass .button.danger{background:#653039;border-color:#cf7583}
.alfred-admin-glass .notice{background:#153e2cdb;border-color:#50bf85a1}
.alfred-admin-glass .tag{background:#10283ebd;border-color:#88c8ff6b;color:#e0f5ff}
.alfred-admin-glass .metric-icon{background:#25619d74;color:#dcf1ff;border:1px solid #80c7ff75}
.alfred-admin-glass .metric-card{min-height:170px}
.alfred-admin-glass .status-pill[data-state="ok"]{background:#0c62395c;border-color:#3ac98b8c;color:#a3f9cd}
.alfred-admin-glass .meter{background:#070f1ca8}
.alfred-admin-glass .meter span{background:linear-gradient(90deg,#0569cf,#49b7ff)}
.alfred-admin-glass .service-row{border-color:#ffffff20}
.alfred-admin-glass .service-label{color:#eff7ff}
.alfred-admin-glass .service-sub,.alfred-admin-glass .mcp-item p{color:#b0cae2}
.alfred-admin-glass .mcp-item{background:#182e46a8;border:1px solid #aac8eb38;border-radius:14px}
.alfred-admin-glass .auth-screen{background:radial-gradient(ellipse at center,#152741e2,#061222ef 88%);backdrop-filter:blur(16px)}
.alfred-admin-glass .auth-box{background:#14253cde;border:1px solid #a2c7ee60;backdrop-filter:blur(20px)}
.alfred-admin-glass .monitor-grid{gap:16px}
.alfred-admin-glass .two-col{gap:18px}
.alfred-admin-glass .ag-maison-editor{margin-top:19px;scroll-margin-top:25px}
.alfred-admin-glass .ag-help{color:#d2e5fa;font-size:13px;line-height:1.65;margin:0 0 18px}
.alfred-admin-glass .ag-maison-rows{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.alfred-admin-glass .ag-row{background:#09172ad9;border:1px solid #99c5eb47;border-radius:16px;padding:15px;min-width:0}
.alfred-admin-glass .ag-row-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:13px}
.alfred-admin-glass .ag-row-header strong{font-size:14px;color:#ecf7ff}
.alfred-admin-glass .ag-row-buttons{display:flex;gap:5px}
.alfred-admin-glass .ag-small-button{width:30px;height:30px;border-radius:8px;border:1px solid #9cb6d45b;background:#1a3350;color:white;font-size:18px;cursor:pointer}
.alfred-admin-glass .ag-small-button:hover{background:#2278be}
.alfred-admin-glass .ag-small-button:disabled{opacity:.4}
.alfred-admin-glass .ag-row-fields{display:grid;grid-template-columns:1fr;gap:10px}
.alfred-admin-glass .ag-field{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:12px;color:#c9def4}
.alfred-admin-glass .ag-field input,.alfred-admin-glass .ag-field select{width:100%;min-width:0;min-height:43px;padding:9px 12px;color:white;background:#111f32;border:1px solid #95bce76e;border-radius:10px}
.alfred-admin-glass .ag-maison-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:10px;margin-top:18px}
.alfred-admin-glass #agMaisonMessage{margin-top:10px;min-height:19px;color:#a7e5c9}
.alfred-admin-glass #agMaisonMessage.ag-error{color:#ffb4ad}
@media(max-width:1250px){.alfred-admin-glass .ag-maison-rows{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.alfred-admin-glass .admin-layout{padding-left:115px;padding-right:14px}.alfred-admin-glass .ag-rail{left:8px;width:92px}.alfred-admin-glass .ag-maison-rows{grid-template-columns:1fr}}
@media(max-width:650px){.alfred-admin-glass .admin-layout{padding:0 12px 40px}.alfred-admin-glass .ag-rail{position:relative;inset:auto;width:auto;height:auto;margin:12px 0 6px;flex-direction:row;justify-content:space-around;padding:5px}.alfred-admin-glass .ag-rail a{min-height:58px;flex:1;font-size:11px}.alfred-admin-glass .ag-rail a span{font-size:22px}.alfred-admin-glass .admin-header{height:auto;min-height:85px;flex-wrap:wrap}.alfred-admin-glass .admin-header nav{display:flex;justify-content:flex-end}.alfred-admin-glass .page-top{align-items:flex-start}.alfred-admin-glass .ag-maison-actions{justify-content:flex-start}}