/* ========================================================================== */
/* TurniX — Styles (global + Chat page) */
/* File: app/static/css/styles.css */
/* ========================================================================== */
/* ---------------------------- */
/* ROOT THEME */
/* ---------------------------- */
:root{
--bg:#0b1220;
--panel:#0d1426;
--elev:#121a33;
--fg:#e6eaf2;
--muted:#9aa6c1;
--brand:#5b9cff;
--brand-acc:#8ec6ff;
--danger:#ef4444;
--radius:16px;
--shadow:0 20px 50px rgba(0,0,0,.45);
--safe-top:env(safe-area-inset-top,0px);
--nav-h:64px;
/* Palette mass-comm toggle */
--emp-off-bg: rgba(91,156,255,.20);
--emp-off-fg: #8ec6ff;
--emp-off-br: rgba(91,156,255,.35);
--emp-on-1: var(--brand-acc);
--emp-on-2: var(--brand);
--ctr-off-bg: rgba(255,208,0,.18);
--ctr-off-fg: #ffd166;
--ctr-off-br: rgba(255,208,0,.35);
--ctr-on-1: #ffd166;
--ctr-on-2: #f4c644;
--all-off-bg: rgba(91,156,255,.14);
--all-off-fg: var(--brand-acc);
--all-off-br: rgba(91,156,255,.28);
--all-on-1: var(--brand);
--all-on-2: #4a86f7;
/* BackOffice (viola) */
--bo-off-bg: rgba(111, 66, 193, .20);
--bo-off-fg: #c3a6ff;
--bo-off-br: rgba(111, 66, 193, .35);
--bo-on-1: #a074ff;
--bo-on-2: #6f42c1;
/* Logistica (menta) */
--log-off-bg: rgba(62, 180, 137, .20);
--log-off-fg: #9af0d2;
--log-off-br: rgba(62, 180, 137, .35);
--log-on-1: #53e6bd;
--log-on-2: #3eb489;
/* ---- Calendari: palette ruoli (fallback lato client) ---- */
--cal-purple:#8b5cf6; /* back office */
--cal-yellow:#facc15; /* collaboratore */
--cal-green:#22c55e; /* tecnico/field o logistica */
--cal-blue:#3b82f6; /* operativo/dipendente (default) */
--cal-red:#ef4444; /* speciale/altro */
--cal-cyan:#0ea5e9; /* on-call default */
/* Calendar responsive */
--day-min: 280px; /* min-width di una colonna giorno (puoi alzare a 300/320) */
}
/* ---------------------------- */
/* GLOBAL BASE & LAYOUT */
/* ---------------------------- */
*{box-sizing:border-box;}
html,body{height:100%;}
body{
margin:0;
font-family:ui-sans-serif,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Arial;
background:
radial-gradient(1200px 600px at 20% -10%,#13203e 0%,transparent 60%),
radial-gradient(1000px 600px at 100% 0%,#0e1a36 0%,transparent 55%),
var(--bg);
color:var(--fg);
display:flex;flex-direction:column;min-height:100vh;
-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
padding-top:calc(var(--nav-h) + var(--safe-top));
}
/* Contenitore responsive di pagina (usato in base.html) */
.tx-container{width:100%;max-width:1800px;margin-inline:auto;}
/* Scrollbar */
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:#0b1220;border-radius:8px;}
::-webkit-scrollbar-thumb{background:#2b3550;border-radius:8px;}
::-webkit-scrollbar-thumb:hover{background:#3d4c72;}
*{scrollbar-width:thin;scrollbar-color:#2b3550 #0b1220;}
/* Navbar */
.tx-navbar{
position:fixed;top:0;left:0;right:0;min-height:var(--nav-h);
padding-top:var(--safe-top);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
gap:.6rem;padding-inline:.85rem;background:rgba(13,20,38,.75);
border-bottom:1px solid rgba(255,255,255,.06);backdrop-filter:blur(10px);z-index:180;
}
.tx-hello{color:var(--muted);font-size:.95rem;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:62vw;}
.tx-right{display:flex;align-items:center;gap:.45rem;}
@media (max-width:820px){
.tx-navbar{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.tx-navbar::-webkit-scrollbar{height:6px;}
.tx-navbar > *, .tx-right > *{flex:0 0 auto;}
.tx-hello{max-width:50vw;}
}
/* Buttons */
.tx-btn-nav,.tx-btn{
appearance:none;border:1px solid rgba(255,255,255,.08);height:38px;padding:0 .9rem;border-radius:12px;
font-weight:600;font-size:1rem;line-height:1;background:linear-gradient(180deg,#101a35 0%,#0e1830 100%);
color:var(--fg);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;
cursor:pointer;transition:transform .08s ease,box-shadow .2s ease;
box-shadow:0 1px 0 rgba(255,255,255,.04),0 6px 12px rgba(0,0,0,.35);
}
.tx-btn-nav:hover,.tx-btn:hover{transform:translateY(-1px);box-shadow:0 3px 0 rgba(255,255,255,.04),0 12px 24px rgba(0,0,0,.4);}
.tx-btn.small{height:20px;padding:0 .6rem;font-size:.8rem;}
.tx-btn.primary{background:linear-gradient(180deg,var(--brand) 0%,#4a86f7 100%);color:#081225;border-color:rgba(255,255,255,.06);}
.tx-btn.danger{background:linear-gradient(180deg,#ff6b6b 0%,#ef4444 100%);color:#1a0b0b;}
.tx-btn.alt{background:#0b1220;color:var(--fg);}
.tx-logout{background:linear-gradient(180deg,#3d6df5 0%,#3158d0 100%);color:#e6efff;border-color:rgba(255,255,255,.1);cursor:pointer;}
/* Cards & page */
.tx-main{flex:1;display:grid;place-items:start center;padding:1.2rem .8rem;}
.tx-card{
background:linear-gradient(180deg,var(--panel) 0%,#0a1020 100%);
border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);
width:100%;max-width:980px;padding:1.1rem 1.1rem 1rem;box-shadow:var(--shadow);
}
.tx-card.wide{max-width:1300px;}
.tx-card.users-wide{max-width:min(1760px,96.5vw);}
.tx-login{max-width:560px;}
.tx-title{font-size:1.7rem;letter-spacing:.2px;margin:.25rem 0 1.1rem;font-weight:800;color:#dfe8ff;}
.tx-title span{color:var(--brand-acc);}
.tx-h2{font-size:1.2rem;letter-spacing:.2px;margin:.25rem 0 1.1rem;font-weight:800;color:#dfe8ff;}
/* --- Login: centratura solo via CSS --- */
.tx-main > .tx-login{
justify-self:center;
margin-inline:auto;
width:min(560px,92vw);
}
@supports selector(:has(*)){
.tx-main:has(> .tx-login){
place-items:center center;
min-height:calc(100vh - var(--nav-h) - var(--safe-top));
}
}
@supports not selector(:has(*)){
.tx-main > .tx-login{ margin-top:8vh; margin-bottom:8vh; }
}
/* Form */
.tx-field{display:grid;gap:.35rem;margin-bottom:.85rem;}
.tx-field>span,label.tx-inline,.tx-help{color:var(--muted);font-size:.95rem;}
input[type=text],input[type=email],input[type=password],select,textarea,.tx-input{
width:100%;padding:.7rem .8rem;border-radius:12px;border:1px solid rgba(255,255,255,.08);
background:#0b1220;color:var(--fg);box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
textarea{resize:vertical;min-height:120px;}
input:focus,select:focus,textarea:focus,.tx-input:focus{outline:2px solid #5b9cff;outline-offset:2px;}
.tx-row{display:flex;align-items:center;gap:.75rem;}
.tx-row.between{justify-content:space-between;}
.tx-row.end{justify-content:end;}
/* Tables */
.tx-table-wrapper{overflow:auto;-webkit-overflow-scrolling:touch;border-radius:12px;border:1px solid rgba(255,255,255,.06);}
.tx-table{width:100%;border-collapse:collapse;background:#0b1220;}
.tx-table th,.tx-table td{border-bottom:1px solid rgba(255,255,255,.06);padding:.7rem .75rem;text-align:left;vertical-align:middle;}
.tx-actions{display:flex;gap:.45rem;white-space:nowrap;}
/* Links list */
.tx-list{list-style:none;padding:0;margin:0;}
.tx-list a{color:var(--brand-acc);text-decoration:none;font-weight:600;}
.tx-list a:hover{text-decoration:underline;}
/* Flashes */
.tx-flashes{position:fixed;top:calc(var(--nav-h) + var(--safe-top) + 8px);left:50%;transform:translateX(-50%);display:grid;gap:.55rem;z-index:120;}
.tx-flash{
padding:.7rem 1rem;border-radius:12px;border:1px solid rgba(255,255,255,.06);background:#0b1220;
box-shadow:0 10px 30px rgba(0,0,0,.35);transition:opacity .3s ease,transform .3s ease;
}
.tx-flash-success{border-color:#14532d;}
.tx-flash-error{border-color:#7f1d1d;}
.tx-flash.is-success{border-color:#14532d;}
.tx-flash.is-error,.tx-flash.is-danger{border-color:#7f1d1d;}
.tx-flash.is-info{border-color:#1d4ed8;}
.tx-flash.is-fading{opacity:0;transform:translateY(-4px);}
/* Modal (new + legacy compat) */
.modal-open{overflow:hidden;}
.tx-modal{position:fixed;inset:0;display:grid;place-items:center;z-index:200;transition:opacity .2s ease;}
.tx-modal[aria-hidden="true"]{opacity:0;pointer-events:none;}
.tx-modal__overlay{position:absolute;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(4px);}
.tx-modal__dialog{
position:relative;display:grid;grid-template-rows:auto 1fr auto;max-height:92vh;
background:linear-gradient(180deg,var(--elev) 0%,#0b1220 100%);
border:1px solid rgba(255,255,255,.08);border-radius:16px;box-shadow:var(--shadow);
transform:translateY(10px) scale(.98);transition:transform .2s ease,opacity .2s ease;
opacity:.98;outline:none;width:min(760px,94vw);
}
.tx-modal[aria-hidden="false"] .tx-modal__dialog{transform:translateY(0) scale(1);opacity:1;}
.tx-modal__header,.tx-modal__footer{padding:.9rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem;border-bottom:1px solid rgba(255,255,255,.06);}
.tx-modal__footer{border-top:1px solid rgba(255,255,255,.06);border-bottom:none;}
.tx-modal__body{padding:1rem;overflow:auto;}
.tx-modal__close{background:transparent;border:none;color:var(--fg);font-size:1.6rem;cursor:pointer;line-height:1;}
/* Grid form */
.tx-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem;}
@media (max-width:640px){
.tx-grid{grid-template-columns:1fr;}
.tx-right{gap:.4rem;}
.tx-hello{max-width:55vw;}
}
/* Footer */
.tx-footer{opacity:.65;padding:1rem .85rem 1.25rem;font-size:.9rem;text-align:center;}
/* Notifications */
.tx-bell-wrap{position:relative;}
.tx-bell{
position:relative;border:1px solid rgba(255,255,255,.08);background:#0b1220;border-radius:999px;
width:40px;height:38px;display:flex;align-items:center;justify-content:center;
color:var(--brand);
}
.tx-bell svg{fill:currentColor;stroke:currentColor;}
/* Bell dot */
.tx-bell::after{content:none;display:none;}
.tx-bell.has-unread::after{
content:"";
position:absolute;
top:-4px; right:-4px;
width:10px; height:10px;
border-radius:9999px;
background:var(--brand);
box-shadow:0 0 0 2px var(--bg);
}
.tx-badge{
position:absolute;top:-6px;right:-6px;background:var(--brand);
color:#fff;border:1px solid var(--brand);
border-radius:999px;height:20px;min-width:20px;padding:0 6px;display:grid;place-items:center;font-size:.75rem;font-weight:700;
}
#notifCount[hidden]{display:none !important;}
.tx-notif-panel{position:absolute;right:0;top:calc(100% + 8px);width:min(460px,92vw);background:#0b1220;border:1px solid rgba(255,255,255,.08);border-radius:12px;box-shadow:var(--shadow);}
.tx-notif-head{display:flex;align-items:center;justify-content:space-between;padding:.7rem .8rem;border-bottom:1px solid rgba(255,255,255,.06);}
.tx-head-actions{display:flex;gap:.6rem;}
.tx-link{background:none;border:none;color:var(--brand-acc);padding:0;cursor:pointer;text-decoration:none;}
.tx-link:hover{text-decoration:underline;}
.tx-notif-list{max-height:360px;overflow:auto;}
.tx-notif-item{padding:.7rem .8rem;border-bottom:1px solid rgba(255,255,255,.06);display:grid;gap:.25rem;}
.tx-notif-item.unread{background:#0e1930;}
.tx-notif-subj{font-weight:700;}
.tx-notif-meta{color:var(--muted);font-size:.9rem;}
.tx-notif-snippet{opacity:.9;}
/* Notifiche: azioni */
.tx-notif-actions{display:flex;align-items:center;gap:.6rem;margin-top:.35rem;}
.tx-notif-actions .right{margin-left:auto;}
.tx-link.danger{color:var(--danger);}
.tx-link.danger:hover{text-decoration:underline;}
/* ---------------------------- */
/* CHAT CORE */
/* ---------------------------- */
/* Card container della pagina chat */
#txChatCard.tx-card.wide{max-width:min(1500px,96vw);padding:1rem;}
/* Shell a due colonne (sidebar + area messaggi) */
.tx-chat-shell{
display:grid;grid-template-columns:320px 1fr;gap:14px;
min-height:min(72vh, calc(100vh - var(--nav-h) - 140px));
}
@media (max-width:980px){.tx-chat-shell{grid-template-columns:1fr;}}
/* LEFT */
.tx-chat-left{display:flex;flex-direction:column;gap:.6rem;}
.tx-chat-header{display:flex;align-items:center;justify-content:space-between;padding:.4rem .6rem .2rem;}
.tx-chat-left .tx-searchbar{width:100%;}
/* Dropdown risultati utenti */
.tx-user-results{position:relative;}
.tx-user-results__panel{
position:absolute;inset:auto 0 0 0;transform:translateY(8px);
background:#0b1220;border:1px solid rgba(255,255,255,.08);border-radius:12px;box-shadow:var(--shadow);
max-height:360px;overflow:auto;z-index:120;
}
.tx-user-results__item{display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;cursor:pointer;}
.tx-user-results__item:hover{background:#101a35;}
.tx-user-results__empty{padding:.6rem .7rem;color:var(--muted);font-size:.95rem;}
/* Lista conversazioni */
#threadList.tx-thread-list{
flex:1;min-height:260px;background:#0b1220;border:1px solid rgba(255,255,255,.06);border-radius:12px;overflow:auto;
}
.tx-thread-empty{padding:1rem;color:var(--muted);}
/* Riga thread */
.tx-thread{
display:grid;grid-template-columns:1fr auto auto;
grid-template-rows:auto auto;gap:.25rem;
padding:.7rem .8rem;border-bottom:1px solid rgba(255,255,255,.06);
background:#0b1220;color:var(--fg);width:100%;box-sizing:border-box;cursor:pointer;
}
.tx-thread:hover{background:#0e1930;}
.tx-thread.is-active{background:#3d6df5;color:#fff;}
.tx-thread.is-active .t-title,.tx-thread.is-active .t-last,.tx-thread.is-active .t-meta{color:#fff;}
.tx-thread .t-title{grid-column:1 / 2;font-weight:700;}
.tx-thread .t-last{
grid-column:1 / 2;color:var(--muted);font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.tx-thread .t-meta{
grid-column:2 / 3;grid-row:1 / 3;align-self:center;text-align:right;color:var(--muted);font-size:.8rem;min-width:48px;
}
.tx-thread .t-unread{
display:inline-grid;place-items:center;min-width:22px;height:22px;border-radius:999px;background:#fff;color:#3d6df5;
font-size:.75rem;font-weight:800;margin-top:.25rem;
}
/* Azioni thread */
.tx-thread .t-actions{
grid-column:3 / 4;grid-row:1 / 3;display:flex;align-items:center;justify-content:flex-end;gap:.35rem;min-width:34px;
}
.tx-thread .btn-trash{
width:26px;height:26px;border-radius:50%;border:none;background:#ef5350;color:#fff;cursor:pointer;font-size:.9rem;
display:inline-flex;align-items:center;justify-content:center;transition:background .2s;
}
.tx-thread .btn-trash:hover{background:#d32f2f;}
/* RIGHT: area messaggi */
.tx-chat-right{
display:flex;flex-direction:column;gap:0;background:linear-gradient(180deg, var(--panel) 0%, #0a1020 100%);
border:1px solid rgba(255,255,255,.06);border-radius:12px;min-height:260px;contain:layout paint;
}
/* Topbar del thread */
.tx-chat-topbar{display:flex;align-items:center;justify-content:space-between;padding:.6rem .8rem;border-bottom:1px solid rgba(255,255,255,.06);}
.tx-chat-topbar .title{font-weight:800;letter-spacing:.2px;}
/* Typing */
.tx-typing{color:var(--muted);font-size:.9rem;padding:.2rem .8rem .6rem;}
/* Area messaggi */
.tx-chat-thread{
border:1px solid rgba(255,255,255,.06);border-radius:12px;height:min(54vh,520px);
overflow:auto;padding:.8rem;display:flex;flex-direction:column;gap:.6rem;background:#0b1220;
}
/* Bubbles */
.tx-chat-msg{display:flex;}
.tx-chat-msg.me{justify-content:flex-end;}
.tx-chat-bubble{max-width:82%;background:#101a35;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:.6rem .7rem;box-shadow:0 8px 20px rgba(0,0,0,.35);}
.tx-chat-msg.me .tx-chat-bubble{background:#13203e;}
.tx-chat-body{white-space:pre-wrap;word-wrap:break-word;}
.tx-chat-attach{margin-top:.35rem;font-size:.9rem;color:var(--muted);}
.tx-chat-meta{margin-top:.25rem;font-size:.8rem;color:var(--muted);text-align:right;}
/* Composer */
.tx-chat-composer{
display:grid;grid-template-columns:auto 1fr auto;gap:.5rem;padding:.6rem;border-top:1px solid rgba(255,255,255,.06);
width:100%;box-sizing:border-box;
}
.tx-chat-composer .tx-input{width:100%;height:44px;border-radius:12px;}
.tx-attach-btn{
width:40px;height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0b1220;color:var(--fg);
display:inline-grid;place-items:center;cursor:pointer;
}
.tx-attach-btn:hover{background:#101a35;}
.tx-send-btn{min-width:84px;height:40px;border-radius:12px;}
/* Lista preview allegati */
.tx-attach-list{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:.25rem .25rem;padding:0 .2rem .2rem;}
.tx-attach-pill{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .55rem;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);font-size:.85rem;}
.tx-attach-pill .remove{background:none;border:none;color:var(--muted);cursor:pointer;padding:0;font-size:1rem;line-height:1;}
.tx-attach-pill .remove:hover{color:#fff;}
/* Stato vuoto */
.tx-chat-empty{display:grid;place-items:center;text-align:center;color:var(--muted);padding:2rem 1rem;}
/* Mobile tweaks chat */
@media (max-width:820px){
#txChatCard.tx-card.wide{padding:.8rem;}
.tx-chat-topbar{padding:.55rem .6rem;}
.tx-chat-thread{padding:.6rem;}
.tx-chat-bubble{max-width:92%;}
.tx-chat-composer{grid-template-columns:auto 1fr auto;gap:.4rem;padding:.5rem;}
.tx-attach-list{padding:0 .1rem .15rem;}
}
@media (max-width:420px){
.tx-send-btn{min-width:74px;}
.tx-chat-topbar .title{font-size:1rem;}
.tx-thread .t-meta{font-size:.75rem;}
}
/* A11y & UX */
@media (prefers-reduced-motion: reduce){
.tx-thread,.tx-user-results__panel{scroll-behavior:auto;transition:none !important;}
}
.tx-thread:focus-within,.tx-user-results__item:focus{outline:2px solid var(--brand);outline-offset:2px;}
/* Ruoli (badge colore testo) */
.role-backoffice{color:#b388ff;font-weight:700;}
.role-dipendente{color:#4fc3f7;font-weight:700;}
.role-manager{color:#81c784;font-weight:700;}
.role-admin{color:#ef5350;font-weight:700;}
.role-default{color:var(--fg);font-weight:700;}
/* ---------------------------- */
/* CALENDARI / ALTRO */
/* ---------------------------- */
.tx-calendar{margin-top:.5rem;}
.tx-cal-grid{display:grid;grid-template-columns:repeat(7,minmax(120px,1fr));gap:8px;}
.tx-cal-cell{background:var(--panel,#0d1426);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:.5rem;min-height:110px;position:relative;}
.tx-cal-date{position:absolute;top:8px;right:10px;font-size:.9rem;color:var(--muted,#9aa6c1);}
.tx-tag{display:flex;align-items:center;gap:.4rem;margin-top:1.5rem;background:rgba(255,255,255,.04);padding:.3rem .4rem;border-radius:8px;}
.tx-bullet{width:10px;height:10px;border-radius:50%;display:inline-block;}
.tx-bullet.am{background:#5b9cff;}
.tx-bullet.pm{background:#8ec6ff;}
.tx-bullet.all{background:#22c55e;}
/* ---- Sidepanel ---- */
.tx-sidepanel{position:fixed;top:0;right:-360px;width:320px;height:100%;background:var(--panel,#0d1426);border-left:1px solid rgba(255,255,255,.08);transition:right .25s ease;z-index:50;}
.tx-sidepanel.open{right:0;}
.tx-sidepanel-head{display:flex;align-items:center;justify-content:space-between;padding:.8rem;border-bottom:1px solid rgba(255,255,255,.06);}
.tx-sidepanel-body{padding:.8rem;}
.tx-note{color:var(--muted,#9aa6c1);font-size:.9rem;}
/* ---- Legacy modal (compat) ---- */
.tx-modal[aria-hidden="true"]{display:none;}
.tx-modal{position:fixed;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.5);z-index:60;}
.tx-modal-dialog{background:var(--panel,#0d1426);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:1rem;width:min(560px,92vw);}
.tx-modal-title{margin:0 0 .7rem;}
.tx-modal-body{display:grid;gap:.5rem;}
.tx-modal-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.8rem;}
/* Utility/legacy */
.tx-actions{display:flex;gap:.5rem;margin-top:.7rem;}
.tx-btn{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:var(--fg);padding:.5rem .8rem;border-radius:10px;cursor:pointer;}
.tx-btn:hover{background:rgba(255,255,255,.12);}
.tx-btn-primary{background:var(--brand);border-color:var(--brand);}
.tx-btn-danger{background:var(--danger);border-color:var(--danger);}
.tx-h2{margin:.2rem 0 .6rem;}
.tx-h3{margin:.2rem 0 .4rem;}
.tx-flex{display:flex;gap:.5rem;align-items:center;}
.tx-spacer{flex:1;}
.tx-error{color:#ef4444;}
.tx-list{margin-top:.6rem;}
.tx-item{background:var(--panel,#0d1426);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:.6rem .8rem;}
.tx-row{display:flex;gap:.8rem;align-items:center;}
.tx-grow{flex:1;}
.tx-check{margin-right:.4rem;}
.tx-mt{margin-top:.5rem;}
/* v14 calendar header style */
.tx-cal-day{position:relative;padding-top:26px;}
.tx-cal-day .tx-cal-date{
position:absolute;top:0;left:0;right:0;height:24px;display:flex;align-items:center;justify-content:center;
background:rgba(255,255,255,0.06);border-bottom:1px solid rgba(255,255,255,0.08);font-weight:600;letter-spacing:.2px;
}
.tx-cal-day{min-height:86px;}
.tx-cal-grid{grid-auto-rows:minmax(120px,auto);}
/* ========================================================================== */
/* CALENDARIO ASSENZE — LAYOUT 2 COLONNE + RESPONSIVE CALENDAR */
/* (celle dinamiche + griglia a contenuto con scroll orizzontale) */
/* ========================================================================== */
/* Layout pagina: sidebar sinistra (strumenti+legenda) | centro (calendario) */
.abs-layout{
display:grid;
grid-template-columns: minmax(140px,160px) 1fr; /* sidebar */
gap:16px;
align-items:start;
}
@media (max-width:1200px){
.abs-layout{ grid-template-columns:1fr; }
.abs-aside{ order:2; }
}
/* Pannelli laterali compatti e “sticky” */
.abs-aside .abs-panel{
background:linear-gradient(180deg,var(--panel,#0d1426) 0%,#0a1020 100%);
border:1px solid rgba(255,255,255,.08);
border-radius:12px;
box-shadow:var(--shadow);
padding:.65rem;
position:sticky;
top:calc(var(--nav-h) + var(--safe-top) + 12px);
}
.abs-aside .abs-panel h4{
margin:0 0 .45rem;
font-weight:800;
letter-spacing:.2px;
font-size:.98rem;
}
.abs-aside .abs-panel p,
.abs-aside .abs-panel .tx-note{font-size:.9rem;line-height:1.25;margin:.35rem 0;}
.abs-aside .abs-panel + .abs-panel{margin-top:10px;}
/* Pulsanti dentro la sidebar */
.abs-aside .tx-btn{
width:100%;
height:34px;
padding:0 .65rem;
font-size:.95rem;
border-radius:10px;
}
.abs-aside .tx-btn + .tx-btn{margin-top:.35rem;}
.abs-aside .tx-btn.tx-btn-danger{height:34px;}
/* Card calendario nella colonna centrale */
.calendar-abs.tx-card{
width:100%;
max-width:100%;
margin:0;
}
/* Scala tipografica leggermente più piccola SOLO nel calendario assenze */
.calendar-abs{font-size:.96rem;}
.calendar-abs .tx-h2{font-size:1.12rem;}
.calendar-abs .tx-h3{font-size:1rem;}
/* --------- Wrapper scrollabile orizzontale (usiamo il contenitore .tx-calendar) --------- */
.calendar-abs .tx-calendar{
position:relative;
overflow-x:auto;
overflow-y:hidden;
-webkit-overflow-scrolling:touch;
padding-bottom:.25rem;
}
/* --------- Griglia giorni: 7 colonne a contenuto + larghezza intrinseca --------- */
.calendar-abs .tx-cal-grid{
--gap:10px;
display:grid;
gap:var(--gap);
grid-template-columns: repeat(7, minmax(var(--day-min), max-content));
grid-auto-rows: minmax(120px, auto);
width: max-content; /* la griglia può superare il wrapper, che scorre */
}
/* Celle giorno: altezza dinamica, nessun taglio */
.calendar-abs .tx-cal-cell{
background:rgba(255,255,255,.03);
border:1px solid rgba(255,255,255,.08);
border-radius:10px;
padding:.55rem;
min-height:120px;
height:auto;
overflow:visible;
}
/* Data giorno (non assoluta) */
.calendar-abs .tx-cal-date{
position:relative;top:auto;right:auto;
margin-bottom:.4rem;
font-weight:700;font-size:.85rem;opacity:.9;
white-space:nowrap;
}
/* Pillola evento: UNA sola riga, nessun wrap, visibile per intero */
.calendar-abs .abs-pill{
--role-color:#3b82f6; /* fallback */
display:inline-flex;
align-items:center;
flex-wrap:nowrap;
gap:.38rem;
margin:.24rem 0;
padding:.22rem .50rem;
height:26px;
border-radius:.55rem;
border:1px solid rgba(0,0,0,.18);
background:var(--role-color);
color:#fff;
line-height:1;
font-size:.74rem;
box-shadow:0 1px 0 rgba(0,0,0,.18) inset;
white-space:nowrap;
max-width:none; /* evita troncamenti */
}
.calendar-abs .abs-pill:hover{ filter:brightness(1.05); }
.calendar-abs .abs-pill .tx-check{ transform:scale(.9); flex:0 0 auto; }
/* Nome risorsa: su una riga */
.calendar-abs .abs-name{
flex:0 0 auto;
white-space:nowrap;
overflow:visible;
text-overflow:clip;
font-weight:600;
}
/* Tag tipo (AM/PM/ALL) */
.calendar-abs .abs-kind{
flex:0 0 auto;
display:inline-block;
font-weight:800;
font-size:.58rem;
line-height:1;
padding:.14rem .38rem;
border-radius:.42rem;
text-transform:uppercase;
letter-spacing:.3px;
white-space:nowrap;
background:rgba(0,0,0,.18);
border:1px solid rgba(0,0,0,.22);
}
/* Barre / navigazione mese */
.calendar-abs .tx-actions{display:flex;gap:.5rem;justify-content:flex-end;margin-top:.6rem;}
.calendar-abs .month-nav{gap:.5rem;align-items:center;}
.calendar-abs #monthTitle{font-size:1.06rem;font-weight:800;letter-spacing:.2px;}
/* Mapping colori ruolo lato CSS (fallback puro CSS) */
.calendar-abs .abs-pill[data-type="Dipendente"],
.calendar-abs .abs-pill.abs--dipendente,
.calendar-abs .abs-pill.abs--employee,
.calendar-abs .abs-pill.employee{ --role-color:var(--cal-blue); }
.calendar-abs .abs-pill[data-type="Collaboratore"],
.calendar-abs .abs-pill.abs--collaboratore,
.calendar-abs .abs-pill.abs--contractor,
.calendar-abs .abs-pill.contractor{ --role-color:var(--cal-yellow); }
.calendar-abs .abs-pill[data-dept="BackOffice"],
.calendar-abs .abs-pill.abs--backoffice{ --role-color:var(--cal-purple); }
.calendar-abs .abs-pill[data-dept="Logistica"],
.calendar-abs .abs-pill.abs--logistica{ --role-color:var(--cal-green); }
.calendar-abs .abs-pill.abs--tecnico,
.calendar-abs .abs-pill[data-type="Tecnico"],
.calendar-abs .abs-pill.abs--speciale{ --role-color:var(--cal-red); }
/* Legenda (sidebar sinistra) — compatta */
.legend-list{display:grid;gap:.38rem;}
.legend-item{display:flex;align-items:center;gap:.45rem;}
.legend-swatch{
width:12px;height:12px;border-radius:4px;
box-shadow:inset 0 0 0 1px rgba(0,0,0,.25);
}
.sw-blue{background:var(--cal-blue);}
.sw-yellow{background:var(--cal-yellow);}
.sw-purple{background:var(--cal-purple);}
.sw-green{background:var(--cal-green);}
.sw-red{background:var(--cal-red);}
.legend-item span{font-weight:600;font-size:.92rem;}
/* Responsive sidebar/calendario */
@media (max-width:900px){
.abs-aside .tx-btn{height:32px;font-size:.92rem;}
.abs-aside .abs-panel{padding:.6rem;}
.legend-item span{font-size:.9rem;}
}
@media (max-width:640px){
.abs-aside .tx-btn{width:100%;}
}
/* ========================================================================== */
/* CALENDARIO REPERIBILITÀ — RESPONSIVE & COERENZA CON ASSENZE */
/* (se si usa griglia giorni analoga) */
/* ========================================================================== */
.oncall-cal .tx-calendar{
position:relative;
overflow-x:auto;
overflow-y:hidden;
-webkit-overflow-scrolling:touch;
padding-bottom:.25rem;
}
.oncall-cal .tx-cal-grid{
--gap:10px;
display:grid;
gap:var(--gap);
grid-template-columns: repeat(7, minmax(var(--day-min), max-content));
grid-auto-rows: minmax(120px, auto);
width:max-content;
}
.oncall-cal .tx-cal-cell{
background:rgba(255,255,255,.03);
border:1px solid rgba(255,255,255,.08);
border-radius:10px;
padding:.6rem;
min-height:120px;
height:auto;
overflow:visible;
}
.oncall-cal .tx-cal-date{
position:relative;top:auto;right:auto;
margin-bottom:.4rem;
font-weight:700;font-size:.85rem;opacity:.9;
white-space:nowrap;
}
/* Pillola on-call: UNA riga */
.oncall-cal .oc-pill{
--role-color:var(--cal-cyan);
display:inline-flex;
align-items:center;
flex-wrap:nowrap;
gap:.38rem;
margin:.3rem 0;
padding:.22rem .50rem;
height:26px;
border-radius:.55rem;
border:1px solid rgba(0,0,0,.18);
background:var(--role-color);
color:#fff;
line-height:1;
font-size:.74rem;
box-shadow:0 1px 0 rgba(0,0,0,.18) inset;
white-space:nowrap;
}
.oncall-cal .oc-pill:hover{ filter:brightness(1.05); }
.oncall-cal .oc-pill .tx-check{ transform:scale(.9); flex:0 0 auto; }
.oncall-cal .oc-name{
flex:0 0 auto;
white-space:nowrap;
overflow:visible;
text-overflow:clip;
font-weight:600;
}
.oncall-cal .oc-tag{
flex:0 0 auto;
display:inline-block;
font-weight:800;
font-size:.58rem;
line-height:1;
padding:.14rem .38rem;
border-radius:.42rem;
text-transform:uppercase;
letter-spacing:.3px;
white-space:nowrap;
background:rgba(0,0,0,.18);
border:1px solid rgba(0,0,0,.22);
}
/* ========================================================================== */
/* PAGINA UTENZE (larghezza adattiva + scroll orizzontale) */
/* ========================================================================== */
/* contenitore extra-largo */
:is(#usersPage,#usersConsult).tx-card.users-wide{
max-width:min(1760px,96.5vw);
margin-inline:auto;
}
/* wrapper scroll (x e y) */
:is(#usersPage,#usersConsult) .tx-table-wrapper{
overflow-x:auto;
overflow-y:auto;
-webkit-overflow-scrolling:touch;
overscroll-behavior:contain;
}
/* tabelle utenti:
- table-layout:auto per far crescere le colonne in base al contenuto
- min-width per abilitare la barra orizzontale quando serve
*/
#usersPage .tx-table,
#usersConsult .tx-table{
table-layout:auto;
min-width:1400px;
}
/* celle: niente ellipsis globale, si vede tutto (mail, alias, ecc.) */
:is(#usersPage,#usersConsult) .tx-table th,
:is(#usersPage,#usersConsult) .tx-table td{
white-space:nowrap;
overflow:visible;
text-overflow:clip;
vertical-align:middle;
padding:8px 10px;
}
/* colonna numerazione (quando presente) */
:is(#usersPage,#usersConsult) .tx-table .col-num{
width:1%;
white-space:nowrap;
}
/* Larghezze minime indicative per le colonne principali di #usersPage
(ordine corrente con colonna Alias inclusa)
*/
#usersPage .tx-table th:nth-child(2),
#usersPage .tx-table td:nth-child(2){min-width:140px;} /* Cognome / Nome */
#usersPage .tx-table th:nth-child(3),
#usersPage .tx-table td:nth-child(3){min-width:140px;} /* Nome / Cognome */
#usersPage .tx-table th:nth-child(4),
#usersPage .tx-table td:nth-child(4){min-width:190px;} /* Alias (Calendari) */
#usersPage .tx-table th:nth-child(5),
#usersPage .tx-table td:nth-child(5){min-width:260px;} /* Mail */
#usersPage .tx-table th:nth-child(6),
#usersPage .tx-table td:nth-child(6){min-width:150px;} /* Recapito */
#usersPage .tx-table th:nth-child(7),
#usersPage .tx-table td:nth-child(7){min-width:150px;} /* Ruolo */
#usersPage .tx-table th:nth-child(8),
#usersPage .tx-table td:nth-child(8){min-width:130px;} /* Tipo */
#usersPage .tx-table th:nth-child(9),
#usersPage .tx-table td:nth-child(9){min-width:110px;} /* P.IVA */
#usersPage .tx-table th:nth-child(10),
#usersPage .tx-table td:nth-child(10){min-width:170px;} /* Ultimo accesso */
#usersPage .tx-table th:nth-child(11),
#usersPage .tx-table td:nth-child(11){min-width:120px;} /* Azioni */
/* Larghezze minime indicative per #usersConsult:
(#, Nome, Cognome, Alias, Mail, Recapito, Ruolo, Tipo, P.IVA, Attivo)
*/
#usersConsult .tx-table th:nth-child(1),
#usersConsult .tx-table td:nth-child(1){min-width:50px;} /* # */
#usersConsult .tx-table th:nth-child(2),
#usersConsult .tx-table td:nth-child(2){min-width:140px;} /* Nome */
#usersConsult .tx-table th:nth-child(3),
#usersConsult .tx-table td:nth-child(3){min-width:140px;} /* Cognome */
#usersConsult .tx-table th:nth-child(4),
#usersConsult .tx-table td:nth-child(4){min-width:190px;} /* Alias (Calendari) */
#usersConsult .tx-table th:nth-child(5),
#usersConsult .tx-table td:nth-child(5){min-width:260px;} /* Mail */
#usersConsult .tx-table th:nth-child(6),
#usersConsult .tx-table td:nth-child(6){min-width:150px;} /* Recapito */
#usersConsult .tx-table th:nth-child(7),
#usersConsult .tx-table td:nth-child(7){min-width:150px;} /* Ruolo */
#usersConsult .tx-table th:nth-child(8),
#usersConsult .tx-table td:nth-child(8){min-width:130px;} /* Tipo */
#usersConsult .tx-table th:nth-child(9),
#usersConsult .tx-table td:nth-child(9){min-width:110px;} /* P.IVA */
#usersConsult .tx-table th:nth-child(10),
#usersConsult .tx-table td:nth-child(10){min-width:80px;} /* Attivo */
/* stile celle/azioni specifico Gestione Utenze (invariato) */
#usersPage .tx-table th,#usersPage .tx-table td{padding:7px 9px;font-size:.965rem;}
#usersPage .tx-actions{gap:.4rem;}
#usersPage .tx-actions .tx-btn.small{height:30px;width:36px;padding:0;font-size:0;position:relative;border-radius:10px;}
#usersPage .tx-actions .tx-btn.small::before{
content:"";display:inline-block;width:18px;height:18px;background:currentColor;
-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain;
mask-repeat:no-repeat; mask-position:center; mask-size:contain;
}
/* matita sui non-danger */
#usersPage .tx-actions .tx-btn.small:not(.danger)::before{
-webkit-mask-image:url("data:image/svg+xml;utf8,");
mask-image:url("data:image/svg+xml;utf8,");
}
/* cestino sui danger */
#usersPage .tx-actions .tx-btn.small.danger::before{
-webkit-mask-image:url("data:image/svg+xml;utf8,");
mask-image:url("data:image/svg+xml;utf8,");
}
/* IMPORTANTISSIMO: su mobile non nascondiamo nulla */
@media (max-width:1300px){
:is(#usersPage,#usersConsult) table#usersTable th,
:is(#usersPage,#usersConsult) table#usersTable td{display:table-cell !important;}
}
/* Badge coerenti */
.badge{display:inline-block;padding:.15rem .55rem;border-radius:999px;font-size:.85rem;font-weight:700;line-height:1.1;border:1px solid rgba(255,255,255,.14);white-space:nowrap;}
.badge--employee{background:rgba(91,156,255,.20);color:#8ec6ff;border-color:rgba(91,156,255,.35);}
.badge--contractor{background:rgba(255,208,0,.18);color:#ffd166;border-color:rgba(255,208,0,.35);}
.text-bg-warning{background:rgba(255,208,0,.18);color:#ffd166;border-color:rgba(255,255,255,.35);}
.text-bg-secondary{background:rgba(91,156,255,.20);color:#8ec6ff;border-color:rgba(91,156,255,.35);}
.text-bg-purple { background-color:#6f42c1; color:#fff; border-color:#6f42c1; } /* BackOffice */
.text-bg-mint { background-color:#3eb489; color:#fff; border-color:#3eb489; } /* Logistica */
/* Searchbar pro (riusata) */
.tx-searchbar{position:relative;width:min(420px,62vw);}
.tx-searchbar .tx-input{
height:38px;width:100%;padding:0 40px 0 42px;border-radius:12px;
border:1px solid rgba(255,255,255,.10);
background:linear-gradient(180deg,#0f1832 0%,#0b1224 100%);color:var(--fg);
box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.tx-searchbar .tx-input:focus{outline:2px solid var(--brand);outline-offset:2px;}
.tx-searchbar .tx-search-ico{
position:absolute;left:12px;top:50%;transform:translateY(-50%);
width:20px;height:20px;opacity:.75;
background:
radial-gradient(circle at 35% 35%,#9fb9ff 0 32%,transparent 33%),
radial-gradient(circle at 62% 62%,#9fb9ff 0 38%,transparent 39%),
linear-gradient(#9fb9ff,#9fb9ff) 50% 50% / 60% 2px no-repeat;
border-radius:50%;
}
.tx-searchbar .tx-search-clear{
position:absolute;right:8px;top:50%;transform:translateY(-50%);
width:28px;height:28px;border-radius:999px;border:1px solid rgba(255,255,255,.10);
background:#0b1220;color:var(--fg);font-size:18px;line-height:26px;cursor:pointer;
}
.tx-searchbar .tx-search-clear:hover{background:#101a35;}
/* Mobile generico */
@media (max-width:640px){
.tx-card.users-wide{max-width:100%;}
:is(#usersPage,#usersConsult) .tx-row{gap:.5rem;flex-wrap:wrap;}
:is(#usersPage,#usersConsult) .tx-row .tx-input{min-width:260px;}
:is(#usersPage,#usersConsult) .tx-table th,
:is(#usersPage,#usersConsult) .tx-table td{padding:6px 7px;font-size:.96rem;}
:is(#usersPage,#usersConsult) .tx-btn.small{padding:0 .5rem;}
}
/* Very large screens */
@media (min-width:1600px){:is(#usersPage,#usersConsult).tx-card.users-wide{max-width:1600px;}}
/* Password reveal */
.tx-input-wrap{position:relative;width:100%;}
.tx-input-wrap.has-toggle input[type="password"],
.tx-input-wrap.has-toggle input[type="text"]{padding-right:44px;}
.tx-reveal{
position:absolute;right:8px;top:50%;transform:translateY(-50%);
width:28px;height:28px;border-radius:999px;border:1px solid rgba(255,255,255,.10);
background:#0b1220;color:var(--fg);display:inline-grid;place-items:center;cursor:pointer;
}
.tx-reveal:hover{background:#101a35;}
.tx-reveal::before{
content:"";width:18px;height:18px;background:currentColor;
-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain;
mask-repeat:no-repeat; mask-position:center; mask-size:contain;
-webkit-mask-image:url("data:image/svg+xml;utf8,");
mask-image:url("data:image/svg+xml;utf8,");
}
.tx-reveal[aria-pressed="true"]::before{
-webkit-mask-image:url("data:image/svg+xml;utf8,");
mask-image:url("data:image/svg+xml;utf8,");
}
/* ---------------------------- */
/* PAGINA COMUNICAZIONI MASS */
/* ---------------------------- */
#massCommPage .tx-table th,#massCommPage .tx-table td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;}
#massCommPage .tx-table .cell-em{max-width:1px;}
#massCommPage .tx-table-wrapper{border:1px solid rgba(255,255,255,.06);border-radius:12px;max-height:300px;overflow:auto;}
#massCommPage .tx-files{font-size:.9rem;display:flex;flex-wrap:wrap;gap:.25rem .25rem;}
#massCommPage .tx-files .file-pill{display:inline-block;padding:.25rem .55rem;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);}
#massCommPage #selCount{
display:inline-flex;align-items:center;justify-content:center;height:32px;line-height:32px;
padding:0 .6rem;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);
font-weight:700;font-size:.9rem;white-space:nowrap;vertical-align:middle;
}
/* Toggle Tutti */
#massCommPage #btnToggleAll{background:var(--all-off-bg);color:var(--all-off-fg);border-color:var(--all-off-br);}
#massCommPage #btnToggleAll:hover{filter:brightness(1.07);}
#massCommPage #btnToggleAll[aria-pressed="true"]{background:linear-gradient(180deg,var(--all-on-1) 0%,var(--all-on-2) 100%);color:#081225;border-color:rgba(255,255,255,.10);}
/* Toggle Collaboratori */
#massCommPage #btnToggleCtr{background:var(--ctr-off-bg);color:var(--ctr-off-fg);border-color:var(--ctr-off-br);}
#massCommPage #btnToggleCtr:hover{filter:brightness(1.08);}
#massCommPage #btnToggleCtr[aria-pressed="true"]{background:linear-gradient(180deg,var(--ctr-on-1) 0%,var(--ctr-on-2) 100%);color:#1b1300;border-color:rgba(255,208,0,.45);}
/* Toggle Dipendenti */
#massCommPage #btnToggleEmp{background:var(--emp-off-bg);color:var(--emp-off-fg);border-color:var(--emp-off-br);}
#massCommPage #btnToggleEmp:hover{filter:brightness(1.08);}
#massCommPage #btnToggleEmp[aria-pressed="true"]{background:linear-gradient(180deg,var(--emp-on-1) 0%,var(--emp-on-2) 100%);color:#081225;border-color:rgba(255,255,255,.10);}
/* Toggle BackOffice */
#massCommPage #btnToggleBack{background:var(--bo-off-bg);color:var(--bo-off-fg);border-color:var(--bo-off-br);}
#massCommPage #btnToggleBack:hover{filter:brightness(1.08);}
#massCommPage #btnToggleBack[aria-pressed="true"]{background:linear-gradient(180deg,var(--bo-on-1) 0%,var(--bo-on-2) 100%);color:#0c0820;border-color:rgba(255,255,255,.10);}
/* Toggle Logistica */
#massCommPage #btnToggleLog{background:var(--log-off-bg);color:var(--log-off-fg);border-color:var(--log-off-br);}
#massCommPage #btnToggleLog:hover{filter:brightness(1.08);}
#massCommPage #btnToggleLog[aria-pressed="true"]{background:linear-gradient(180deg,var(--log-on-1) 0%,var(--log-on-2) 100%);color:#031c14;border-color:rgba(255,255,255,.10);}
/* Fix mobile pagina mass-comm */
@media (max-width:820px){
#massCommPage .tx-row{flex-wrap:wrap;gap:.5rem .55rem;}
#massCommPage .tx-searchbar{flex:1 1 100%;width:100%;}
}
@media (max-width:640px){
#massCommPage .tx-table-wrapper{max-height:55vh;overflow-x:auto;overflow-y:auto;}
#massCommPage .tx-table{table-layout:auto;min-width:720px;}
#massCommPage .tx-table td.cell-em{max-width:none;white-space:normal;word-break:break-all;}
#massCommPage .tx-table th,#massCommPage .tx-table td{padding:8px 9px;font-size:.98rem;}
}
/* Footer (dup per completezza) */
.tx-footer{opacity:.65;padding:1rem .85rem 1.25rem;font-size:.9rem;text-align:center;}
/* Centra orizzontalmente qualunque .tx-card direttamente dentro .tx-container */
.tx-container > .tx-card{
margin-left:auto;
margin-right:auto;
}
/* Assicura larghezza “stretta” alla card di login */
.tx-card.tx-login{
max-width:560px;
width:100%;
}
/* (Opzionale) centra anche verticalmente SOLO la pagina login */
@supports selector(:has(*)){
.tx-main:has(.tx-card.tx-login){
place-items:center center;
min-height:calc(100vh - var(--nav-h) - var(--safe-top));
}
}
@supports not selector(:has(*)){
.tx-card.tx-login{ margin-block:8vh; }
}
/* ========================================================================== */
/* END OF FILE */
/* ========================================================================== */