/* Tenuta Virgilio — reference-inspired responsive master UI.
   Visual layer only: data, formulas, filters and auth are untouched. */

:root{
  --tv-bg:#f6f0e5;
  --tv-paper:#fffdf8;
  --tv-paper-2:#fbf7ef;
  --tv-green:#315b3a;
  --tv-green-2:#456a4b;
  --tv-gold:#b58a43;
  --tv-gold-soft:#eadbbf;
  --tv-ink:#172033;
  --tv-muted:#6f7784;
  --tv-line:rgba(146,118,69,.18);
  --tv-shadow:0 12px 32px rgba(75,62,36,.06);
}

body{
  background:linear-gradient(180deg,#f8f3ea 0%,#f3eadc 100%)!important;
  color:var(--tv-ink)!important;
}

.panel,.chart-panel,.table-wrap,.section-focus-overview,
#guestGeographyPanel,#bookingLeadPanel,.all-costs-panel,.analysis-tech-details{
  background:rgba(255,253,248,.94)!important;
  border:1px solid var(--tv-line)!important;
  box-shadow:var(--tv-shadow)!important;
}

.eyebrow{
  color:#7a6541!important;
  letter-spacing:.14em!important;
}

/* ========================= DESKTOP ========================= */
@media (min-width:1100px){
  html,body{height:100%!important;min-height:100%!important}
  body{overflow:hidden!important;padding:0!important}

  .sidebar{
    display:flex!important;
    flex-direction:column!important;
    position:fixed!important;
    inset:14px auto 14px 14px!important;
    width:190px!important;
    height:calc(100vh - 28px)!important;
    padding:18px 14px!important;
    background:rgba(255,253,248,.96)!important;
    color:var(--tv-ink)!important;
    border:1px solid rgba(181,138,67,.18)!important;
    border-radius:18px!important;
    box-shadow:0 18px 42px rgba(62,51,30,.08)!important;
    overflow:hidden!important;
  }

  .sidebar::after{display:none!important}
  .brand{
    display:grid!important;
    justify-items:center!important;
    gap:10px!important;
    padding:4px 6px 18px!important;
    text-align:center!important;
    border-bottom:1px solid var(--tv-line)!important;
  }
  .brand-mark{
    width:92px!important;height:92px!important;
    border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important
  }
  .brand-mark img{object-fit:contain!important}
  .brand strong{
    max-width:145px!important;color:#283322!important;font-size:15px!important;line-height:1.3!important;
    letter-spacing:.08em!important;text-transform:uppercase!important;font-weight:600!important
  }

  .nav{display:grid!important;gap:8px!important;margin-top:18px!important}
  .nav a{
    display:flex!important;align-items:center!important;gap:10px!important;min-height:46px!important;
    padding:0 14px!important;color:#273140!important;background:transparent!important;
    border:0!important;border-radius:13px!important;text-decoration:none!important;box-shadow:none!important
  }
  .nav a span{display:none!important}
  .nav a:first-child,.nav a.active,.nav a:hover{
    color:#fffdf7!important;background:linear-gradient(135deg,var(--tv-green),#27492f)!important;
    transform:none!important;box-shadow:0 10px 22px rgba(49,91,58,.18)!important
  }

  .app-shell{
    display:block!important;
    width:calc(100vw - 224px)!important;
    max-width:none!important;
    height:100vh!important;
    min-height:100vh!important;
    margin:0 0 0 224px!important;
    padding:18px 22px 24px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }

  .topbar{
    display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:24px!important;
    min-height:106px!important;margin:0 0 14px!important;padding:14px 18px!important;
    background:rgba(255,253,248,.82)!important;border:1px solid var(--tv-line)!important;border-radius:16px!important;
    box-shadow:var(--tv-shadow)!important;overflow:visible!important
  }
  .topbar::after{display:none!important}
  .hero-copy{max-width:760px!important}
  .hero-copy .eyebrow{display:none!important}
  .topbar h1{margin:0 0 4px!important;font-size:38px!important;line-height:1!important;color:#162033!important}
  #sourceMeta{font-size:13px!important}
  .quick-filters{
    display:inline-grid!important;grid-template-columns:repeat(2,minmax(130px,1fr))!important;gap:8px!important;
    margin-top:10px!important;padding:8px!important;background:#fbf6ec!important;border:1px solid var(--tv-line)!important;
    border-radius:12px!important;box-shadow:none!important
  }
  .quick-filters span{color:#7d6740!important}
  .quick-filters select{background:#fffdf8!important;border-color:var(--tv-line)!important}
  .toolbar{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;min-width:260px!important}
  .auth-status{justify-content:flex-end!important}
  #toggleFilters,.auth-login button,.auth-logout{
    background:var(--tv-green)!important;color:#fff!important;border-color:var(--tv-green)!important;border-radius:10px!important
  }
  .mobile-menu-button{display:none!important}

  .filter-bar{grid-template-columns:repeat(4,minmax(150px,1fr))!important;gap:10px!important;padding:14px!important;border-radius:14px!important}

  .executive-strip,.section{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important}
  .section{padding-top:10px!important}
  .section-head{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:18px!important;margin-bottom:14px!important}
  .section-head h2{font-size:30px!important;color:#192337!important}

  .hero-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
  .hero-kpi{
    min-height:120px!important;padding:18px!important;border-radius:15px!important;background:#fffdf8!important;
    border:1px solid var(--tv-line)!important;box-shadow:var(--tv-shadow)!important
  }
  .hero-kpi strong{margin:12px 0 6px!important;font-size:32px!important;color:#172033!important}

  #executive #kpiGrid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
  #executive #kpiGrid .manager-insight-title{grid-column:1/-1!important;background:transparent!important;border:0!important;padding:0 0 8px!important}
  #executive #kpiGrid .manager-insight-title span{color:#172033!important;font-size:24px!important}
  #executive #kpiGrid .manager-insight-title small{color:var(--tv-muted)!important}
  #executive #kpiGrid .manager-insight{
    min-height:106px!important;background:#fffdf8!important;border:1px solid var(--tv-line)!important;border-radius:14px!important;padding:15px!important
  }
  #executive #kpiGrid .manager-insight span,#executive #kpiGrid .manager-insight small{color:var(--tv-muted)!important}
  #executive #kpiGrid .manager-insight strong{color:#172033!important;font-size:24px!important}

  .split{grid-template-columns:minmax(0,1.35fr) minmax(360px,.85fr)!important;gap:14px!important}
  #executive .split{grid-template-columns:minmax(0,1.35fr) minmax(340px,.75fr)!important}
  .panel,.chart-panel{padding:18px!important;border-radius:16px!important}
  .panel-head h2{font-size:24px!important}
  .chart{min-height:300px!important}
  .chart svg{height:300px!important}

  #guestGeographyPanel,#bookingLeadPanel{height:auto!important;min-height:0!important;border-radius:16px!important}
  #guestGeographyPanel .guest-geo-proposal-a{padding:20px!important}
  #guestGeographyPanel .guest-geo-country-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  .kpi-grid,.kpi-grid.compact{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
  .kpi{min-height:110px!important;padding:16px!important;border-radius:14px!important}
  .kpi strong{font-size:27px!important}

  #cost-control .kpi-grid.compact{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .pricing-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .pricing-strip{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .alerts-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .entry-layout{grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr)!important}
  .guided-form{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .pending-counts{grid-template-columns:repeat(5,minmax(0,1fr))!important}
  .lucia-table-grid{grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr)!important}
  .diagnostic-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .diagnostic-lists{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .table-wrap{max-width:100%!important;overflow:auto!important;border-radius:14px!important}

  .mobile-luxury-nav,.mobile-more-sheet{display:none!important}
}

/* ========================= TABLET ========================= */
@media (min-width:721px) and (max-width:1099px){
  .sidebar{display:none!important}
  .app-shell{margin:0!important;width:100%!important;padding:18px 18px 104px!important}
  .hero-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .kpi-grid,.kpi-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .split,#executive .split{grid-template-columns:1fr!important}
  .pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .alerts-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .guided-form{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .entry-layout,.lucia-table-grid,.diagnostic-lists{grid-template-columns:1fr!important}
}

/* ========================= MOBILE ========================= */
@media (max-width:720px){
  .sidebar{display:none!important}
  .app-shell{margin:0!important;width:100%!important;padding:14px 14px 108px!important}
  .topbar{border-radius:18px!important}
  .hero-kpi-grid,.kpi-grid,.kpi-grid.compact,.split,#executive .split,.pricing-grid,.pricing-strip,
  .alerts-grid,.entry-layout,.guided-form,.pending-counts,.lucia-table-grid,.diagnostic-grid,.diagnostic-lists{
    grid-template-columns:1fr!important
  }
  .panel,.chart-panel,.table-wrap,.section-focus-overview,#guestGeographyPanel,#bookingLeadPanel{border-radius:18px!important}
  .mobile-luxury-nav{
    background:linear-gradient(180deg,rgba(79,83,48,.97),rgba(45,51,31,.99))!important;
    border-top:1px solid rgba(212,177,104,.48)!important;
  }
}