/* ============================================================
   backend.css — Keledò pannello /gestione/
   Font: System UI stack | Bootstrap Icons incluso a parte
   CSP compliant: zero stili inline nel markup
   ============================================================ */

/* ── 0. Custom properties ────────────────────────────────── */
:root {
  --k-brand:          #2d8a00;
  --k-brand-dark:     #1f6400;
  --k-brand-light:    #e8f5e1;
  --k-bg:             #f4f6f8;
  --k-bg-card:        #ffffff;
  --k-bg-sidebar:     #1a2332;
  --k-bg-sidebar-h:   #253044;
  --k-bg-topbar:      #ffffff;
  --k-text:           #1a1f2e;
  --k-text-muted:     #64748b;
  --k-text-light:     #94a3b8;
  --k-text-sidebar:   #c8d3e0;
  --k-border:         #e2e8f0;
  --k-border-strong:  #cbd5e1;
  --k-success:        #16a34a; --k-success-bg: #f0fdf4; --k-success-bd: #bbf7d0;
  --k-danger:         #dc2626; --k-danger-bg:  #fef2f2; --k-danger-bd:  #fecaca;
  --k-warning:        #d97706; --k-warning-bg: #fffbeb; --k-warning-bd: #fde68a;
  --k-info:           #0284c7; --k-info-bg:    #f0f9ff; --k-info-bd:    #bae6fd;
  --k-kpi-blue:       #0284c7;
  --k-kpi-green:      #16a34a;
  --k-kpi-amber:      #d97706;
  --k-kpi-coral:      #e05b2b;
  --k-sidebar-w:      240px;
  --k-topbar-h:       60px;
  --k-radius:         8px;
  --k-radius-lg:      12px;
  --k-shadow:         0 1px 3px rgba(0,0,0,.08);
  --k-shadow-md:      0 4px 12px rgba(0,0,0,.1);
  --k-font:           -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;
  --k-font-mono:      'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;
}
/* ── Dark mode automatico (segue OS, ignorato se l'utente ha scelto manualmente) */
@media (prefers-color-scheme: dark) {
  body:not([data-theme="light"]) {
    --k-bg: #0f1623; --k-bg-card: #1a2332; --k-bg-sidebar: #111827;
    --k-bg-sidebar-h: #1f2d40; --k-bg-topbar: #1a2332;
    --k-text: #e2e8f0; --k-text-muted: #94a3b8; --k-text-light: #64748b;
    --k-border: #253044; --k-border-strong: #334155;
    --k-success-bg: #0d2818; --k-success-bd: #166534;
    --k-danger-bg:  #2d0f0f; --k-danger-bd:  #7f1d1d;
    --k-warning-bg: #2d1f04; --k-warning-bd: #78350f;
    --k-info-bg:    #0c1f2d; --k-info-bd:    #0c4a6e;
  }
}
/* ── Dark mode manuale (pulsante toggle) */
body[data-theme="dark"] {
  --k-bg: #0f1623; --k-bg-card: #1a2332; --k-bg-sidebar: #111827;
  --k-bg-sidebar-h: #1f2d40; --k-bg-topbar: #1a2332;
  --k-text: #e2e8f0; --k-text-muted: #94a3b8; --k-text-light: #64748b;
  --k-border: #253044; --k-border-strong: #334155;
  --k-success-bg: #0d2818; --k-success-bd: #166534;
  --k-danger-bg:  #2d0f0f; --k-danger-bd:  #7f1d1d;
  --k-warning-bg: #2d1f04; --k-warning-bd: #78350f;
  --k-info-bg:    #0c1f2d; --k-info-bd:    #0c4a6e;
}
/* ── Light mode manuale (override quando l'OS è dark ma l'utente vuole chiaro) */
body[data-theme="light"] {
  --k-bg: #f4f6f8; --k-bg-card: #ffffff; --k-bg-sidebar: #1a2332;
  --k-bg-sidebar-h: #253044; --k-bg-topbar: #ffffff;
  --k-text: #1a1f2e; --k-text-muted: #64748b; --k-text-light: #94a3b8;
  --k-border: #e2e8f0; --k-border-strong: #cbd5e1;
}
/* ── 1. Base ─────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{margin:0;padding:0;min-height:100%;background:var(--k-bg)}
body{margin:0;padding:0;min-height:100vh;font-family:var(--k-font);font-size:15px;
  line-height:1.6;color:var(--k-text);background:var(--k-bg);-webkit-font-smoothing:antialiased}
a{color:var(--k-brand);text-decoration:none}
.k-clr-success{color:var(--k-success)}
.k-clr-warning{color:var(--k-warning)}
.k-clr-danger{color:var(--k-danger)}
.k-mt-14{margin-top:14px}
a:hover{color:var(--k-brand-dark);text-decoration:underline}
h1,h2,h3,h4{margin:0}

/* ── 2. Layout ───────────────────────────────────────────── */
.k-admin-body{display:flex;min-height:100vh}
.k-main{flex:1;margin-left:var(--k-sidebar-w);min-width:0;display:flex;flex-direction:column}
.k-content{flex:1;padding:24px;max-width:1400px;width:100%}

/* ── 3. Sidebar ──────────────────────────────────────────── */
.k-sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--k-sidebar-w);
  background:var(--k-bg-sidebar);display:flex;flex-direction:column;
  z-index:200;overflow-y:auto;transition:transform .25s ease}
.k-sidebar-brand{display:flex;align-items:center;gap:10px;padding:16px 16px 12px;
  border-bottom:1px solid rgba(255,255,255,.07);flex-shrink:0}
.k-brand-link{display:flex;align-items:center;gap:10px;color:#fff;font-weight:600;
  font-size:17px;text-decoration:none;flex:1}
.k-brand-link:hover{color:#fff;text-decoration:none}
.k-sidebar-toggle{display:none;background:none;border:none;color:var(--k-text-sidebar);
  font-size:18px;cursor:pointer;padding:4px}
.k-nav{list-style:none;margin:8px 0;padding:0;flex:1}
.k-nav-sep{height:1px;background:rgba(255,255,255,.07);margin:6px 12px}
.k-nav-link{display:flex;align-items:center;gap:10px;padding:9px 16px;
  color:var(--k-text-sidebar);border-radius:var(--k-radius);margin:1px 8px;
  font-size:14px;transition:background .15s,color .15s;text-decoration:none}
.k-nav-link:hover{background:var(--k-bg-sidebar-h);color:#fff;text-decoration:none}
.k-nav-item--active .k-nav-link{background:var(--k-brand);color:#fff}
.k-nav-link i{font-size:16px;flex-shrink:0;width:18px;text-align:center}
.k-nav-link--logout:hover{background:rgba(220,38,38,.2);color:#fca5a5}
.k-sidebar-plan{padding:12px 16px;border-top:1px solid rgba(255,255,255,.07);
  display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.k-plan-badge{font-size:12px;font-weight:600;background:var(--k-brand);color:#fff;
  padding:3px 8px;border-radius:12px}
.k-plan-upgrade{font-size:12px;color:var(--k-text-sidebar)}
.k-plan-upgrade:hover{color:#fff}
.k-sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:190}

/* ── 4. Topbar ───────────────────────────────────────────── */
.k-topbar{position:sticky;top:0;height:var(--k-topbar-h);background:var(--k-bg-topbar);
  border-bottom:1px solid var(--k-border);display:flex;align-items:center;
  justify-content:space-between;padding:0 24px;z-index:100;box-shadow:var(--k-shadow)}
.k-topbar-menu{display:none;background:none;border:none;font-size:22px;
  cursor:pointer;color:var(--k-text-muted);padding:4px}
.k-topbar-right{display:flex;align-items:center;gap:12px}
.k-topbar-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;
  border-radius:var(--k-radius);color:var(--k-text-muted);border:1px solid var(--k-border);
  transition:background .15s;text-decoration:none}
.k-topbar-btn:hover{background:var(--k-bg);color:var(--k-text)}
.k-topbar-user{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--k-text-muted);
  padding:6px 10px;border:1px solid var(--k-border);border-radius:var(--k-radius)}
/* Stato connessione SSE */
.kt-sse-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background-color:#64748b;
  flex-shrink:0;
  transition:background-color .3s, box-shadow .3s;
}
.kt-sse-dot.kt-sse-dot--ok{
  background-color:var(--k-success) !important;
  box-shadow:0 0 0 2px color-mix(in srgb, var(--k-success) 18%, transparent);
}
.kt-sse-dot.kt-sse-dot--error{
  background-color:var(--k-danger) !important;
}
.kt-sse-dot.kt-sse-dot--connect{
  background-color:var(--k-warning) !important;
  animation:kt-pulse 1s infinite;
}
@keyframes kt-pulse{0%,100%{opacity:1}50%{opacity:.4}}
/* ── 5. Page header ──────────────────────────────────────── */
.k-page-header{display:flex;align-items:baseline;gap:12px;margin-bottom:24px;flex-wrap:wrap}
.k-page-title{font-size:20px;font-weight:600;color:var(--k-text);margin:0;
  display:flex;align-items:center;gap:8px}
.k-page-title i{color:var(--k-text-muted);font-size:18px}
.k-page-sub{font-size:14px;color:var(--k-text-muted)}

/* ── 6. Grid ─────────────────────────────────────────────── */
.k-row{display:flex;gap:20px;margin-bottom:20px;flex-wrap:wrap}
.k-col-4{flex:0 0 calc(33.333% - 14px);min-width:260px}
.k-col-6{flex:0 0 calc(50% - 10px);min-width:300px}
.k-col-8{flex:0 0 calc(66.666% - 7px);min-width:320px}

/* ── 7. Cards ────────────────────────────────────────────── */
.k-card{background:var(--k-bg-card);border:1px solid var(--k-border);
  border-radius:var(--k-radius-lg);box-shadow:var(--k-shadow);margin-bottom:20px;overflow:hidden; height:100%;display:flex;flex-direction:column}
.k-card-head{display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;border-bottom:1px solid var(--k-border)}
.k-card-title{font-size:15px;font-weight:600;color:var(--k-text);margin:0;
  display:flex;align-items:center;gap:8px}
.k-card-title i{color:var(--k-text-muted)}
.k-card-link{font-size:13px;color:var(--k-brand)}
.k-card-body{padding:16px 18px}
.k-card-body--flush{padding:0}

/* ── 8. KPI cards ────────────────────────────────────────── */
.k-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:16px;margin-bottom:20px}
.k-kpi-card{background:var(--k-bg-card);border:1px solid var(--k-border);
  border-radius:var(--k-radius-lg);padding:18px;display:flex;align-items:center;
  gap:16px;box-shadow:var(--k-shadow);transition:box-shadow .15s}
.k-kpi-card:hover{box-shadow:var(--k-shadow-md)}
.k-kpi-card--alert{border-color:var(--k-danger-bd)}
.k-kpi-icon{width:46px;height:46px;border-radius:var(--k-radius);
  display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.k-kpi-blue  {background:var(--k-info-bg);   color:var(--k-kpi-blue)}
.k-kpi-green {background:var(--k-success-bg);color:var(--k-kpi-green)}
.k-kpi-amber {background:var(--k-warning-bg);color:var(--k-kpi-amber)}
.k-kpi-coral {background:#fef3ee;            color:var(--k-kpi-coral)}
.k-kpi-body{display:flex;flex-direction:column;min-width:0}
.k-kpi-value{font-size:28px;font-weight:700;line-height:1.1;color:var(--k-text)}
.k-kpi-label{font-size:13px;color:var(--k-text-muted);margin-top:2px}
.k-kpi-sub  {font-size:12px;color:var(--k-text-light);margin-top:2px}

/* ── 9. Tables ───────────────────────────────────────────── */
.k-table{width:100%;border-collapse:collapse;font-size:14px}
.k-table th{text-align:left;font-weight:600;font-size:12px;text-transform:uppercase;
  letter-spacing:.5px;color:var(--k-text-muted);padding:10px 18px;
  background:var(--k-bg);border-bottom:1px solid var(--k-border)}
.k-table td{padding:11px 18px;border-bottom:1px solid var(--k-border);
  color:var(--k-text);vertical-align:middle}
.k-table tbody tr:last-child td{border-bottom:none}
.k-table tbody tr:hover td{background:var(--k-bg)}
.k-text-mono{font-family:var(--k-font-mono);font-size:13px}
.k-text-muted{color:var(--k-text-muted)}

/* ── 10. Badges ──────────────────────────────────────────── */
.k-badge{display:inline-block;padding:2px 8px;border-radius:20px;
  font-size:12px;font-weight:600;white-space:nowrap}
.k-badge-green {background:var(--k-success-bg);color:var(--k-success)}
.k-badge-gray  {background:var(--k-bg);color:var(--k-text-muted);border:1px solid var(--k-border)}
.k-badge-blue  {background:var(--k-info-bg);color:var(--k-info)}
.k-badge-amber {background:var(--k-warning-bg);color:var(--k-warning)}
.k-badge-red   {background:var(--k-danger-bg);color:var(--k-danger)}
.k-badge-teal  {background:#ccfbf1;color:#0f766e}
.k-badge-gold  {background:#fef3c7;color:#92400e;border:1px solid #fcd34d}
.k-badge-bassa  {background:var(--k-bg);color:var(--k-text-muted)}
.k-badge-normale{background:var(--k-info-bg);color:var(--k-info)}
.k-badge-alta   {background:var(--k-warning-bg);color:var(--k-warning)}
.k-badge-urgente{background:var(--k-danger-bg);color:var(--k-danger)}

/* ── 11. Buttons ─────────────────────────────────────────── */
.k-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--k-brand);color:#fff;border:none;border-radius:var(--k-radius);
  padding:10px 20px;font-size:15px;font-weight:500;cursor:pointer;width:100%;
  transition:background .15s,transform .1s;font-family:var(--k-font);text-decoration:none}
.k-btn-primary:hover:not(:disabled){background:var(--k-brand-dark);color:#fff;text-decoration:none}
.k-btn-primary:active:not(:disabled){transform:scale(.98)}
.k-btn-primary:disabled{opacity:.6;cursor:not-allowed}
.k-btn-sm{display:inline-flex;align-items:center;gap:5px;background:var(--k-brand-light);
  color:var(--k-brand);border:1px solid var(--k-brand);border-radius:var(--k-radius);
  padding:5px 12px;font-size:13px;font-weight:500;cursor:pointer;text-decoration:none;
  transition:background .15s}
.k-btn-sm:hover{background:var(--k-brand);color:#fff;text-decoration:none}
.k-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:var(--k-radius);color:var(--k-text-muted);border:1px solid var(--k-border);
  transition:background .15s,color .15s;text-decoration:none}
.k-icon-btn:hover{background:var(--k-brand-light);color:var(--k-brand);border-color:var(--k-brand)}

/* ── 12. Alerts ──────────────────────────────────────────── */
.k-alert{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;
  border-radius:var(--k-radius);font-size:14px;margin-bottom:16px;border:1px solid transparent}
.k-alert i{flex-shrink:0;font-size:16px;margin-top:1px}
.k-alert-danger {background:var(--k-danger-bg);color:var(--k-danger);border-color:var(--k-danger-bd)}
.k-alert-success{background:var(--k-success-bg);color:var(--k-success);border-color:var(--k-success-bd)}
.k-alert-warning{background:var(--k-warning-bg);color:var(--k-warning);border-color:var(--k-warning-bd)}
.k-alert-link{font-weight:600;color:inherit;text-decoration:underline;margin-left:6px}

/* ── 13. Form ────────────────────────────────────────────── */
.k-field{margin-bottom:18px}
.k-label{display:block;font-size:13px;font-weight:500;color:var(--k-text);margin-bottom:6px}
.k-input-wrap{position:relative}
.k-input{width:100%;padding:10px 12px 10px 38px;border:1px solid var(--k-border-strong);
  border-radius:var(--k-radius);font-size:15px;font-family:var(--k-font);
  color:var(--k-text);background:var(--k-bg-card);transition:border-color .15s,box-shadow .15s;outline:none}
.k-input:focus{border-color:var(--k-brand);box-shadow:0 0 0 3px rgba(45,138,0,.15)}
.k-input::placeholder{color:var(--k-text-light)}
.k-input-icon{position:absolute;left:11px;top:50%;transform:translateY(-50%);
  color:var(--k-text-muted);font-size:16px;pointer-events:none}
.k-input-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);
  background:none;border:none;color:var(--k-text-muted);font-size:16px;cursor:pointer;padding:2px}
.k-input-toggle:hover{color:var(--k-text)}

/* ── 14. Login split layout ─────────────────────────────── */
.k-login-body{display:flex;flex-direction:column;min-height:100vh;background:#f1f5f9}
@media(prefers-color-scheme:dark){body:not([data-theme="light"]).k-login-body{background:var(--k-bg)}}
[data-theme="dark"].k-login-body{background:var(--k-bg)}
.k-login-split{flex:1;display:flex}
.k-login-panel-form{width:50%;display:flex;align-items:center;
  justify-content:center;padding:3rem 2rem;background:#f1f5f9}
@media(prefers-color-scheme:dark){body:not([data-theme="light"]) .k-login-panel-form{background:var(--k-bg)}}
[data-theme="dark"] .k-login-panel-form{background:var(--k-bg)}
.k-login-card{background:var(--k-bg-card);border:1px solid var(--k-border);
  border-radius:var(--k-radius-lg);padding:2.5rem;box-shadow:var(--k-shadow-md);
  width:100%;max-width:420px}
.k-login-brand{text-align:center;margin-bottom:2rem}
.k-login-title{font-size:1.625rem;font-weight:700;margin:0 0 .25rem;
  color:var(--k-text);letter-spacing:-.02em}
.k-login-sub{font-size:.875rem;color:var(--k-text-muted);margin:0}
.k-login-footer{text-align:center;margin-top:1.25rem}
.k-login-panel-brand{width:50%;display:flex;flex-direction:column;align-items:center;
  justify-content:center;background:linear-gradient(160deg,#1a2332 0%,#1a3a14 60%,#2d8a00 100%);
  padding:3rem;position:relative;overflow:hidden}
.k-login-brand-glow{position:absolute;width:500px;height:500px;
  background:radial-gradient(circle,rgba(45,138,0,.2) 0%,transparent 70%);
  border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.k-login-brand-inner{position:relative;z-index:1;text-align:center}
.k-login-brand-logo{display:block;margin:0 auto 1.5rem;border-radius:.75rem}
.k-login-brand-name{font-size:3rem;font-weight:700;color:#fff;
  letter-spacing:-.03em;line-height:1;margin-bottom:.75rem}
.k-login-brand-slogan{font-size:1.0625rem;color:rgba(255,255,255,.6);
  line-height:1.65;max-width:300px;margin:0 auto 2.25rem}
.k-login-brand-features{list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:.75rem;text-align:left}
.k-login-brand-feature{display:flex;align-items:center;gap:.625rem;
  color:rgba(255,255,255,.75);font-size:.9375rem}
.k-login-brand-feature i{color:#7bc67e;font-size:1.0625rem;flex-shrink:0}
.k-page-footer{background:#1a2332;border-top:1px solid rgba(255,255,255,.07);padding:.875rem 1.5rem}
.k-pf-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;
  gap:.5rem .75rem;font-size:.8125rem;color:rgba(255,255,255,.55)}
.k-pf-sep{opacity:.4}
.k-pf-link{color:rgba(255,255,255,.65);text-decoration:none}
.k-pf-link:hover{color:#fff;text-decoration:underline}
.k-btn-spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.4);
  border-top-color:#fff;border-radius:50%;animation:k-spin .6s linear infinite}
@keyframes k-spin{to{transform:rotate(360deg)}}
.k-spin{display:inline-block;animation:k-spin .6s linear infinite}
.k-alert-info   {background:var(--k-info-bg);color:var(--k-info);border-color:var(--k-info)}
.k-alert--toast {position:sticky;top:8px;z-index:900;box-shadow:0 4px 16px rgba(0,0,0,.12)}
.k-link{font-size:14px;color:var(--k-brand)}

/* ── 15. Lists & Timeline ────────────────────────────────── */
.k-list{list-style:none;margin:0;padding:0}
.k-list-item{padding:10px 0;border-bottom:1px solid var(--k-border);
  display:flex;flex-direction:column;gap:2px}
.k-list-item:last-child{border-bottom:none}
.k-list-main{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.k-list-link{font-size:14px;color:var(--k-text);font-weight:500}
.k-list-link:hover{color:var(--k-brand)}
.k-list-sub{font-size:12px;color:var(--k-text-muted)}
.k-timeline{list-style:none;margin:0;padding:0}
.k-timeline-item{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--k-border)}
.k-timeline-item:last-child{border-bottom:none}
.k-timeline-dot{width:8px;height:8px;border-radius:50%;margin-top:6px;
  flex-shrink:0;background:var(--k-text-light)}
.k-timeline-ok      .k-timeline-dot{background:var(--k-success)}
.k-timeline-errore  .k-timeline-dot{background:var(--k-danger)}
.k-timeline-warning .k-timeline-dot{background:var(--k-warning)}
.k-timeline-body{display:flex;flex-direction:column;gap:1px;min-width:0}
.k-timeline-action{font-size:13px;font-weight:500;color:var(--k-text)}
.k-timeline-desc{font-size:12px;color:var(--k-text-muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-timeline-time{font-size:11px;color:var(--k-text-light)}

/* ── 16. Plan bars ───────────────────────────────────────── */
.k-plan-bars{display:flex;flex-direction:column;gap:12px}
.k-plan-row{display:flex;align-items:center;gap:10px}
.k-plan-name{font-size:13px;min-width:70px;color:var(--k-text)}
.k-bar-wrap{flex:1;height:8px;background:var(--k-bg);border-radius:4px;overflow:hidden}
.k-bar{height:100%;border-radius:4px;transition:width .6s ease}
.k-bar-gray {background:var(--k-text-light)}
.k-bar-blue {background:var(--k-kpi-blue)}
.k-bar-amber{background:var(--k-kpi-amber)}
.k-bar-green{background:var(--k-kpi-green)}
.k-plan-count{font-size:13px;font-weight:600;color:var(--k-text);min-width:24px;text-align:right}

/* ── 17. Empty states ────────────────────────────────────── */
.k-empty{font-size:14px;color:var(--k-text-muted);text-align:center;padding:12px 0}
.k-empty-state{display:flex;flex-direction:column;align-items:center;
  padding:40px 20px;text-align:center;color:var(--k-text-muted)}
.k-empty-icon{font-size:40px;margin-bottom:12px;color:var(--k-text-light)}
.k-empty-state p{margin:0 0 16px;font-size:15px}

/* ── 18. Responsive ──────────────────────────────────────── */
@media(max-width:768px){
  .k-main{margin-left:0}
  .k-sidebar{transform:translateX(-100%);box-shadow:var(--k-shadow-md)}
  .k-sidebar.is-open{transform:translateX(0)}
  .k-sidebar-overlay.is-open{display:block}
  .k-sidebar-toggle,.k-topbar-menu{display:flex}
  .k-kpi-grid{grid-template-columns:1fr 1fr}
  .k-col-4,.k-col-6,.k-col-8{flex:0 0 100%}
  .k-content{padding:16px}
}
@media(max-width:900px){
  .k-login-split{flex-direction:column-reverse}
  .k-login-panel-brand{width:100%;min-height:220px;padding:2rem 1.5rem}
  .k-login-brand-name{font-size:2.25rem}
  .k-login-brand-features{display:none}
  .k-login-panel-form{width:100%;padding:2rem 1.25rem}
}
@media(max-width:480px){
  .k-kpi-grid{grid-template-columns:1fr}
  .k-login-card{padding:1.5rem 1.125rem}
}

/* ── 19. Filters bar ─────────────────────────────────────── */
.k-filters{margin-bottom:16px}
.k-filters-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.k-filter-search{position:relative;flex:1;min-width:200px}
.k-filter-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);
  color:var(--k-text-muted);font-size:15px;pointer-events:none}
.k-filter-input{width:100%;padding:8px 12px 8px 34px;border:1px solid var(--k-border-strong);
  border-radius:var(--k-radius);font-size:14px;font-family:var(--k-font);
  color:var(--k-text);background:var(--k-bg-card);outline:none;
  transition:border-color .15s}
.k-filter-input:focus{border-color:var(--k-brand)}
.k-filter-select{padding:8px 12px;border:1px solid var(--k-border-strong);
  border-radius:var(--k-radius);font-size:14px;font-family:var(--k-font);
  color:var(--k-text);background:var(--k-bg-card);outline:none;cursor:pointer}
.k-btn-filter{display:inline-flex;align-items:center;gap:6px;
  padding:8px 14px;background:var(--k-brand);color:#fff;
  border:none;border-radius:var(--k-radius);font-size:14px;cursor:pointer;
  font-family:var(--k-font)}
.k-btn-filter:hover{background:var(--k-brand-dark)}
.k-btn-filter-reset{display:inline-flex;align-items:center;gap:4px;
  padding:8px 10px;color:var(--k-text-muted);border:1px solid var(--k-border);
  border-radius:var(--k-radius);font-size:14px;text-decoration:none;
  transition:background .15s}
.k-btn-filter-reset:hover{background:var(--k-bg);text-decoration:none}

/* ── 20. Table extras ────────────────────────────────────── */
.k-table-thumb{width:40px;height:40px;object-fit:cover;
  border-radius:var(--k-radius);border:1px solid var(--k-border)}
.k-thumb-placeholder{width:40px;height:40px;display:flex;align-items:center;
  justify-content:center;background:var(--k-bg);border:1px solid var(--k-border);
  border-radius:var(--k-radius);color:var(--k-text-light);font-size:18px}
.k-table-link{font-size:12px;color:var(--k-text-muted)}
.k-table-link:hover{color:var(--k-brand)}
.k-actions{display:flex;gap:4px;align-items:center}
.k-field-row{display:flex;gap:8px;align-items:center}
.k-inline-form{display:inline}
.k-icon-btn--danger:hover{background:var(--k-danger-bg);
  color:var(--k-danger);border-color:var(--k-danger-bd)}

/* ── 21. Pagination ──────────────────────────────────────── */
.k-pagination{display:flex;gap:4px;padding:14px 18px;
  border-top:1px solid var(--k-border);flex-wrap:wrap}
.k-page-item{display:inline-flex;align-items:center;justify-content:center;
  min-width:32px;height:32px;padding:0 8px;
  border:1px solid var(--k-border);border-radius:var(--k-radius);
  font-size:13px;color:var(--k-text-muted);text-decoration:none;
  transition:background .15s}
.k-page-item:hover{background:var(--k-bg);text-decoration:none;color:var(--k-text)}
.k-page-item--active{background:var(--k-brand);color:#fff;border-color:var(--k-brand)}
.k-page-item--active:hover{background:var(--k-brand-dark);color:#fff}

/* ── 22. Form grid (new/edit) ────────────────────────────── */
.k-form-grid{display:grid;grid-template-columns:1fr 320px;gap:20px;align-items:start}
.k-form-col-main{}
.k-form-col-side{}
.k-row-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.k-row-3{display:grid;grid-template-columns:1fr 100px 1fr;gap:14px}
.k-card-footer{padding:12px 18px;border-top:1px solid var(--k-border)}
.k-card-footer--actions{display:flex;flex-direction:column;gap:10px}
.k-btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--k-bg);color:var(--k-text-muted);border:1px solid var(--k-border-strong);
  border-radius:var(--k-radius);padding:10px 20px;font-size:15px;font-weight:500;
  cursor:pointer;width:100%;transition:background .15s,color .15s,border-color .15s,transform .1s;
  font-family:var(--k-font);text-decoration:none}
.k-btn-secondary:hover:not(:disabled){background:var(--k-border);color:var(--k-text);text-decoration:none}
.k-btn-secondary:active:not(:disabled){transform:scale(.98)}
.k-btn-secondary:disabled{opacity:.6;cursor:not-allowed}

.k-input--plain{padding-left:12px}
.k-input--error{border-color:var(--k-danger);box-shadow:0 0 0 3px rgba(220,38,38,.12)}
.k-select{width:100%;padding:10px 12px;border:1px solid var(--k-border-strong);
  border-radius:var(--k-radius);font-size:15px;font-family:var(--k-font);
  color:var(--k-text);background:var(--k-bg-card);outline:none;
  transition:border-color .15s;cursor:pointer}
.k-select:focus{border-color:var(--k-brand);box-shadow:0 0 0 3px rgba(45,138,0,.15)}
.k-field--required .k-label::after{content:' *';color:var(--k-danger);font-size:12px}
.k-field-hint{font-size:12px;color:var(--k-text-light);display:block;margin-top:4px}
.k-hint-warning{color:var(--k-warning)}
.k-opt{font-size:12px;color:var(--k-text-light);font-weight:400}

/* Radio group visualizzazione menu */
.k-radio-group{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.k-radio-label{display:flex;align-items:center;gap:8px;font-size:14px;
  cursor:pointer;padding:8px 10px;border:1px solid var(--k-border);
  border-radius:var(--k-radius);transition:border-color .15s,background .15s}
.k-radio-label:has(input:checked){border-color:var(--k-brand);
  background:var(--k-brand-light);color:var(--k-brand-dark)}
.k-radio-label input{accent-color:var(--k-brand)}
.k-radio-label i{font-size:16px}

/* Toggle switch */
.k-switch-label{display:flex;align-items:center;justify-content:space-between;
  font-size:14px;color:var(--k-text);cursor:pointer;padding:4px 0}
.k-switch{position:relative;width:44px;height:24px;flex-shrink:0}
.k-switch input{position:absolute;opacity:0;width:0;height:0}
.k-switch-track{position:absolute;inset:0;background:var(--k-border-strong);
  border-radius:12px;transition:background .2s;cursor:pointer}
.k-switch-track::before{content:'';position:absolute;left:3px;top:3px;
  width:18px;height:18px;background:#fff;border-radius:50%;
  transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.k-switch input:checked + .k-switch-track{background:var(--k-brand)}
.k-switch input:checked + .k-switch-track::before{transform:translateX(20px)}

/* Upload area */
.k-upload-area{border:2px dashed var(--k-border);border-radius:var(--k-radius);
  padding:18px;text-align:center;transition:border-color .15s;margin-top:8px}
.k-upload-area:hover{border-color:var(--k-brand)}
.k-upload-icon{font-size:28px;color:var(--k-text-light);display:block;margin-bottom:6px}
.k-upload-text{font-size:13px;color:var(--k-text-muted);margin:0 0 2px}
.k-upload-hint{font-size:12px;color:var(--k-text-light);margin:0 0 10px}
.k-upload-btn{cursor:pointer}
.k-file-hidden{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.k-upload-filename{display:block;font-size:12px;color:var(--k-brand);
  margin-top:8px;word-break:break-all}
.k-img-preview{width:100%;height:120px;object-fit:cover;
  border-radius:var(--k-radius);margin-bottom:8px;
  border:1px solid var(--k-border)}
.k-img-preview--logo{height:80px;width:80px;object-fit:cover}

/* QR code */
.k-qr-body{display:flex;flex-direction:column;align-items:center;gap:10px}
.k-qr-img{width:160px;height:160px;border:1px solid var(--k-border);
  border-radius:var(--k-radius)}

/* ── 23. Responsive form ─────────────────────────────────── */
@media(max-width:900px){
  .k-form-grid{grid-template-columns:1fr}
  .k-form-col-side{display:contents}
}
@media(max-width:600px){
  .k-row-2,.k-row-3{grid-template-columns:1fr}
}

/* ── 24. Tipo portata specifics ──────────────────────────── */
.k-info-box{/*display:flex;*/align-items:flex-start;gap:10px;
  padding:12px 16px;background:var(--k-info-bg);border:1px solid var(--k-info-bd);
  border-radius:var(--k-radius);font-size:14px;color:var(--k-info);margin-bottom:16px}
.k-info-box i{flex-shrink:0;margin-top:1px}
.k-info-box--example{background:var(--k-bg);border-color:var(--k-border);
  color:var(--k-text-muted)}
.k-card-hint{font-size:13px;color:var(--k-text-muted);
  display:flex;align-items:center;gap:5px}

/* Sortable table */
.k-table--sortable .k-drag-handle{cursor:grab;color:var(--k-text-light);
  text-align:center;font-size:16px;padding:11px 8px}
.k-table--sortable .k-drag-handle:active{cursor:grabbing}
.k-row-dragging{opacity:.5;background:var(--k-brand-light)}
.k-row-over td{border-top:2px solid var(--k-brand)}

/* Ordine badge */
.k-order-badge{display:inline-flex;align-items:center;justify-content:center;
  min-width:32px;height:22px;padding:0 6px;
  background:var(--k-bg);border:1px solid var(--k-border);
  border-radius:var(--k-radius);font-size:12px;font-weight:600;
  color:var(--k-text-muted);font-family:var(--k-font-mono)}

/* Codice */
.k-code{font-family:var(--k-font-mono);font-size:12px;font-weight:600;
  background:var(--k-bg);border:1px solid var(--k-border);
  border-radius:4px;padding:2px 6px;color:var(--k-text)}

/* Tipo nome nella tabella */
.k-tipo-nome{display:flex;flex-direction:column;gap:2px}
.k-tipo-icon{width:24px;height:24px;object-fit:cover;
  border-radius:4px;flex-shrink:0}
.k-tipo-descr{font-size:12px}
.k-nav-label{font-size:11px;color:var(--k-brand);font-weight:500}

/* Icone stato nav */
.k-icon-ok {color:var(--k-success);font-size:16px}
.k-icon-off{color:var(--k-text-light);font-size:16px}

/* Nav extra panel */
.k-nav-extra{padding:12px;background:var(--k-bg);
  border-radius:var(--k-radius);border:1px solid var(--k-border)}

/* Textarea */
.k-textarea{width:100%;padding:10px 12px;border:1px solid var(--k-border-strong);
  border-radius:var(--k-radius);font-size:15px;font-family:var(--k-font);
  color:var(--k-text);background:var(--k-bg-card);resize:vertical;
  min-height:70px;outline:none;transition:border-color .15s}
.k-textarea:focus{border-color:var(--k-brand);box-shadow:0 0 0 3px rgba(45,138,0,.15)}

/* Icona preview (più piccola di cover) */
.k-img-preview--icon{width:60px;height:60px;object-fit:cover}

/* Mini list nelle card laterali */
.k-mini-list{list-style:none;margin:0;padding:0}
.k-mini-list li{padding:5px 0;border-bottom:1px solid var(--k-border);
  font-size:13px;color:var(--k-text)}
.k-mini-list li:last-child{border-bottom:none}

/* ── 25. Portate specifics ───────────────────────────────── */

/* Quota bar utilizzo piano */
.k-quota-bar{margin-bottom:16px}
.k-quota-info{display:flex;justify-content:space-between;
  font-size:13px;margin-bottom:6px;color:var(--k-text)}
.k-quota-track{height:6px;background:var(--k-border);border-radius:3px;overflow:hidden}
.k-quota-fill{height:100%;border-radius:3px;background:var(--k-brand);
  transition:width .5s ease}
.k-quota-fill--warn  {background:var(--k-warning)}
.k-quota-fill--danger{background:var(--k-danger)}

/* Tabella portate */
.k-table--portate .k-pietanza-cell{display:flex;flex-direction:column;gap:2px}
.k-code--sm{font-size:11px;padding:1px 4px}
.k-row-inactive td{opacity:.55}
.k-prezzo{font-family:var(--k-font-mono);font-size:13px;font-weight:600;
  white-space:nowrap}
.text-right{text-align:right}

/* Badge specialità portata */
.k-spec-icons{display:flex;gap:3px;justify-content:center;flex-wrap:wrap}
.k-spec-icon{display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;border-radius:4px;font-size:10px;font-weight:700;
  flex-shrink:0}
.k-spec-v  {background:#d1fae5;color:#065f46}
.k-spec-vg {background:#dcfce7;color:#166534}
.k-spec-sg {background:#fef3c7;color:#92400e}
.k-spec-ev {background:var(--k-warning-bg);color:var(--k-warning)}
.k-spec-ev i{font-size:11px}

/* Toggle button rapido */
.k-toggle-btn{background:none;border:none;cursor:pointer;padding:2px;
  font-size:22px;line-height:1;transition:opacity .15s}
.k-toggle-btn:hover{opacity:.7}
.k-toggle-on  {color:var(--k-brand)}
.k-toggle-off {color:var(--k-text-light)}

/* Allergeni grid */
.k-allergeni-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px}
.k-allergene-item{display:flex;align-items:center;gap:8px;
  padding:8px 10px;border:1px solid var(--k-border);border-radius:var(--k-radius);
  cursor:pointer;transition:border-color .15s,background .15s;font-size:13px}
.k-allergene-item:hover{border-color:var(--k-brand)}
.k-allergene-item--sel{border-color:var(--k-danger);background:var(--k-danger-bg)}
.k-allergene-item input{accent-color:var(--k-danger);flex-shrink:0}
.k-allergene-num{font-size:11px;font-weight:700;font-family:var(--k-font-mono);
  min-width:18px;color:var(--k-text-muted)}
.k-allergene-nome{color:var(--k-text)}

/* Prezzo input con prefisso euro */
.k-input-wrap--euro{display:flex;align-items:center}
.k-input-prefix{position:absolute;left:12px;top:50%;transform:translateY(-50%);
  color:var(--k-text-muted);font-size:15px;pointer-events:none}
.k-input--euro{padding-left:28px}

/* Switch group multipli */
.k-switch-group{display:flex;flex-direction:column;gap:10px;margin-top:4px}

/* Check list caratteristiche */
.k-check-list{display:flex;flex-direction:column;gap:10px}
.k-check-item{display:flex;align-items:center;gap:10px;cursor:pointer;
  font-size:14px;color:var(--k-text)}
.k-check-item input{accent-color:var(--k-brand);width:16px;height:16px;flex-shrink:0}

/* Mini-list row con badge */
.k-mini-list-row{display:flex;align-items:center;justify-content:space-between;
  gap:8px;flex-wrap:wrap}

/* ── 26. Menu specifics ──────────────────────────────────── */

/* Header actions multipli */
.k-header-actions{display:flex;gap:8px;flex-wrap:wrap}

/* Info strip menù */
.k-menu-info-strip{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:10px 14px;background:var(--k-bg);border:1px solid var(--k-border);
  border-radius:var(--k-radius);margin-bottom:16px;font-size:14px;
  color:var(--k-text-muted)}
.k-menu-info-strip i{font-size:15px}

/* Menu cell nella tabella */
.k-menu-cell{display:flex;flex-direction:column;gap:4px}
.k-menu-badges{display:flex;gap:6px;flex-wrap:wrap}

/* Layout portate del menù: 2 colonne */
.k-portate-layout{display:grid;grid-template-columns:1fr 320px;
  gap:20px;align-items:start}
.k-portate-add .k-card--sticky{position:sticky;top:calc(var(--k-topbar-h) + 16px)}
.k-portate-search{margin-top:10px}

/* Lista portate nel menù */
.k-portate-list{list-style:none;margin:0;padding:0}
.k-portata-row{display:flex;align-items:center;gap:10px;
  padding:10px 14px;border-bottom:1px solid var(--k-border);
  transition:background .1s}
.k-portata-row:last-child{border-bottom:none}
.k-portata-row:hover{background:var(--k-bg)}
.k-portata-row.k-row-dragging{opacity:.5;background:var(--k-brand-light)}
.k-portata-row.k-row-over{border-top:2px solid var(--k-brand)}
.k-portata-thumb{width:40px;height:40px;flex-shrink:0;
  border-radius:var(--k-radius);overflow:hidden;
  background:var(--k-bg);border:1px solid var(--k-border);
  display:flex;align-items:center;justify-content:center;
  color:var(--k-text-light);font-size:18px}
.k-portata-thumb img{width:100%;height:100%;object-fit:cover}
.k-portata-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.k-portata-info strong{font-size:14px;color:var(--k-text)}
.k-portata-info .k-text-muted{font-size:12px}
.k-portata-note{font-size:12px;color:var(--k-brand);font-style:italic}
.k-portata-prezzo{font-size:13px;font-weight:600;font-family:var(--k-font-mono);
  color:var(--k-text);white-space:nowrap;min-width:60px;text-align:right}

@media(max-width:900px){
  .k-portate-layout{grid-template-columns:1fr}
  .k-portate-add .k-card--sticky{position:static}
}

/* ── 27. Utenti ──────────────────────────────────────────── */

/* Avatar iniziale */
.k-user-cell{display:flex;align-items:center;gap:10px}
.k-user-avatar{width:34px;height:34px;border-radius:50%;
  background:var(--k-brand-light);color:var(--k-brand);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:700;flex-shrink:0}

/* View layout */
.k-view-grid{display:grid;grid-template-columns:1fr 280px;gap:20px;align-items:start}
.k-view-side{}

/* Definition list */
.k-dl{display:grid;grid-template-columns:140px 1fr;gap:6px 12px;
  font-size:14px;margin:0}
.k-dl dt{color:var(--k-text-muted);font-weight:500}
.k-dl dd{color:var(--k-text);margin:0;word-break:break-word}
.k-dl--compact{gap:4px 12px;font-size:13px}

/* KPI stat row */
.k-stat-row{display:flex;justify-content:space-between;align-items:center;
  padding:8px 0;border-bottom:1px solid var(--k-border);font-size:14px}
.k-stat-row:last-child{border-bottom:none}
.k-stat-row span{color:var(--k-text-muted)}
.k-stat-row strong{color:var(--k-text)}

/* Action list nel dettaglio utente */
.k-action-list{display:flex;flex-direction:column;gap:8px}
.k-action-btn{display:flex;align-items:center;gap:8px;width:100%;
  padding:9px 14px;background:var(--k-bg);border:1px solid var(--k-border);
  border-radius:var(--k-radius);font-size:14px;font-family:var(--k-font);
  color:var(--k-text);cursor:pointer;transition:background .15s,border-color .15s;
  text-align:left}
.k-action-btn:hover{background:var(--k-brand-light);border-color:var(--k-brand);color:var(--k-brand-dark)}
.k-action-btn--danger:hover{background:var(--k-danger-bg);border-color:var(--k-danger-bd);color:var(--k-danger)}
.k-action-btn i{font-size:16px}

/* Reset link */
.k-reset-link{font-size:12px;word-break:break-all;display:block;margin:4px 0}
.k-btn-copy{background:none;border:1px solid currentColor;border-radius:4px;
  padding:2px 8px;font-size:12px;cursor:pointer;font-family:var(--k-font);
  margin-top:6px}

@media(max-width:900px){.k-view-grid{grid-template-columns:1fr}}

/* ── 28. Profilo ─────────────────────────────────────────── */

/* Tabs */
.k-tabs{display:flex;gap:4px;border-bottom:2px solid var(--k-border);
  margin-bottom:20px;flex-wrap:wrap}
.k-tab{display:flex;align-items:center;gap:7px;padding:10px 16px;
  font-size:14px;color:var(--k-text-muted);border-bottom:2px solid transparent;
  margin-bottom:-2px;text-decoration:none;transition:color .15s,border-color .15s}
.k-tab:hover{color:var(--k-text);text-decoration:none}
.k-tab--active{color:var(--k-brand);border-bottom-color:var(--k-brand);font-weight:500}
.k-tab i{font-size:15px}

/* Password strength */
.k-pwd-strength{height:4px;background:var(--k-border);border-radius:2px;
  overflow:hidden;margin-top:8px}
.k-pwd-bar{height:100%;border-radius:2px;width:0;transition:width .3s,background .3s}
.k-pwd-bar--weak  {background:#ef4444}
.k-pwd-bar--fair  {background:#f97316}
.k-pwd-bar--good  {background:#eab308}
.k-pwd-bar--strong{background:#22c55e}
.k-pwd-bar--great {background:#16a34a}

/* Tips list */
.k-tips-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.k-tips-list li{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--k-text-muted)}
.k-tips-list i{color:var(--k-success);font-size:15px}

/* Piano stats */
.k-piano-stats{display:flex;flex-direction:column;gap:14px}
.k-piano-stat-head{display:flex;justify-content:space-between;align-items:center;
  font-size:14px;margin-bottom:6px}
.k-piano-stat-head i{margin-right:5px;color:var(--k-text-muted)}
.k-piano-price{font-size:16px;font-weight:700;color:var(--k-brand)}
.k-card--upgrade{border-color:var(--k-brand);box-shadow:0 0 0 1px var(--k-brand)}

/* Upgrade diff */
.k-upgrade-diff{display:flex;flex-direction:column;gap:8px}
.k-diff-row{display:flex;align-items:center;gap:10px;font-size:14px;
  padding:8px;border-radius:var(--k-radius);color:var(--k-text-muted)}
.k-diff-row i:first-child{font-size:16px;width:20px;text-align:center}
.k-diff-row span:nth-child(2){flex:1}
.k-diff-row--better{background:var(--k-success-bg);color:var(--k-text)}
.k-diff-new{font-weight:700;color:var(--k-success)}

/* GDPR */
.k-gdpr-status{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;
  border-radius:var(--k-radius);font-size:14px}
.k-gdpr-status i{font-size:22px;flex-shrink:0;margin-top:1px}
.k-gdpr-status div{display:flex;flex-direction:column;gap:4px}
.k-gdpr-status strong{font-size:15px}
.k-gdpr-status--ok {background:var(--k-success-bg);color:var(--k-success)}
.k-gdpr-status--warn{background:var(--k-warning-bg);color:var(--k-warning)}
.k-gdpr-rights{display:flex;flex-direction:column;gap:16px}
.k-gdpr-right{display:flex;align-items:flex-start;gap:14px;padding:14px;
  border:1px solid var(--k-border);border-radius:var(--k-radius)}
.k-gdpr-right>i{font-size:22px;color:var(--k-text-muted);flex-shrink:0;margin-top:2px}
.k-gdpr-right div{display:flex;flex-direction:column;gap:6px}
.k-gdpr-right strong{font-size:14px}
.k-gdpr-right p{margin:0;font-size:13px;color:var(--k-text-muted)}
.k-btn-sm--danger{border-color:var(--k-danger);color:var(--k-danger);background:var(--k-danger-bg)}
.k-btn-sm--danger:hover{background:var(--k-danger);color:#fff}

/* ── 29. Promozioni ──────────────────────────────────────── */
.k-promo-price{font-weight:700;color:var(--k-success)}
.k-promo-save{display:block;font-size:11px;color:var(--k-success);font-weight:600}
.k-promo-dates{display:flex;align-items:center;gap:5px;font-size:13px;white-space:nowrap}
.k-date-from{color:var(--k-text)}
.k-date-sep{color:var(--k-text-light)}
.k-date-to{color:var(--k-text-muted)}
.k-promo-duration{font-size:13px;margin-top:6px;padding:6px 10px;border-radius:var(--k-radius)}
.k-promo-duration--ok {background:var(--k-info-bg);color:var(--k-info)}
.k-promo-duration--err{background:var(--k-danger-bg);color:var(--k-danger)}
.k-promo-saving{font-size:13px;margin-top:8px;font-weight:500}
.k-promo-saving--ok{color:var(--k-success)}
.k-char-count{font-size:12px;color:var(--k-text-light);text-align:right;margin-top:3px}

/* ── 30. Tavoli ──────────────────────────────────────────── */
.k-tavolo-num{display:inline-flex;align-items:center;justify-content:center;
  min-width:36px;height:36px;border-radius:50%;
  background:var(--k-bg);border:2px solid var(--k-border);
  font-size:14px;font-weight:700;font-family:var(--k-font-mono)}
.k-card--bulk{margin-bottom:16px}
.k-bulk-row{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.k-bulk-row .k-field{flex:1;min-width:120px;margin-bottom:0}
.k-field--btn{flex:0 0 auto}

/* ── 31. Ordini ──────────────────────────────────────────── */
.k-qty-badge{display:inline-flex;align-items:center;justify-content:center;
  min-width:28px;height:22px;padding:0 5px;
  background:var(--k-info-bg);color:var(--k-info);
  border-radius:4px;font-size:12px;font-weight:700;font-family:var(--k-font-mono)}

/* Flusso stati ordine */
.k-stato-flow{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.k-stato-btn{background:none;border:none;cursor:pointer;padding:4px}
.k-stato-btn:hover .k-badge{filter:brightness(.9)}
.k-stato-btn--active .k-badge{box-shadow:0 0 0 2px var(--k-brand)}

/* Chiudi ordine / esporta */
.k-chiudi-row{border-top:1px solid var(--k-border);padding-top:14px;margin-top:4px;align-items:start}
.k-export-col .k-label{font-size:12px;color:var(--k-text-muted);margin-bottom:6px}
.k-export-btns{display:flex;flex-direction:column;gap:6px;align-items:flex-start}

/* ── 32. Supporto ────────────────────────────────────────── */

/* Riga urgente */
.k-row-urgent td { border-left: 3px solid var(--k-danger); }

/* Link ticket nella tabella */
.k-ticket-link {
  font-weight: 500;
  color: var(--k-text);
  text-decoration: none;
}
.k-ticket-link:hover { color: var(--k-brand); text-decoration: underline; }

/* Header ticket dettaglio */
.k-ticket-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  background: var(--k-bg-card);
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius-lg);
  padding: 16px 18px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.k-ticket-oggetto {
  font-size: 17px;
  font-weight: 600;
  color: var(--k-text);
  margin: 0 0 8px;
}
.k-ticket-info {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 13px;
  color: var(--k-text-muted);
}
.k-ticket-info i { margin-right: 4px; }
.k-ticket-badges { display: flex; gap: 6px; flex-shrink: 0; align-items: flex-start; }

/* Thread messaggi */
.k-thread {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 20px;
  max-height: 600px;
  overflow-y: auto;
  padding: 4px 2px;
}
.k-thread-msg {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.k-thread-msg--admin { flex-direction: row-reverse; }
.k-thread-msg--admin .k-thread-bubble {
  background: var(--k-brand-light);
  border-color: var(--k-brand);
  margin-left: auto;
}
.k-thread-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--k-bg);
  border: 2px solid var(--k-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  flex-shrink: 0;
  color: var(--k-text-muted);
}
.k-thread-avatar--admin {
  background: var(--k-brand);
  border-color: var(--k-brand-dark);
  color: #fff;
}
.k-thread-bubble {
  flex: 1;
  max-width: 75%;
  background: var(--k-bg-card);
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius-lg);
  padding: 12px 14px;
}
.k-thread-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  font-size: 13px;
  flex-wrap: wrap;
}
.k-thread-meta strong { color: var(--k-text); }
.k-thread-meta span   { color: var(--k-text-light); font-size: 12px; }
.k-thread-text {
  font-size: 14px;
  color: var(--k-text);
  line-height: 1.6;
  white-space: pre-wrap;
  word-break: break-word;
}

/* Box risposta */
.k-reply-box {
  background: var(--k-bg-card);
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius-lg);
  padding: 16px 18px;
  margin-bottom: 20px;
}
.k-reply-box--closed {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--k-text-muted);
  font-size: 14px;
}
.k-reply-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
  flex-wrap: wrap;
}
.k-textarea--reply { min-height: 100px; resize: vertical; }

/* Priority grid */
.k-priority-grid {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.k-priority-item {
  cursor: pointer;
  border-radius: var(--k-radius);
  padding: 4px 6px;
  border: 2px solid transparent;
  transition: border-color .15s;
}
.k-priority-item input { display: none; }
.k-priority-item--sel  { border-color: var(--k-brand); }
.k-priority-item:hover { border-color: var(--k-border-strong); }

/* ── 33. Utilities ───────────────────────────────────────── */
.d-none { display: none !important; }
.text-center { text-align: center; }
.text-right  { text-align: right; }
.text-success { color: var(--k-success) !important; }


/* ═══════════════════════════════════════════════════════════
   34. Modal + Toast
   ═══════════════════════════════════════════════════════════ */
.k-modal-backdrop {
  position:fixed;inset:0;background:rgba(0,0,0,.45);
  z-index:500;display:flex;align-items:center;justify-content:center;padding:16px;
}
.k-modal-backdrop[hidden]{display:none}
.k-modal-overlay[hidden]{display:none}
.k-modal {
  background:var(--k-bg-card);border:1px solid var(--k-border);
  border-radius:var(--k-radius-lg);box-shadow:var(--k-shadow-md);
  width:100%;max-width:560px;max-height:90vh;
  display:flex;flex-direction:column;overflow:hidden;
  animation:k-modal-in .15s ease;
}
.k-modal--sm{max-width:380px}
@keyframes k-modal-in{
  from{opacity:0;transform:translateY(-10px)}
  to{opacity:1;transform:translateY(0)}
}
.k-modal-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;border-bottom:1px solid var(--k-border);flex-shrink:0;
}
.k-modal-title{font-size:15px;font-weight:600;color:var(--k-text);margin:0;display:flex;align-items:center;gap:8px}
.k-modal-close{
  background:none;border:none;color:var(--k-text-muted);
  font-size:18px;cursor:pointer;padding:2px;line-height:1;
  border-radius:var(--k-radius);transition:background .15s;
}
.k-modal-close:hover{background:var(--k-bg);color:var(--k-text)}
.k-modal-body{padding:18px;overflow-y:auto;flex:1}
.k-modal-foot{
  padding:12px 18px;border-top:1px solid var(--k-border);
  display:flex;justify-content:flex-end;gap:10px;flex-shrink:0;
}

/* ── Toast ───────────────────────────────────────────────────── */
.k-toast{
  position:fixed;bottom:24px;right:24px;z-index:600;
  padding:11px 18px;border-radius:var(--k-radius);
  font-size:14px;font-weight:500;box-shadow:var(--k-shadow-md);
  max-width:340px;animation:k-toast-in .2s ease;
}
.k-toast[hidden]{display:none}
@keyframes k-toast-in{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}
.k-toast--ok  {background:var(--k-success-bg);color:var(--k-success);border:1px solid var(--k-success-bd)}
.k-toast--err {background:var(--k-danger-bg); color:var(--k-danger); border:1px solid var(--k-danger-bd)}
.k-toast--warn{background:var(--k-warning-bg);color:var(--k-warning);border:1px solid var(--k-warning-bd)}

/* ═══════════════════════════════════════════════════════════
   34. Abbonamenti
   ─────────────────────────────────────────────────────────
   Tokens colore per piano (liberi da Bootstrap)
   Naming coerente con prefisso k-piano-*
   ═══════════════════════════════════════════════════════════ */

/* ── Tokens piano ────────────────────────────────────────── */
:root {
  --k-piano-free-color:      #6c757d;
  --k-piano-free-bg:         #f8f9fa;
  --k-piano-free-bd:         #dee2e6;

  --k-piano-silver-color:    #0284c7;
  --k-piano-silver-bg:       #f0f9ff;
  --k-piano-silver-bd:       #bae6fd;

  --k-piano-gold-color:      #d97706;
  --k-piano-gold-bg:         #fffbeb;
  --k-piano-gold-bd:         #fde68a;

  --k-piano-platinum-color:  #4f46e5;
  --k-piano-platinum-bg:     #eef2ff;
  --k-piano-platinum-bd:     #c7d2fe;
}

/* ── Griglia piani ───────────────────────────────────────── */
.k-piani-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

/* ── Singola card piano ──────────────────────────────────── */
.k-piano-card {
  background: var(--k-bg-card);
  border: 2px solid var(--k-border);
  border-radius: var(--k-radius-lg);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease;
  position: relative;
}
.k-piano-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--k-shadow-md);
}
.k-piano-card--current {
  border-width: 3px;
}
.k-piano-card--evidenziato::before {
  content: 'Consigliato';
  position: absolute;
  top: 12px;
  right: -28px;
  background: var(--k-brand);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  padding: 3px 32px;
  transform: rotate(45deg);
  transform-origin: center;
  white-space: nowrap;
  pointer-events: none;
}

/* Varianti colore per piano */
.k-piano-card--free     { border-color: var(--k-piano-free-bd); }
.k-piano-card--silver   { border-color: var(--k-piano-silver-bd); }
.k-piano-card--gold     { border-color: var(--k-piano-gold-bd); }
.k-piano-card--platinum { border-color: var(--k-piano-platinum-bd); }

.k-piano-card--free.k-piano-card--current     { border-color: var(--k-piano-free-color); }
.k-piano-card--silver.k-piano-card--current   { border-color: var(--k-piano-silver-color); }
.k-piano-card--gold.k-piano-card--current     { border-color: var(--k-piano-gold-color); }
.k-piano-card--platinum.k-piano-card--current { border-color: var(--k-piano-platinum-color); }

/* ── Header card piano ───────────────────────────────────── */
.k-piano-head {
  padding: 18px 18px 14px;
  text-align: center;
  border-bottom: 1px solid var(--k-border);
}
.k-piano-head--free     { background: var(--k-piano-free-bg); }
.k-piano-head--silver   { background: var(--k-piano-silver-bg); }
.k-piano-head--gold     { background: var(--k-piano-gold-bg); }
.k-piano-head--platinum { background: var(--k-piano-platinum-bg); }

.k-piano-icon {
  font-size: 26px;
  display: block;
  margin-bottom: 6px;
}
.k-piano-icon--free     { color: var(--k-piano-free-color); }
.k-piano-icon--silver   { color: var(--k-piano-silver-color); }
.k-piano-icon--gold     { color: var(--k-piano-gold-color); }
.k-piano-icon--platinum { color: var(--k-piano-platinum-color); }

.k-piano-nome {
  font-size: 16px;
  font-weight: 700;
  color: var(--k-text);
  margin: 0 0 4px;
}
.k-piano-prezzo {
  font-size: 28px;
  font-weight: 800;
  line-height: 1;
  margin: 6px 0 2px;
}
.k-piano-prezzo--free     { color: var(--k-piano-free-color); }
.k-piano-prezzo--silver   { color: var(--k-piano-silver-color); }
.k-piano-prezzo--gold     { color: var(--k-piano-gold-color); }
.k-piano-prezzo--platinum { color: var(--k-piano-platinum-color); }

.k-piano-periodo {
  font-size: 12px;
  color: var(--k-text-muted);
}

/* ── Body card piano ─────────────────────────────────────── */
.k-piano-body {
  padding: 14px 18px;
  flex: 1;
}
.k-piano-limits {
  list-style: none;
  margin: 0;
  padding: 0;
}
.k-piano-limit-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px solid var(--k-border);
  font-size: 13px;
  color: var(--k-text);
  gap: 8px;
}
.k-piano-limit-row:last-child { border-bottom: none; }
.k-piano-limit-label {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--k-text-muted);
}
.k-piano-limit-label i { width: 14px; text-align: center; }
.k-piano-limit-val {
  font-weight: 600;
  font-size: 13px;
  color: var(--k-text);
  white-space: nowrap;
}
.k-piano-limit-inf {
  font-size: 16px;
  color: var(--k-brand);
  line-height: 1;
}

/* ── Footer card piano ───────────────────────────────────── */
.k-piano-foot {
  padding: 12px 18px;
  border-top: 1px solid var(--k-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  color: var(--k-text-muted);
  gap: 8px;
}

/* ── Badge piano ─────────────────────────────────────────── */
.k-piano-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
  white-space: nowrap;
  border: 1px solid transparent;
}
.k-piano-badge--free {
  background: var(--k-piano-free-bg);
  color: var(--k-piano-free-color);
  border-color: var(--k-piano-free-bd);
}
.k-piano-badge--silver {
  background: var(--k-piano-silver-bg);
  color: var(--k-piano-silver-color);
  border-color: var(--k-piano-silver-bd);
}
.k-piano-badge--gold {
  background: var(--k-piano-gold-bg);
  color: var(--k-piano-gold-color);
  border-color: var(--k-piano-gold-bd);
}
.k-piano-badge--platinum {
  background: var(--k-piano-platinum-bg);
  color: var(--k-piano-platinum-color);
  border-color: var(--k-piano-platinum-bd);
}

/* ── Barre utilizzo risorse ──────────────────────────────── */
.k-usage-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.k-usage-row { display: flex; flex-direction: column; gap: 4px; }
.k-usage-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.k-usage-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--k-text);
  display: flex;
  align-items: center;
  gap: 6px;
}
.k-usage-info {
  font-size: 12px;
  color: var(--k-text-muted);
}
.k-usage-bar {
  width: 100%;
  height: 8px;
  background: var(--k-bg);
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid var(--k-border);
}
.k-usage-fill {
  height: 100%;
  border-radius: 4px;
  transition: width .5s ease;
}
.k-usage-fill--ok      { background: var(--k-kpi-green); }
.k-usage-fill--warn    { background: var(--k-kpi-amber); }
.k-usage-fill--danger  { background: var(--k-danger); }
.k-usage-fill--inf     { background: var(--k-brand); width: 100% !important; }
.k-usage-hint {
  font-size: 11px;
  color: var(--k-text-light);
  margin-top: 2px;
}

/* Alert utilizzo in linea */
.k-usage-alert {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 12px;
  border-radius: var(--k-radius);
  font-size: 13px;
  margin-top: 4px;
}
.k-usage-alert--warn {
  background: var(--k-warning-bg);
  color: var(--k-warning);
  border: 1px solid var(--k-warning-bd);
}
.k-usage-alert--danger {
  background: var(--k-danger-bg);
  color: var(--k-danger);
  border: 1px solid var(--k-danger-bd);
}
.k-usage-alert a {
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
}

/* ── Matrice caratteristiche / piano ─────────────────────── */
.k-feat-matrix {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.k-feat-matrix th {
  padding: 9px 12px;
  font-weight: 600;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--k-text-muted);
  background: var(--k-bg);
  border-bottom: 2px solid var(--k-border);
  text-align: center;
  white-space: nowrap;
}
.k-feat-matrix th:first-child { text-align: left; min-width: 180px; }
.k-feat-matrix td {
  padding: 8px 12px;
  border-bottom: 1px solid var(--k-border);
  vertical-align: middle;
  text-align: center;
  color: var(--k-text);
}
.k-feat-matrix td:first-child { text-align: left; }
.k-feat-matrix tbody tr:last-child td { border-bottom: none; }
.k-feat-matrix tbody tr:hover td { background: var(--k-bg); }

.k-feat-check { color: var(--k-success); font-size: 14px; }
.k-feat-cross  { color: var(--k-text-light); font-size: 14px; }
.k-feat-riepilogo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 3px;
  background: var(--k-info-bg);
  color: var(--k-info);
  font-size: 9px;
  font-weight: 700;
  margin-left: 5px;
  vertical-align: middle;
  flex-shrink: 0;
}

/* Switch nella matrice (usa k-switch esistente) */
.k-feat-switch-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── Tab abbonamenti ─────────────────────────────────────── */
.k-abb-tabs {
  display: flex;
  gap: 0;
  border-bottom: 2px solid var(--k-border);
  margin-bottom: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.k-abb-tabs::-webkit-scrollbar { display: none; }
.k-abb-tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 500;
  color: var(--k-text-muted);
  border: none;
  background: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  white-space: nowrap;
  transition: color .15s, border-color .15s;
  font-family: var(--k-font);
}
.k-abb-tab:hover { color: var(--k-text); }
.k-abb-tab.is-active {
  color: var(--k-brand);
  border-bottom-color: var(--k-brand);
  font-weight: 600;
}
.k-abb-tab-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: var(--k-bg);
  color: var(--k-text-muted);
  font-size: 11px;
  font-weight: 700;
  border: 1px solid var(--k-border);
}
.k-abb-tab.is-active .k-abb-tab-badge {
  background: var(--k-brand-light);
  color: var(--k-brand);
  border-color: var(--k-brand);
}

/* Pannello tab */
.k-abb-panel {
  background: var(--k-bg-card);
  border: 1px solid var(--k-border);
  border-top: none;
  border-radius: 0 0 var(--k-radius-lg) var(--k-radius-lg);
  padding: 20px;
}
.k-abb-panel--hidden { display: none; }

/* Sub-tabs interni (es. gestori / camerieri / eliminati) */
.k-sub-tabs {
  display: flex;
  border-bottom: 1px solid var(--k-border);
  margin-bottom: 16px;
  overflow-x: auto;
  scrollbar-width: none;
}
.k-sub-tabs::-webkit-scrollbar { display: none; }
.k-sub-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 500;
  color: var(--k-text-muted);
  border: none;
  background: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  cursor: pointer;
  white-space: nowrap;
  transition: color .15s, border-color .15s;
  font-family: var(--k-font);
}
.k-sub-tab:hover { color: var(--k-text); }
.k-sub-tab.is-active {
  color: var(--k-brand);
  border-bottom-color: var(--k-brand);
  font-weight: 600;
}
.k-sub-tab.is-active .k-abb-tab-badge {
  background: var(--k-brand-light);
  color: var(--k-brand);
  border-color: var(--k-brand);
}
.k-sub-panel--hidden { display: none; }

/* ── Titolo sezione interna ──────────────────────────────── */
.k-section-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--k-text);
  border-left: 3px solid var(--k-brand);
  padding-left: 10px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.k-section-title i { color: var(--k-brand); font-size: 13px; }

/* ── Tabella utenti abbonamenti ──────────────────────────── */
.k-abb-table th { font-size: 11px; white-space: nowrap; }
.k-abb-table td { font-size: 13px; }
.k-abb-user-name { font-weight: 600; font-size: 13px; color: var(--k-text); }
.k-abb-user-sub  { font-size: 11px; color: var(--k-text-muted); margin-top: 1px; }

/* ── Card piano corrente (vista proprietario) ────────────── */
.k-current-piano {
  background: var(--k-bg-card);
  border: 2px solid var(--k-brand);
  border-radius: var(--k-radius-lg);
  overflow: hidden;
}
.k-current-piano-head {
  padding: 20px;
  text-align: center;
  background: var(--k-brand-light);
  border-bottom: 1px solid var(--k-border);
}
.k-current-piano-icon {
  font-size: 32px;
  display: block;
  margin-bottom: 8px;
}
.k-current-piano-nome {
  font-size: 18px;
  font-weight: 700;
  color: var(--k-text);
  margin: 0 0 4px;
}
.k-current-piano-prezzo {
  font-size: 32px;
  font-weight: 800;
  color: var(--k-brand);
  line-height: 1;
}
.k-current-piano-body { padding: 14px 18px; }
.k-current-piano-foot {
  padding: 12px 18px;
  border-top: 1px solid var(--k-border);
  text-align: center;
}

/* ── Feature list (vista proprietario, tab configurazione) ── */
.k-feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 8px;
}
.k-feature-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: var(--k-bg);
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius);
  font-size: 13px;
  color: var(--k-text);
}
.k-feature-item i {
  color: var(--k-success);
  font-size: 13px;
  flex-shrink: 0;
}

/* ── CTA upgrade ─────────────────────────────────────────── */
.k-btn-upgrade {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  padding: 9px 14px;
  border: none;
  border-radius: var(--k-radius);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--k-font);
  transition: filter .15s, transform .1s;
  text-decoration: none;
}
.k-btn-upgrade:hover:not(:disabled) { filter: brightness(1.08); transform: translateY(-1px); text-decoration: none; }
.k-btn-upgrade:active:not(:disabled) { transform: scale(.98); }
.k-btn-upgrade:disabled { opacity: .5; cursor: not-allowed; }

.k-btn-upgrade--free     { background: var(--k-piano-free-bg);     color: var(--k-piano-free-color);     border: 1px solid var(--k-piano-free-bd); }
.k-btn-upgrade--silver   { background: var(--k-piano-silver-color); color: #fff; }
.k-btn-upgrade--gold     { background: var(--k-piano-gold-color);   color: #fff; }
.k-btn-upgrade--platinum { background: var(--k-piano-platinum-color); color: #fff; }
.k-btn-upgrade--current  { background: var(--k-brand-light); color: var(--k-brand); border: 1px solid var(--k-brand); cursor: default; }

/* ── Box info piano (tab configurazione) ─────────────────── */
.k-piano-info-box {
  background: var(--k-bg);
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius-lg);
  overflow: hidden;
}
.k-piano-info-box-head {
  padding: 12px 16px;
  font-weight: 600;
  font-size: 14px;
  color: var(--k-text);
  border-bottom: 1px solid var(--k-border);
  display: flex;
  align-items: center;
  gap: 7px;
}
.k-piano-info-box-body { padding: 4px 0; }
.k-piano-info-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 9px 16px;
  border-bottom: 1px solid var(--k-border);
  font-size: 13px;
}
.k-piano-info-row:last-child { border-bottom: none; }
.k-piano-info-key {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--k-text-muted);
}
.k-piano-info-key i { width: 14px; text-align: center; }
.k-piano-info-val { font-weight: 600; color: var(--k-text); }

/* ── Modal abbonamenti ───────────────────────────────────── */
.k-abb-modal-body { padding: 20px; }
.k-abb-modal-user {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: var(--k-bg);
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius);
  margin-bottom: 18px;
  font-size: 13px;
}
.k-abb-modal-user i { color: var(--k-text-muted); font-size: 15px; }

/* ── Dark mode overrides abbonamenti ─────────────────────── */
@media (prefers-color-scheme: dark) {
  :root {
    --k-piano-free-bg:         #1e2530;
    --k-piano-free-bd:         #334155;
    --k-piano-silver-bg:       #0c1d2e;
    --k-piano-silver-bd:       #1e4060;
    --k-piano-gold-bg:         #1e1800;
    --k-piano-gold-bd:         #4a3800;
    --k-piano-platinum-bg:     #1a1640;
    --k-piano-platinum-bd:     #3730a3;
  }
  
  body:not([data-theme="light"]) .k-feat-matrix tbody tr:hover td { background: var(--k-bg-sidebar-h); }
  body:not([data-theme="light"]) .k-usage-bar { border-color: var(--k-border); }
  body:not([data-theme="light"]) .k-feature-item { background: var(--k-bg-sidebar-h); border-color: var(--k-border); }
  body:not([data-theme="light"]) .k-piano-info-box { background: var(--k-bg-sidebar-h); }
}
body[data-theme="dark"] {
  --k-piano-free-bg:         #1e2530;
  --k-piano-free-bd:         #334155;
  --k-piano-silver-bg:       #0c1d2e;
  --k-piano-silver-bd:       #1e4060;
  --k-piano-gold-bg:         #1e1800;
  --k-piano-gold-bd:         #4a3800;
  --k-piano-platinum-bg:     #1a1640;
  --k-piano-platinum-bd:     #3730a3;
}
body[data-theme="dark"] .k-feat-matrix tbody tr:hover td { background: var(--k-bg-sidebar-h); }
body[data-theme="dark"] .k-usage-bar { border-color: var(--k-border); }
body[data-theme="dark"] .k-feature-item { background: var(--k-bg-sidebar-h); border-color: var(--k-border); }
body[data-theme="dark"] .k-piano-info-box { background: var(--k-bg-sidebar-h); }

  .k-feat-matrix tbody tr:hover td { background: var(--k-bg-sidebar-h); }
  .k-usage-bar { border-color: var(--k-border); }
  .k-feature-item { background: var(--k-bg-sidebar-h); border-color: var(--k-border); }
  .k-piano-info-box { background: var(--k-bg-sidebar-h); }
}

/* ── Responsive abbonamenti ──────────────────────────────── */
@media (max-width: 768px) {
  .k-piani-grid { grid-template-columns: 1fr 1fr; }
  .k-abb-panel  { padding: 14px; }
  .k-abb-tab    { padding: 9px 12px; font-size: 13px; }
  .k-feature-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .k-piani-grid   { grid-template-columns: 1fr; }
  .k-feature-grid { grid-template-columns: 1fr; }
  .k-feat-matrix  { font-size: 12px; }
  .k-feat-matrix th,
  .k-feat-matrix td { padding: 6px 8px; }
}

/* ══════════════════════════════════════════════════════════════
   config.php — Stili specifici configurazione
   Da aggiungere in fondo a backend.css
   ══════════════════════════════════════════════════════════════ */

/* ── Intro banner ─────────────────────────────────────────── */
.k-config-intro {
  display:flex; align-items:center; gap:10px;
  padding:12px 16px; margin-bottom:20px;
  background:var(--k-info-bg); border:1px solid var(--k-info-bd);
  border-radius:var(--k-radius); color:var(--k-info);
  font-size:.9rem;
}

/* ── Griglia gestori ──────────────────────────────────────── */
.k-gestori-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:16px;
}
.k-gestore-card {
  background:var(--k-bg-card);
  border:1px solid var(--k-border);
  border-radius:var(--k-radius-lg);
  overflow:hidden;
  box-shadow:var(--k-shadow);
  transition:box-shadow .15s;
}
.k-gestore-card:hover { box-shadow:var(--k-shadow-md); }

.k-gestore-card-accent {
  height:5px;
  background:var(--accent, var(--k-brand));
}
.k-gestore-card-body {
  padding:16px;
  display:flex; flex-direction:column; gap:12px;
}
.k-gestore-card-info {
  display:flex; flex-direction:column; gap:4px;
}
.k-gestore-name {
  font-weight:600; font-size:1rem; color:var(--k-text);
}
.k-gestore-email {
  font-size:.83rem; color:var(--k-text-muted);
}
.k-gestore-card-meta {
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.k-color-dot-group {
  display:flex; gap:4px;
}
.k-color-dot {
  display:inline-block; width:16px; height:16px;
  border-radius:50%; border:2px solid var(--k-border);
  background:currentColor;
}
.k-gestore-card-actions { margin-top:4px; }

/* ── Layout editor colori ─────────────────────────────────── */
.k-color-editor-layout {
  display:grid;
  grid-template-columns:1fr 320px;
  gap:24px;
  align-items:start;
}
@media (max-width:1100px) {
  .k-color-editor-layout { grid-template-columns:1fr; }
}

/* ── Card gruppo colori ───────────────────────────────────── */
.k-color-group { margin-bottom:0; }
.k-color-group-title {
  font-size:.9rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--k-text-muted);
}
.k-color-group-title i {
  font-size:.55rem;
  vertical-align:middle;
  color:var(--k-brand);
}

/* ── Riga singolo colore ─────────────────────────────────── */
.k-color-row {
  display:flex; flex-direction:column; gap:5px;
  padding:10px 0;
  border-bottom:1px solid var(--k-border);
}
.k-color-row:last-child { border-bottom:none; padding-bottom:0; }
.k-color-row:first-child { padding-top:0; }

/* ── Campo colore (swatch + hex + reset) ──────────────────── */
.k-color-field {
  display:flex; align-items:center; gap:8px;
}

/* Native color input stilizzato come swatch */
.k-color-swatch {
  width:40px; height:40px;
  border:2px solid var(--k-border);
  border-radius:var(--k-radius);
  padding:2px;
  cursor:pointer;
  background:none;
  flex-shrink:0;
  transition:border-color .15s;
}
.k-color-swatch:hover { border-color:var(--k-brand); }
.k-color-swatch::-webkit-color-swatch-wrapper { padding:0; border-radius:4px; }
.k-color-swatch::-webkit-color-swatch         { border:none; border-radius:4px; }
.k-color-swatch::-moz-color-swatch            { border:none; border-radius:4px; }

/* Input hex testuale */
.k-color-hex {
  width:110px;
  font-family:var(--k-font-mono);
  font-size:.9rem;
  letter-spacing:.05em;
  text-transform:lowercase;
  flex-shrink:0;
}
.k-color-hex--invalid {
  border-color:var(--k-danger) !important;
  background:var(--k-danger-bg);
}
.k-color-hex--valid { border-color:var(--k-border); }

/* Pulsante reset singolo campo */
.k-color-reset-btn {
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px;
  border:1px solid var(--k-border);
  border-radius:var(--k-radius);
  background:var(--k-bg);
  color:var(--k-text-muted);
  cursor:pointer;
  transition:background .15s, color .15s, border-color .15s;
  flex-shrink:0;
}
.k-color-reset-btn:hover {
  background:var(--k-warning-bg);
  color:var(--k-warning);
  border-color:var(--k-warning-bd);
}

/* ── Preview wrap e label ─────────────────────────────────── */
.k-color-preview-wrap {
  position:sticky;
  top:calc(var(--k-topbar-h) + 16px);
  display:flex; flex-direction:column; gap:10px;
}
.k-color-preview-label {
  font-size:.82rem; font-weight:600;
  color:var(--k-text-muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  display:flex; align-items:center; gap:6px;
}
.k-preview-note {
  font-size:.78rem; color:var(--k-text-muted);
  display:flex; align-items:flex-start; gap:5px;
  margin:0;
}

/* ── Preview mini-sito ────────────────────────────────────── */
.k-color-preview {
  border-radius:var(--k-radius-lg);
  border:1px solid var(--k-border);
  overflow:hidden;
  box-shadow:var(--k-shadow-md);
  font-size:11px;
  line-height:1.4;
  user-select:none;

  /* CSS variables del preview — valori iniziali dai PHP defaults */
  --fpv-primary:     #2d8a00;
  --fpv-secondary:   #1f6400;
  --fpv-accent:      #ff6b35;
  --fpv-bg:          #f8f9fa;
  --fpv-surface:     #ffffff;
  --fpv-text:        #212529;
  --fpv-text-muted:  #6c757d;
  --fpv-border:      #dee2e6;
  --fpv-header-bg:   #ffffff;
  --fpv-header-text: #212529;
  --fpv-footer-bg:   #1a2332;
  --fpv-footer-text: #c8d3e0;
}

/* Header preview */
.k-prev-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:8px 12px;
  background:var(--fpv-header-bg);
  color:var(--fpv-header-text);
  border-bottom:1px solid var(--fpv-border);
}
.k-prev-logo {
  display:flex; align-items:center; gap:5px;
  font-weight:700; font-size:12px;
  color:var(--fpv-header-text);
}
.k-prev-logo-dot {
  width:14px; height:14px;
  border-radius:50%;
  background:var(--fpv-primary);
}
.k-prev-nav {
  display:flex; gap:8px;
}
.k-prev-nav-item {
  color:var(--fpv-header-text);
  opacity:.7; cursor:default;
}
.k-prev-nav-item--active {
  color:var(--fpv-primary);
  opacity:1; font-weight:600;
}

/* Body preview */
.k-prev-body {
  background:var(--fpv-bg);
  padding:10px 12px;
  display:flex; flex-direction:column; gap:10px;
}

/* Hero preview */
.k-prev-hero {
  background:var(--fpv-surface);
  border:1px solid var(--fpv-border);
  border-radius:6px;
  padding:10px 12px;
  display:flex; flex-direction:column; gap:5px;
}
.k-prev-hero-title {
  margin:0; font-size:13px; font-weight:700;
  color:var(--fpv-text);
}
.k-prev-hero-sub {
  margin:0; font-size:10px; color:var(--fpv-text-muted);
}
.k-prev-btn-primary {
  display:inline-block; width:fit-content;
  padding:4px 10px; border-radius:4px;
  background:var(--fpv-primary); color:#fff;
  font-size:10px; font-weight:600; border:none; cursor:default;
  margin-top:4px;
}

/* Cards preview */
.k-prev-cards {
  display:grid; grid-template-columns:1fr 1fr; gap:8px;
}
.k-prev-card {
  background:var(--fpv-surface);
  border:1px solid var(--fpv-border);
  border-radius:6px; overflow:hidden;
}
.k-prev-card-img {
  height:40px;
  background:linear-gradient(135deg, var(--fpv-primary) 0%, var(--fpv-secondary) 100%);
  opacity:.3;
}
.k-prev-card-body {
  padding:6px 8px;
  display:flex; flex-direction:column; gap:3px;
}
.k-prev-card-tag {
  display:inline-block;
  font-size:8px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  color:var(--fpv-primary); background:transparent; padding:0;
}
.k-prev-card-tag--promo {
  color:var(--fpv-accent);
}
.k-prev-card-title {
  font-size:9px; font-weight:600; color:var(--fpv-text);
}
.k-prev-card-price {
  font-size:10px; font-weight:700; color:var(--fpv-primary);
}
.k-prev-btn-outline {
  display:inline-block; width:100%;
  padding:3px 0; border-radius:4px; margin-top:2px;
  background:transparent;
  border:1px solid var(--fpv-primary);
  color:var(--fpv-primary);
  font-size:9px; font-weight:600; cursor:default; text-align:center;
}

/* Footer preview */
.k-prev-footer {
  display:flex; align-items:center; justify-content:space-between;
  padding:7px 12px;
  background:var(--fpv-footer-bg);
  color:var(--fpv-footer-text);
  font-size:8px;
}
.k-prev-footer-link {
  opacity:.7; text-decoration:underline; cursor:default;
}

/* ── Back link pagina ─────────────────────────────────────── */
.k-back-link {
  display:inline-flex; align-items:center; gap:5px;
  font-size:.85rem; color:var(--k-text-muted);
  margin-top:2px;
  transition:color .15s;
}
.k-back-link:hover { color:var(--k-brand); text-decoration:none; }

/* ── Card info/warning (sidebar) ─────────────────────────── */
.k-card--info    { border-left:4px solid var(--k-info);    background:var(--k-info-bg); }
.k-card--warning { border-left:4px solid var(--k-warning); background:var(--k-warning-bg); }
.k-info-title {
  font-weight:600; font-size:.9rem; margin:0 0 8px;
  display:flex; align-items:center; gap:6px;
}
.k-card--info    .k-info-title { color:var(--k-info); }
.k-card--warning .k-info-title { color:var(--k-warning); }
.k-info-text {
  font-size:.83rem; color:var(--k-text-muted); margin:0 0 6px; line-height:1.55;
}
.k-info-text:last-child { margin-bottom:0; }
.k-info-text code {
  font-family:var(--k-font-mono); font-size:.8em;
  background:var(--k-bg); padding:1px 4px;
  border-radius:3px; border:1px solid var(--k-border);
}

/* ── Input sm (numero retention) ─────────────────────────── */
.k-input--sm { max-width:130px; }

/* ══════════════════════════════════════════════════════════════
   config.php — Stili specifici configurazione
   Da aggiungere in fondo a backend.css
   ══════════════════════════════════════════════════════════════ */

/* ── Back link intestazione pagina ───────────────────────────── */
.k-page-back {
  display:inline-flex; align-items:center; gap:6px;
  font-size:.85rem; color:var(--k-text-muted);
  transition:color .15s;
}
.k-page-back:hover { color:var(--k-brand); text-decoration:none; }

/* ── Banner intro ─────────────────────────────────────────────── */
.k-config-intro {
  display:flex; align-items:center; gap:10px;
  padding:12px 16px; margin-bottom:20px;
  background:var(--k-info-bg); border:1px solid var(--k-info-bd);
  border-radius:var(--k-radius); color:var(--k-info);
  font-size:.875rem; line-height:1.5;
}

/* ── Card colorata info / warning (sidebar) ──────────────────── */
.k-card--info    { border-left:4px solid var(--k-info);    background:var(--k-info-bg); }
.k-card--warning { border-left:4px solid var(--k-warning); background:var(--k-warning-bg); }
.k-info-title {
  font-weight:600; font-size:.9rem;
  display:flex; align-items:center; gap:6px;
  margin:0 0 8px;
}
.k-card--info    .k-info-title { color:var(--k-info); }
.k-card--warning .k-info-title { color:var(--k-warning); }
.k-info-text {
  font-size:.83rem; color:var(--k-text-muted);
  margin:0 0 6px; line-height:1.55;
}
.k-info-text:last-child { margin-bottom:0; }
.k-info-text code {
  font-family:var(--k-font-mono); font-size:.8em;
  background:var(--k-bg); padding:1px 4px;
  border-radius:3px; border:1px solid var(--k-border);
}

/* ── Input numero piccolo (retention giorni) ─────────────────── */
.k-input--sm { max-width:130px; }

/* ── Griglia gestori ──────────────────────────────────────────── */
.k-gestori-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));
  gap:16px;
}

/* ── Card gestore ─────────────────────────────────────────────── */
.k-gestore-card {
  background:var(--k-bg-card);
  border:1px solid var(--k-border);
  border-radius:var(--k-radius-lg);
  overflow:hidden;
  box-shadow:var(--k-shadow);
  transition:box-shadow .15s, transform .15s;
}
.k-gestore-card:hover {
  box-shadow:var(--k-shadow-md);
  transform:translateY(-1px);
}

/* Striscia colorata in cima alla card — background applicato via JS */
.k-gestore-card-stripe {
  height:5px;
  background:var(--k-brand); /* fallback se JS non attivo */
}

.k-gestore-card-body {
  padding:16px;
  display:flex; flex-direction:column; gap:10px;
}
.k-gestore-card-info {
  display:flex; flex-direction:column; gap:3px;
}
.k-gestore-name  { font-weight:600; font-size:.95rem; color:var(--k-text); }
.k-gestore-email { font-size:.82rem; color:var(--k-text-muted); }

.k-gestore-card-meta {
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
}

/* Pallini colore preview — background applicato via JS */
.k-color-dot-group { display:flex; gap:4px; }
.k-color-dot {
  width:16px; height:16px;
  border-radius:50%;
  border:2px solid var(--k-border);
  background:var(--k-border); /* fallback neutro se JS non attivo */
  flex-shrink:0;
}

.k-gestore-card-actions { margin-top:2px; }

/* ── Layout editor colori ─────────────────────────────────────── */
.k-color-editor-layout {
  display:grid;
  grid-template-columns:1fr 310px;
  gap:24px;
  align-items:start;
}
@media (max-width:1100px) {
  .k-color-editor-layout { grid-template-columns:1fr; }
}

/* ── Card gruppo colori ───────────────────────────────────────── */
.k-color-group-title {
  font-size:.82rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--k-text-muted);
}
.k-color-group-title .bi-circle-fill {
  font-size:.5rem;
  vertical-align:middle;
  color:var(--k-brand);
}

/* ── Riga singolo colore ──────────────────────────────────────── */
.k-color-row {
  display:flex; flex-direction:column; gap:5px;
  padding:10px 0;
  border-bottom:1px solid var(--k-border);
}
.k-color-row:first-child { padding-top:0; }
.k-color-row:last-child  { border-bottom:none; padding-bottom:0; }

/* ── Campo colore (swatch + hex + reset) ──────────────────────── */
.k-color-field {
  display:flex; align-items:center; gap:8px;
}

/* Input type=color stilizzato come swatch cliccabile */
.k-color-swatch {
  width:40px; height:40px; flex-shrink:0;
  border:2px solid var(--k-border);
  border-radius:var(--k-radius);
  padding:2px;
  background:none;
  cursor:pointer;
  transition:border-color .15s;
}
.k-color-swatch:hover { border-color:var(--k-brand); }
.k-color-swatch::-webkit-color-swatch-wrapper { padding:0; border-radius:4px; }
.k-color-swatch::-webkit-color-swatch         { border:none; border-radius:4px; }
.k-color-swatch::-moz-color-swatch            { border:none; border-radius:4px; }

/* Input hex testuale */
.k-color-hex {
  width:110px; flex-shrink:0;
  font-family:var(--k-font-mono);
  font-size:.9rem;
  letter-spacing:.04em;
  text-transform:lowercase;
}
.k-color-hex--invalid {
  border-color:var(--k-danger) !important;
  background:var(--k-danger-bg);
}
.k-color-hex--valid { border-color:var(--k-border); }

/* Pulsante reset singolo campo */
.k-color-reset-btn {
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; flex-shrink:0;
  border:1px solid var(--k-border);
  border-radius:var(--k-radius);
  background:var(--k-bg);
  color:var(--k-text-muted);
  cursor:pointer;
  transition:background .15s, color .15s, border-color .15s;
}
.k-color-reset-btn:hover {
  background:var(--k-warning-bg);
  color:var(--k-warning);
  border-color:var(--k-warning-bd);
}

/* ── Wrap preview ─────────────────────────────────────────────── */
.k-color-preview-wrap {
  position:sticky;
  top:calc(var(--k-topbar-h) + 16px);
  display:flex; flex-direction:column; gap:10px;
}
.k-color-preview-label {
  font-size:.8rem; font-weight:600;
  color:var(--k-text-muted);
  text-transform:uppercase; letter-spacing:.06em;
  display:flex; align-items:center; gap:6px;
}
.k-preview-note {
  font-size:.78rem; color:var(--k-text-muted);
  display:flex; align-items:flex-start; gap:5px;
  margin:0; line-height:1.5;
}

/* ── Mini-sito preview ────────────────────────────────────────── */
/*
  Tutte le --fpv-* CSS custom properties vengono impostate via JS
  (style.setProperty) leggendo i data-attributes del container.
  Il CSS qui definisce solo i valori di FALLBACK (colori default).
*/
.k-color-preview {
  border-radius:var(--k-radius-lg);
  border:1px solid var(--k-border);
  overflow:hidden;
  box-shadow:var(--k-shadow-md);
  font-size:11px;
  line-height:1.4;
  user-select:none;
  /* Fallback: i valori reali vengono scritti dal JS all'init */
  --fpv-primary:     #2d8a00;
  --fpv-secondary:   #1f6400;
  --fpv-accent:      #ff6b35;
  --fpv-bg:          #f8f9fa;
  --fpv-surface:     #ffffff;
  --fpv-text:        #212529;
  --fpv-text-muted:  #6c757d;
  --fpv-border:      #dee2e6;
  --fpv-header-bg:   #ffffff;
  --fpv-header-text: #212529;
  --fpv-footer-bg:   #1a2332;
  --fpv-footer-text: #c8d3e0;
}

.k-prev-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:8px 12px;
  background:var(--fpv-header-bg);
  border-bottom:1px solid var(--fpv-border);
}
.k-prev-logo {
  display:flex; align-items:center; gap:5px;
  font-weight:700; font-size:12px;
  color:var(--fpv-header-text);
}
.k-prev-logo-dot {
  width:14px; height:14px;
  border-radius:50%;
  background:var(--fpv-primary);
}
.k-prev-nav { display:flex; gap:8px; }
.k-prev-nav-item {
  color:var(--fpv-header-text);
  opacity:.65; cursor:default; font-size:10px;
}
.k-prev-nav-item--active {
  color:var(--fpv-primary);
  opacity:1; font-weight:600;
}

.k-prev-body {
  background:var(--fpv-bg);
  padding:10px 12px;
  display:flex; flex-direction:column; gap:8px;
}
.k-prev-hero {
  background:var(--fpv-surface);
  border:1px solid var(--fpv-border);
  border-radius:5px;
  padding:10px 12px;
  display:flex; flex-direction:column; gap:4px;
}
.k-prev-hero-title {
  margin:0; font-size:13px; font-weight:700;
  color:var(--fpv-text);
}
.k-prev-hero-sub {
  margin:0; font-size:10px; color:var(--fpv-text-muted);
}
.k-prev-btn-primary {
  display:inline-block; width:fit-content;
  padding:4px 10px; border-radius:4px; margin-top:2px;
  background:var(--fpv-primary); color:#fff;
  font-size:10px; font-weight:600;
  border:none; cursor:default;
}
.k-prev-cards {
  display:grid; grid-template-columns:1fr 1fr; gap:7px;
}
.k-prev-card {
  background:var(--fpv-surface);
  border:1px solid var(--fpv-border);
  border-radius:5px; overflow:hidden;
}
.k-prev-card-img {
  height:36px;
  background:linear-gradient(135deg, var(--fpv-primary), var(--fpv-secondary));
  opacity:.35;
}
.k-prev-card-body {
  padding:6px 8px;
  display:flex; flex-direction:column; gap:2px;
}
.k-prev-card-tag {
  font-size:8px; font-weight:700;
  text-transform:uppercase; letter-spacing:.04em;
  color:var(--fpv-primary);
}
.k-prev-card-tag--promo { color:var(--fpv-accent); }
.k-prev-card-title { font-size:9px; font-weight:600; color:var(--fpv-text); }
.k-prev-card-price { font-size:10px; font-weight:700; color:var(--fpv-primary); }
.k-prev-btn-outline {
  display:block; width:100%;
  padding:3px 0; border-radius:4px; margin-top:3px;
  background:transparent;
  border:1px solid var(--fpv-primary);
  color:var(--fpv-primary);
  font-size:9px; font-weight:600;
  cursor:default; text-align:center;
}
.k-prev-footer {
  display:flex; align-items:center; justify-content:space-between;
  padding:7px 12px;
  background:var(--fpv-footer-bg);
  color:var(--fpv-footer-text);
  font-size:8px;
}
.k-prev-footer-link { opacity:.7; text-decoration:underline; cursor:default; }

/* ── Featured toggle (sedi.php) ─────────────────────────── */
.k-icon-btn--featured          { color: var(--k-warning) }
.k-icon-btn--featured:hover    { background: var(--k-warning-bg); color: var(--k-warning) }

/* ── v2.1.0 — Menu in evidenza toggle (menu.php) ────────── */
.k-evidenza-btn                { color: var(--k-text-muted) }
.k-evidenza-btn:hover          { background: #fef3c7; color: #92400e; border-color: #fcd34d }
.k-evidenza-btn.k-evidenza-on  { color: #d97706 }
.k-evidenza-btn.k-evidenza-on:hover { background: #fef3c7; color: #92400e }

/* ═══════════════════════════════════════════════════════════════
   AGGIUNTE backend.css — Menù fissi nella comanda ordini
   Aggiungere in fondo al backend.css esistente
   ═══════════════════════════════════════════════════════════════ */

/* ── Riga header menù (fondo leggermente colorato) ────────── */
.k-riga-menu-header {
  background: color-mix(in srgb, var(--k-primary, #6366f1) 6%, transparent);
}
.k-riga-menu-header td:first-child {
  padding-left: 14px;
}

/* Label header menù: icona + nome + badge */
.k-menu-header-label {
  display:     flex;
  align-items: center;
  gap:         8px;
  flex-wrap:   wrap;
}
.k-menu-icon {
  color:      var(--k-primary, #6366f1);
  font-size:  1rem;
  flex-shrink: 0;
}

/* Badge "Menù fisso" sulla riga header */
.k-badge-menu {
  background: color-mix(in srgb, var(--k-primary, #6366f1) 15%, transparent);
  color:      var(--k-primary, #6366f1);
  border:     1px solid color-mix(in srgb, var(--k-primary, #6366f1) 30%, transparent);
  font-size:  .7rem;
  font-weight: 600;
  padding:    2px 8px;
  border-radius: 10px;
}

/* ── Righe portate incluse nel menù ───────────────────────── */
.k-riga-menu-portata {
  background: color-mix(in srgb, var(--k-primary, #6366f1) 3%, transparent);
}
.k-riga-menu-portata td {
  padding-top:    5px;
  padding-bottom: 5px;
  font-size:      .85rem;
  color:          var(--k-text-muted, #6b7280);
}

/* Label portata inclusa: check + nome + badge "incluso" */
.k-menu-portata-label {
  display:     flex;
  align-items: center;
  gap:         7px;
  padding-left: 12px;    /* rientro visivo sotto l'header */
}
.k-menu-check {
  color:      #10b981;   /* verde check */
  font-size:  .9rem;
  flex-shrink: 0;
}

/* Badge "incluso" */
.k-badge-incluso {
  font-size:   .68rem;
  font-weight: 600;
  color:       #10b981;
  background:  #f0fdf4;
  border:      1px solid #bbf7d0;
  border-radius: 10px;
  padding:     1px 7px;
}

/* ── Separator tra blocchi menù e portate singole ─────────── */
.k-riga-separator td {
  background:  var(--k-bg-subtle, #f9fafb);
  font-size:   .75rem;
  font-weight: 600;
  color:       var(--k-text-muted, #6b7280);
  text-transform: uppercase;
  letter-spacing: .05em;
  padding:     6px 16px;
  border-top:  1px dashed var(--k-border, #e5e7eb);
}

/* ============================================================
   SEZIONE QR PRINT — qrprint.php
   Aggiungere in fondo a backend.css
   ============================================================ */

/* ── Body pagina stampa ──────────────────────────────────────── */
.k-print-body {
  font-family: var(--k-font);
  background:  var(--k-bg);
  color:       var(--k-text);
  margin:      0;
  padding:     0;
}

/* ── Toolbar (nascosta in stampa) ────────────────────────────── */
.k-print-toolbar {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  gap:             12px;
  flex-wrap:       wrap;
  padding:         14px 24px;
  background:      var(--k-bg-card);
  border-bottom:   1px solid var(--k-border);
  position:        sticky;
  top:             0;
  z-index:         100;
  box-shadow:      var(--k-shadow);
}
.k-print-toolbar-left {
  display:     flex;
  align-items: center;
  gap:         14px;
  flex-wrap:   wrap;
}
.k-print-toolbar-right {
  display:     flex;
  align-items: center;
  gap:         10px;
  flex-wrap:   wrap;
}
.k-print-toolbar-title {
  font-size:   1.1rem;
  font-weight: 600;
  color:       var(--k-text);
  display:     flex;
  align-items: center;
  gap:         8px;
}
.k-print-toolbar-title i {
  color: var(--k-brand);
}

/* ── Tab tipo ────────────────────────────────────────────────── */
.k-print-type-tabs {
  display:       flex;
  gap:           4px;
  background:    var(--k-bg);
  border:        1px solid var(--k-border);
  border-radius: var(--k-radius);
  padding:       3px;
}
.k-print-tab {
  padding:       5px 14px;
  border-radius: calc(var(--k-radius) - 2px);
  font-size:     .82rem;
  font-weight:   500;
  color:         var(--k-text-muted);
  text-decoration: none;
  transition:    background .15s, color .15s;
}
.k-print-tab:hover {
  background: var(--k-brand-light);
  color:      var(--k-brand-dark);
  text-decoration: none;
}
.k-print-tab--active {
  background: var(--k-brand);
  color:      #fff !important;
}

/* ── Btn warning ─────────────────────────────────────────────── */
.k-btn-sm--warning {
  background: var(--k-warning-bg);
  color:      var(--k-warning);
  border:     1px solid var(--k-warning-bd);
}
.k-btn-sm--warning:hover {
  background: #fde68a;
  color:      var(--k-warning);
  text-decoration: none;
}

/* ── Header di stampa ────────────────────────────────────────── */
.k-print-header {
  padding:       20px 24px 10px;
  border-bottom: 2px solid var(--k-border-strong);
  margin-bottom: 8px;
}
.k-print-header-name {
  font-size:   1.5rem;
  font-weight: 700;
  color:       var(--k-text);
}
.k-print-header-meta {
  font-size:  .82rem;
  color:      var(--k-text-muted);
  margin-top: 2px;
}

/* ── Section title (tavoli / menù) ───────────────────────────── */
.k-print-section-title {
  font-size:    1rem;
  font-weight:  600;
  color:        var(--k-text-muted);
  padding:      16px 24px 8px;
  display:      flex;
  align-items:  center;
  gap:          8px;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size:    .78rem;
}

/* ── Griglia QR ──────────────────────────────────────────────── */
.k-qr-grid {
  display:               grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap:                   16px;
  padding:               12px 24px 24px;
}

/* ── Card QR ─────────────────────────────────────────────────── */
.k-qr-card {
  background:    var(--k-bg-card);
  border:        1px solid var(--k-border);
  border-radius: var(--k-radius-lg);
  overflow:      hidden;
  display:       flex;
  flex-direction: column;
  align-items:   center;
  text-align:    center;
  transition:    box-shadow .15s;
}
.k-qr-card:hover {
  box-shadow: var(--k-shadow-md);
}
.k-qr-card--missing {
  border-color:  var(--k-border);
  opacity:       .55;
}
.k-qr-card--inactive {
  opacity: .7;
}
.k-qr-card-img {
  padding:    16px 16px 8px;
  display:    flex;
  align-items: center;
  justify-content: center;
  width:      100%;
}
.k-qr-card-img img {
  display:    block;
  width:      180px;
  height:     180px;
  object-fit: contain;
  border:     1px solid var(--k-border);
  border-radius: 6px;
}
.k-qr-card-placeholder {
  width:          180px;
  height:         180px;
  border:         1px dashed var(--k-border-strong);
  border-radius:  6px;
  display:        flex;
  flex-direction: column;
  align-items:    center;
  justify-content: center;
  gap:            8px;
  color:          var(--k-text-light);
  font-size:      .78rem;
}
.k-qr-card-placeholder i {
  font-size: 2rem;
}
.k-qr-card-body {
  padding:    6px 12px 14px;
  width:      100%;
}
.k-qr-card-type {
  font-size:      .68rem;
  font-weight:    600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color:          var(--k-text-light);
  margin-bottom:  2px;
}
.k-qr-card-num {
  font-size:   2rem;
  font-weight: 700;
  line-height: 1.1;
  color:       var(--k-text);
}
.k-qr-card-name {
  font-size:   .95rem;
  font-weight: 600;
  color:       var(--k-text);
  line-height: 1.3;
}
.k-qr-card-label {
  font-size:  .8rem;
  color:      var(--k-text-muted);
  margin-top: 1px;
}
.k-qr-card-inactive {
  font-size:     .7rem;
  font-weight:   600;
  color:         var(--k-text-light);
  background:    var(--k-bg);
  border-radius: 10px;
  padding:       1px 8px;
  display:       inline-block;
  margin-top:    3px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.k-qr-card-url {
  font-size:     .62rem;
  color:         var(--k-text-light);
  margin-top:    6px;
  word-break:    break-all;
  font-family:   var(--k-font-mono);
  line-height:   1.3;
  padding:       0 4px;
}

/* ── Page break ──────────────────────────────────────────────── */
.k-print-page-break {
  height: 8px;
}

/* ── Empty state ─────────────────────────────────────────────── */
.k-print-empty {
  display:        flex;
  flex-direction: column;
  align-items:    center;
  justify-content: center;
  gap:            16px;
  padding:        60px 24px;
  text-align:     center;
  color:          var(--k-text-muted);
}
.k-print-empty i {
  font-size: 3rem;
  color: var(--k-text-light);
}
.k-print-empty p {
  font-size: 1rem;
  margin:    0;
}
.k-print-empty .k-btn-sm {
  margin-top: 4px;
}

/* ── Alert solo schermo ──────────────────────────────────────── */
.k-print-screen-only {
  margin: 12px 24px 0;
}

/* ── Avviso libreria non disponibile ─────────────────────────── */
.k-hint-warning {
  color:      var(--k-warning);
  font-size:  .8rem;
  margin-top: 8px;
  display:    block;
}
.k-hint-warning code {
  background:    var(--k-bg);
  padding:       1px 5px;
  border-radius: 4px;
  font-family:   var(--k-font-mono);
  font-size:     .85em;
}

/* ── k-media-row (Foto / Copertina / QR — stessa riga sotto il form grid) ─── */
.k-media-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
  align-items: start;
  padding-bottom: 24px;
}

/* ── mt-2 utility (per "Stampa QR tavoli" in sedi.php) ───────── */
.mt-2 { margin-top: .5rem; }

/* =============================================================
   @media print — regole di stampa
   ============================================================= */
@media print {

  /* Forza colori piatti, elimina ombre e sfondi */
  * {
    -webkit-print-color-adjust: exact;
    print-color-adjust:         exact;
  }

  /* Reset body */
  body {
    background: #fff;
    color:      #000;
    font-size:  10pt;
  }

  /* Nascondi toolbar e controlli */
  .k-print-toolbar,
  .k-print-screen-only,
  .k-print-hide-btn,
  .k-print-section-title i,
  .k-debug-bar {
    display: none !important;
  }

  /* Intestazione stampa */
  .k-print-header {
    padding:       0 0 8pt;
    margin-bottom: 10pt;
    border-bottom: 1.5pt solid #000;
  }
  .k-print-header-name {
    font-size:   16pt;
    font-weight: 700;
  }
  .k-print-header-meta {
    font-size: 8pt;
    color:     #555;
  }

  /* Section title */
  .k-print-section-title {
    font-size:   8pt;
    padding:     8pt 0 4pt;
    color:       #555;
    border-bottom: .5pt solid #ccc;
    margin-bottom: 6pt;
  }

  /* Griglia: 4 colonne su A4 orizzontale, 3 su verticale */
  .k-qr-grid {
    display:               grid;
    grid-template-columns: repeat(4, 1fr);
    gap:                   8pt;
    padding:               0;
  }

  /* Card */
  .k-qr-card {
    border:        1pt solid #ccc;
    border-radius: 6pt;
    break-inside:  avoid;
    page-break-inside: avoid;
    background:    #fff;
    box-shadow:    none;
    opacity:       1 !important;
  }
  .k-qr-card-img {
    padding: 8pt 8pt 4pt;
  }
  .k-qr-card-img img {
    width:  130pt;
    height: 130pt;
    border: .5pt solid #ddd;
  }
  .k-qr-card-placeholder {
    width:  130pt;
    height: 130pt;
    border: 1pt dashed #bbb;
    color:  #999;
  }
  .k-qr-card-body {
    padding: 2pt 6pt 8pt;
  }
  .k-qr-card-type {
    font-size: 6pt;
    color:     #888;
  }
  .k-qr-card-num {
    font-size:   18pt;
    font-weight: 700;
    color:       #000;
  }
  .k-qr-card-name {
    font-size:   9pt;
    font-weight: 600;
    color:       #000;
  }
  .k-qr-card-label {
    font-size: 7pt;
    color:     #555;
  }
  .k-qr-card-inactive {
    font-size: 6pt;
    color:     #999;
    background: #f5f5f5;
  }
  .k-qr-card-url {
    font-size: 5.5pt;
    color:     #888;
    margin-top: 4pt;
  }

  /* Page break tra sezioni */
  .k-print-page-break {
    page-break-after: always;
    break-after:      page;
    height:           0;
  }

  /* A4 portrait: 3 colonne */
  @page {
    size:   A4 portrait;
    margin: 12mm 10mm;
  }
}

/* A4 landscape: più colonne */
@media print and (orientation: landscape) {
  .k-qr-grid {
    grid-template-columns: repeat(5, 1fr);
  }
}

/* ============================================================
   CAMERIERI & PRENOTAZIONI — classi aggiuntive
   ============================================================ */

/* ── Utility ──────────────────────────────────────────────── */
.k-badge--xs       { font-size:10px;padding:2px 6px;line-height:1.4 }
.k-card-title-sub  { font-size:12px;font-weight:400;color:var(--k-text-muted);margin-left:6px }
.k-badge-toggle    { cursor:pointer;user-select:none;border:none }
.k-badge-toggle:hover { filter:brightness(.92) }
.k-input--ok { border-color:var(--k-success) !important; box-shadow:0 0 0 2px var(--k-success-bg) }
.k-text-success    { color:var(--k-success) }
.k-text-danger     { color:var(--k-danger) }
.k-input--date     { max-width:160px }

/* ── Bottoni ghost e varianti ──────────────────────────────── */
.k-btn-ghost {
  display:inline-flex;align-items:center;gap:6px;
  padding:9px 18px;border-radius:6px;font-size:14px;font-weight:500;
  border:1px solid var(--k-border-strong);background:transparent;
  color:var(--k-text-muted);cursor:pointer;text-decoration:none;
}
.k-btn-ghost:hover { background:var(--k-surface-2);color:var(--k-text);text-decoration:none }
.k-btn-sm--ghost {
  border:1px solid var(--k-border-strong);background:transparent;
  color:var(--k-text-muted);
}
.k-btn-sm--ghost:hover { background:var(--k-surface-2);color:var(--k-text) }

/* ── Select inline (filtri) ────────────────────────────────── */
.k-select--inline  { width:auto;min-width:160px;max-width:240px;padding:7px 12px }

/* ── Form actions (fondo form) ─────────────────────────────── */
.k-form-actions {
  display:flex;align-items:center;gap:12px;
  margin-top:24px;padding-top:20px;
  border-top:1px solid var(--k-border);
}

/* ── Card danger zone ──────────────────────────────────────── */
.k-card--danger-zone { border-color:var(--k-danger-bg) }
.k-card--danger-zone .k-card-head { background:var(--k-danger-bg) }

/* ── Turno: lista tavoli assegnati ─────────────────────────── */
.k-turno-tavolo {
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:6px;margin-bottom:6px;
  background:var(--k-surface-2);border:1px solid var(--k-border);
}
.k-turno-tavolo-num  { font-weight:700;min-width:56px;color:var(--k-text) }
.k-turno-tavolo-nome { flex:1;font-size:13px }
.k-turno-add {
  display:flex;align-items:center;gap:8px;
  margin-top:14px;padding-top:14px;
  border-top:1px solid var(--k-border);
}
.k-turno-add .k-select--inline { flex:1 }

/* ── Prenotazioni: tab stati ───────────────────────────────── */
.k-pren-tabs {
  display:flex;gap:4px;flex-wrap:wrap;
  margin-bottom:16px;
  border-bottom:2px solid var(--k-border);
  padding-bottom:0;
}
.k-pren-tab {
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 14px;font-size:13px;font-weight:500;
  color:var(--k-text-muted);text-decoration:none;
  border-radius:6px 6px 0 0;border:1px solid transparent;
  border-bottom:none;margin-bottom:-2px;
  transition:color .15s,background .15s;
}
.k-pren-tab:hover      { color:var(--k-text);background:var(--k-surface-2) }
.k-pren-tab--active    {
  color:var(--k-brand);background:var(--k-surface);
  border-color:var(--k-border);border-bottom-color:var(--k-surface);
}

/* ── Prenotazioni: layout dettaglio (2 colonne) ────────────── */
.k-pren-detail-grid {
  display:grid;
  grid-template-columns:1fr 340px;
  gap:20px;
  align-items:start;
}
@media (max-width:860px) {
  .k-pren-detail-grid { grid-template-columns:1fr }
}

/* ── Link ──────────────────────────────────────────────────── */
.k-link { color:var(--k-brand);text-decoration:none }
.k-link:hover { text-decoration:underline }

/* ── Utility spacing ─────────────────────────────────────────── */
.k-field--mt { margin-top: 16px }

/* ── Impostazioni prenotazione in sedi.php ───────────────────── */
.k-pren-settings {
  display: flex;
  gap: 24px;
  margin-top: 16px;
  flex-wrap: wrap;
}
.k-pren-settings .k-field { flex: 1; min-width: 140px; max-width: 200px }
.k-input--narrow           { max-width: 100px }

/* ── backend.js CSP-safe utilities ──────────────────────────── */
.k-no-scroll { overflow: hidden }

/* Auto-dismiss alert fade */
.k-alert--fading {
  transition: opacity .4s;
  opacity: 0;
}

/* data-width progress bar (usa CSS custom property) */
[data-width] { width: var(--k-bar-width, 0%) }

/* data-color (usa CSS custom property) */
[data-color] { color: var(--k-item-color, inherit) }

/* ── Password reset (password-reset.php) ─────────────────────── */

/* Indicatore fasi */
.k-reset-steps {
  display:         flex;
  align-items:     center;
  justify-content: center;
  gap:             0;
  margin-bottom:   20px;
}
.k-reset-step {
  display:        flex;
  flex-direction: column;
  align-items:    center;
  gap:            4px;
  opacity:        .45;
}
.k-reset-step--active,
.k-reset-step--done  { opacity: 1 }

.k-reset-step-num {
  width:           28px;
  height:          28px;
  border-radius:   50%;
  border:          2px solid var(--k-border-strong);
  display:         flex;
  align-items:     center;
  justify-content: center;
  font-size:       12px;
  font-weight:     700;
  color:           var(--k-text-muted);
  background:      var(--k-bg-card);
  transition:      border-color .2s, color .2s, background .2s;
}
.k-reset-step--active .k-reset-step-num {
  border-color: var(--k-brand);
  color:        var(--k-brand);
}
.k-reset-step--done .k-reset-step-num {
  border-color: var(--k-success);
  background:   var(--k-success);
  color:        #fff;
}
.k-reset-step-label {
  font-size:   11px;
  color:       var(--k-text-light);
  white-space: nowrap;
}
.k-reset-step--active .k-reset-step-label { color: var(--k-brand); font-weight: 600 }
.k-reset-step--done   .k-reset-step-label { color: var(--k-success) }

.k-reset-step-line {
  flex:         1;
  height:       2px;
  background:   var(--k-border);
  margin:       0 8px;
  margin-bottom: 18px; /* allinea con i numeri */
  min-width:    32px;
}

/* Strength bar — usa CSS custom property per width (CSP compliant) */
.k-pwd-bar { width: var(--k-pwd-w, 0%) }

/* Checklist requisiti password */
.k-pwd-requirements {
  list-style:    none;
  padding:       0;
  margin:        10px 0 0;
  display:       none;
  flex-direction: column;
  gap:           3px;
}
.k-pwd-requirements--visible { display: flex }
#password:focus ~ .k-pwd-requirements { display: flex }

.k-pwd-req {
  font-size:   .76rem;
  color:       var(--k-text-light);
  display:     flex;
  align-items: center;
  gap:         5px;
  transition:  color .2s;
}
.k-pwd-req[data-ok="1"]   { color: var(--k-success) }
.k-pwd-req[data-ok="0"] i { color: var(--k-danger)  }
.k-pwd-req[data-ok="1"] i { color: var(--k-success) }

/* Match hint — colore via data-state (zero inline style) */
.k-pwd-match-hint { display: block; margin-top: 4px; font-size: .78rem; font-weight: 600 }
.k-pwd-match-hint[data-state="ok"]  { color: var(--k-success) }
.k-pwd-match-hint[data-state="err"] { color: var(--k-danger)  }

/* ══════════════════════════════════════════════════════════════
   Theme toggle button — topbar
   ══════════════════════════════════════════════════════════════ */
.k-theme-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius);
  background: var(--k-bg-card);
  color: var(--k-text-muted);
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
  position: relative;
  flex-shrink: 0;
}
.k-theme-btn:hover {
  background: var(--k-brand-light);
  color: var(--k-brand);
  border-color: var(--k-brand);
}
/* Icone interne al pulsante (auto / light / dark) */
.k-theme-btn .k-ti { display: none; font-size: 16px; }
.k-theme-btn[data-mode="auto"]  .k-ti-auto  { display: block; }
.k-theme-btn[data-mode="light"] .k-ti-light { display: block; }
.k-theme-btn[data-mode="dark"]  .k-ti-dark  { display: block; }
/* Tooltip nativo via title — nessun JS extra necessario */

/* ── Theme button flottante (login / password-reset — no topbar) */
.k-theme-btn-float {
  position:   fixed;
  top:        16px;
  right:      16px;
  z-index:    9999;
  display:    inline-flex;
  align-items: center;
  justify-content: center;
  width:      40px;
  height:     40px;
  border:     1px solid var(--k-border);
  border-radius: 50%;
  background: var(--k-bg-card);
  color:      var(--k-text-muted);
  cursor:     pointer;
  box-shadow: var(--k-shadow-md);
  transition: background .15s, color .15s, border-color .15s, box-shadow .15s;
}
.k-theme-btn-float:hover {
  background:   var(--k-brand-light);
  color:        var(--k-brand);
  border-color: var(--k-brand);
  box-shadow:   var(--k-shadow-md);
}
.k-theme-btn-float .k-ti { display: none; font-size: 17px; }
.k-theme-btn-float[data-mode="auto"]  .k-ti-auto  { display: block; }
.k-theme-btn-float[data-mode="light"] .k-ti-light { display: block; }
.k-theme-btn-float[data-mode="dark"]  .k-ti-dark  { display: block; }

/* ── Piano: badge sconto annuale (card admin + proprietario) ─────────────── */
.k-piano-sconto-badge {
  display:         inline-flex;
  align-items:     center;
  gap:             4px;
  margin-top:      6px;
  padding:         3px 10px;
  border-radius:   20px;
  font-size:       .73rem;
  font-weight:     600;
  background:      rgba(255,255,255,.18);
  color:           #fff;
  letter-spacing:  .01em;
}
.k-piano-sconto-badge i { font-size: .7rem; }

/* Hint preview sconto nel modal */
#pianoScontoPreview {
  display:     block;
  margin-top:  4px;
  font-size:   .78rem;
  font-weight: 600;
  color:       var(--k-primary);
}

/* ═══════════════════════════════════════════════════════════════
   Note legali — backend.css
   Classi per: sedi.php (toggle per-sede) + note_legali.php (catalog)
   ═══════════════════════════════════════════════════════════════ */

/* ── Toggle list in sedi.php edit (card Diciture legali) ────── */
.k-nota-toggle-list {
  list-style:    none;
  padding:       0;
  margin:        0;
  display:       flex;
  flex-direction: column;
  gap:           2px;
}
.k-nota-toggle-item {
  border-bottom: 1px solid var(--k-border);
  padding:       10px 0;
}
.k-nota-toggle-item:last-child { border-bottom: none; padding-bottom: 0 }
.k-nota-toggle-item:first-child { padding-top: 0 }

.k-switch-label--nota {
  align-items: flex-start;
  gap:         12px;
}
.k-nota-toggle-info {
  display:        flex;
  flex-direction: column;
  gap:            3px;
  flex:           1;
  min-width:      0;
}
.k-nota-toggle-title {
  font-size:   .875rem;
  font-weight: 600;
  color:       var(--k-text);
}
.k-nota-toggle-preview {
  font-size:  .78rem;
  color:      var(--k-text-muted);
  line-height: 1.4;
  overflow:    hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* ── Catalogo note_legali.php ────────────────────────────────── */
.k-nota-row          { transition: background var(--k-transition) }
.k-nota-row.k-dragging { opacity: .5; background: var(--k-surface-alt) }
.k-row-muted         { opacity: .55 }
.k-nota-titolo       { font-weight: 600 }
.k-nota-testo-preview {
  color:     var(--k-text-muted);
  font-size: .85rem;
  max-width: 400px;
}
.k-code {
  font-family:      var(--k-font-mono, monospace);
  font-size:        .82rem;
  background:       var(--k-surface-alt);
  border:           1px solid var(--k-border);
  border-radius:    4px;
  padding:          2px 6px;
  color:            var(--k-text);
}

/* Drag handle */
.k-col-drag {
  width:   36px;
  padding: 0 8px;
}
.k-drag-handle {
  cursor: grab;
  color:  var(--k-text-muted);
  opacity: .45;
  transition: opacity var(--k-transition);
}
.k-drag-handle:hover { opacity: 1 }

/* Card hint (piccolo testo a destra nell'header card) */
.k-card-hint {
  font-size:  .78rem;
  color:      var(--k-text-muted);
  margin-left: auto;
}

/* Textarea note */
.k-textarea {
  width:         100%;
  padding:       8px 12px;
  border:        1px solid var(--k-border);
  border-radius: var(--k-radius-sm);
  background:    var(--k-surface);
  color:         var(--k-text);
  font-family:   inherit;
  font-size:     .9rem;
  line-height:   1.5;
  resize:        vertical;
  transition:    border-color var(--k-transition);
}
.k-textarea:focus {
  outline:       none;
  border-color:  var(--k-primary);
  box-shadow:    0 0 0 3px color-mix(in srgb, var(--k-primary) 15%, transparent);
}

/* Char counter */
.k-nota-char-count {
  display:   block;
  text-align: right;
}

/* Input readonly (codice in edit) */
.k-input--readonly {
  background: var(--k-surface-alt);
  cursor:     not-allowed;
  color:      var(--k-text-muted);
}

/* Margin helpers usati nella card */
.k-mt-sm { margin-top:  8px }

/* Ordini — annulla comanda */
.k-card--border-danger { border-color: var(--k-danger) }
.k-field-hint--ml      { margin-left: 8px }

/* ── Guida & FAQ (help.php) ────────────────────────────────── */

/* Cameriere standalone */
.k-help-standalone { min-height: 100vh }
.k-help-cam-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--k-bg-sidebar); color: #fff;
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 20px; gap: 12px; font-weight: 600;
}
.k-help-cam-header i { margin-right: 6px }

/* Ricerca */
.k-help-search-wrap  { margin-bottom: 24px }
.k-help-search-inner { position: relative; max-width: 600px }
.k-help-search-icon  {
  position: absolute; left: 14px; top: 50%;
  transform: translateY(-50%);
  color: var(--k-text-muted); font-size: 16px; pointer-events: none;
}
.k-help-search-input {
  width: 100%; padding: 12px 40px 12px 42px;
  border: 1px solid var(--k-border-strong); border-radius: 10px;
  font-size: 15px; color: var(--k-text); background: var(--k-bg-card);
  box-sizing: border-box; transition: border-color .15s, box-shadow .15s;
}
.k-help-search-input:focus {
  outline: none; border-color: var(--k-brand);
  box-shadow: 0 0 0 3px rgba(45,138,0,.15);
}
.k-help-search-clear {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  background: none; border: none; color: var(--k-text-muted);
  cursor: pointer; font-size: 16px; padding: 4px;
}

/* Nav pills */
.k-help-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px }
.k-help-nav-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 14px; border-radius: 20px;
  background: var(--k-bg-card); border: 1px solid var(--k-border);
  font-size: 13px; color: var(--k-text-muted); text-decoration: none;
  transition: all .15s;
}
.k-help-nav-pill:hover {
  background: var(--k-brand-light); border-color: var(--k-brand);
  color: var(--k-brand); text-decoration: none;
}

/* Sezione */
.k-help-section { margin-bottom: 28px }
.k-help-section--hidden { display: none }
.k-help-section-head {
  display: flex; align-items: center; gap: 10px;
  padding: 14px 18px; border-radius: 10px 10px 0 0;
  border: 1px solid var(--k-border); border-bottom: none; font-weight: 700;
}
.k-help-section-head i  { font-size: 18px }
.k-help-section-head h2 { margin: 0; font-size: 16px; flex: 1 }
.k-help-section-count   { font-size: 12px; font-weight: 400; opacity: .7 }

.k-help-sec--blue   { background: var(--k-info-bg);    color: var(--k-info);    border-color: var(--k-info-bd) }
.k-help-sec--green  { background: var(--k-success-bg); color: var(--k-success); border-color: var(--k-success-bd) }
.k-help-sec--amber  { background: var(--k-warning-bg); color: var(--k-warning); border-color: var(--k-warning-bd) }
.k-help-sec--teal   { background: #ccfbf1; color: #0f766e; border-color: #99f6e4 }
.k-help-sec--purple { background: #f5f3ff; color: #7c3aed; border-color: #ddd6fe }
.k-help-sec--gray   { background: var(--k-bg); color: var(--k-text-muted); border-color: var(--k-border) }

/* Accordion */
.k-help-accordion { border: 1px solid var(--k-border); border-radius: 0 0 10px 10px; overflow: hidden }
.k-help-item      { border-bottom: 1px solid var(--k-border) }
.k-help-item:last-child { border-bottom: none }
.k-help-item--hidden { display: none }

.k-help-item-wrap {
  display: flex; align-items: stretch; background: var(--k-bg-card);
}
.k-help-q {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px; flex: 1; text-align: left;
  padding: 16px 18px; background: transparent; border: none;
  cursor: pointer; font-size: 14px; font-weight: 600;
  color: var(--k-text); line-height: 1.5; transition: background .12s;
}
.k-help-q:hover   { background: var(--k-bg) }
.k-help-q[aria-expanded="true"] { color: var(--k-brand) }
.k-help-q span    { flex: 1 }
.k-help-chevron   {
  flex-shrink: 0; margin-top: 3px; font-size: 13px;
  color: var(--k-text-muted); transition: transform .2s;
}
.k-help-q[aria-expanded="true"] .k-help-chevron { transform: rotate(180deg) }

.k-help-a       { overflow: hidden }
.k-help-a-inner {
  padding: 0 18px 16px 18px; font-size: 14px; line-height: 1.7;
  color: var(--k-text); background: var(--k-bg);
  border-top: 1px solid var(--k-border);
}
.k-help-a-inner p            { margin: 0 0 10px }
.k-help-a-inner p:last-child { margin-bottom: 0 }
.k-help-a-inner ul,
.k-help-a-inner ol           { margin: 0 0 10px; padding-left: 20px }
.k-help-a-inner li           { margin-bottom: 5px; line-height: 1.6 }
.k-help-a-inner code         {
  background: var(--k-bg-card); border: 1px solid var(--k-border);
  border-radius: 4px; padding: 1px 6px; font-size: 12px;
  font-family: var(--k-font-mono, monospace);
}
.k-help-a-inner strong { color: var(--k-text) }

/* No results */
.k-help-no-results   { text-align: center; padding: 48px 20px; color: var(--k-text-muted) }
.k-help-no-results i { font-size: 40px; display: block; margin-bottom: 12px; opacity: .4 }
.k-help-no-results p { margin: 0 0 16px; font-size: 15px }

/* Footer */
.k-help-footer {
  text-align: center; padding: 24px; font-size: 14px;
  color: var(--k-text-muted); border-top: 1px solid var(--k-border); margin-top: 12px;
}
.k-help-footer a { color: var(--k-brand) }

/* CRUD superadmin */
.k-btn-sm--outline       { background: transparent; border: 1px solid var(--k-brand); color: var(--k-brand) }
.k-btn-sm--outline:hover { background: var(--k-brand-light) }
.k-btn-sm--ghost         { background: transparent; border: 1px solid var(--k-border-strong); color: var(--k-text-muted) }
.k-btn-sm--ghost:hover   { background: var(--k-bg) }

.k-help-edit-actions,
.k-help-item-actions {
  display: inline-flex; align-items: center; gap: 4px; padding: 0 10px;
}
.k-help-btn-sez,
.k-help-btn-item {
  background: none; border: none; cursor: pointer; border-radius: 6px;
  padding: 5px 7px; font-size: 13px; transition: background .12s, color .12s;
}
.k-help-btn-sez--edit, .k-help-btn-item--edit { color: var(--k-info) }
.k-help-btn-sez--edit:hover, .k-help-btn-item--edit:hover { background: var(--k-info-bg) }
.k-help-btn-sez--del,  .k-help-btn-item--del  { color: var(--k-danger) }
.k-help-btn-sez--del:hover,  .k-help-btn-item--del:hover  { background: var(--k-danger-bg, #fee2e2) }

.k-help-add-item { border-top: 1px dashed var(--k-border); background: var(--k-bg) }
.k-help-btn-additem {
  width: 100%; padding: 11px 18px; background: none; border: none;
  cursor: pointer; font-size: 13px; color: var(--k-text-muted);
  text-align: left; display: flex; align-items: center; gap: 7px;
  transition: color .12s, background .12s;
}
.k-help-btn-additem:hover { color: var(--k-brand); background: var(--k-brand-light) }

.k-help-add-section {
  margin-top: 12px; padding: 20px; text-align: center;
  border: 2px dashed var(--k-border); border-radius: 10px;
}

/* Modal */
.k-modal-overlay {
  position: fixed; inset: 0; z-index: 9000;
  background: rgba(0,0,0,.45); display: flex;
  align-items: center; justify-content: center; padding: 16px;
}
.k-modal-box {
  background: var(--k-bg-card); border-radius: 12px;
  width: 100%; box-shadow: 0 20px 60px rgba(0,0,0,.25);
  max-height: 90vh; display: flex; flex-direction: column;
}
.k-modal-box--sm { max-width: 540px }
.k-modal-box--md { max-width: 680px }
.k-modal-header  {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px; border-bottom: 1px solid var(--k-border);
}
.k-modal-header h3 { margin: 0; font-size: 16px; display: flex; align-items: center; gap: 8px }
.k-modal-close     {
  background: none; border: none; cursor: pointer;
  font-size: 18px; color: var(--k-text-muted); padding: 4px;
  border-radius: 6px; line-height: 1;
}
.k-modal-close:hover { background: var(--k-bg); color: var(--k-text) }
.k-modal-body  { padding: 20px; overflow-y: auto }
.k-modal-footer {
  padding: 14px 20px; border-top: 1px solid var(--k-border);
  display: flex; justify-content: flex-end; gap: 10px;
}

/* Form elementi modal */
.k-form-row         { margin-bottom: 16px }
.k-form-row--2col   { display: grid; grid-template-columns: 1fr 1fr; gap: 16px }
.k-form-row-bottom  { display: flex; align-items: flex-end; padding-bottom: 4px }
.k-label            { display: block; font-size: 13px; font-weight: 600; margin-bottom: 5px }
.k-input            {
  width: 100%; padding: 9px 12px; border: 1px solid var(--k-border-strong);
  border-radius: 8px; font-size: 14px; color: var(--k-text);
  background: var(--k-bg); box-sizing: border-box;
}
.k-input:focus      { outline: none; border-color: var(--k-brand); box-shadow: 0 0 0 3px rgba(45,138,0,.12) }
.k-textarea-lg      { resize: vertical; font-family: var(--k-font-mono, monospace); font-size: 13px }
.k-check-label      { display: flex; align-items: center; gap: 8px; font-size: 14px; cursor: pointer }
.k-help-hint        { font-size: 12px; color: var(--k-text-muted); margin: 4px 0 0 }
.k-help-hint-inline { font-weight: 400; color: var(--k-text-muted) }
.k-page-header-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap }

@media (max-width: 600px) {
  .k-help-q            { padding: 13px 14px; font-size: 13px }
  .k-help-a-inner      { padding: 0 14px 14px }
  .k-help-section-head { padding: 12px 14px }
  .k-form-row--2col    { grid-template-columns: 1fr }
}

/* ── Dashboard wrap + banner sidebar ────────────────────── */
.k-dashboard-wrap{display:flex;flex:1;min-height:0;overflow:hidden}
.k-dashboard-wrap>.k-content{flex:1;min-width:0;overflow-y:auto}
.k-banner-col{flex:0 0 22%;min-width:180px;max-width:280px;
  padding:24px 16px 24px 0;overflow-y:auto;display:none}
@media(min-width:1100px){.k-banner-col{display:block}}

/* Banner cards */
.k-banner-link{display:block;text-decoration:none;margin-bottom:16px}
.k-banner-link:last-child{margin-bottom:0}
.k-banner-card{margin-bottom:0;height:auto}
.k-banner-img{position:relative;aspect-ratio:16/9;width:100%;
  background:var(--k-bg);overflow:hidden;
  display:flex;align-items:center;justify-content:center}
.k-banner-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.k-banner-placeholder-icon{font-size:36px;color:var(--k-text-light);position:relative;z-index:0}
.k-banner-img--placeholder .k-banner-photo{display:none}
.k-banner-link:hover .k-banner-card{box-shadow:var(--k-shadow-md)}