/* Phase 2.5 UI — shared premium farm design system.
   This intentionally sits after legacy styles so later phases can reuse it
   without modifying the snapshot-backed screens. */
:root{
  --ssl-teal:#075e63;--ssl-aqua:#18a999;--ssl-gold:#d9a441;--ssl-red:#bc4c3b;
  --ssl-ink:#173b3f;--ssl-muted:#688184;--ssl-line:#dbe9e5;--ssl-surface:#fff;
  --ssl-wash:#f6faf8;--ssl-glass:rgba(255,255,255,.78);
  --navy:var(--ssl-teal);--ink:var(--ssl-ink);--muted:var(--ssl-muted);
  --line:var(--ssl-line);--surface:var(--ssl-surface);--wash:var(--ssl-wash);
  --mint:var(--ssl-aqua);--deep:var(--ssl-teal);--warning:var(--ssl-gold);--danger:var(--ssl-red);
}
html{background:var(--ssl-wash)}
body{min-width:320px;background:
  radial-gradient(circle at 100% 0,rgba(217,164,65,.10),transparent 25rem),
  radial-gradient(circle at 8% 24%,rgba(24,169,153,.08),transparent 29rem),var(--ssl-wash)!important;color:var(--ssl-ink)}
button,.outline,.primary,.card-link{transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(24,169,153,.32);outline-offset:2px}
.primary{background:linear-gradient(112deg,var(--ssl-teal),var(--ssl-aqua))!important;box-shadow:0 10px 22px rgba(7,94,99,.18)!important}
.primary:hover{transform:translateY(-1px);box-shadow:0 14px 27px rgba(7,94,99,.25)!important}
.outline{border-color:#bcded7!important;color:var(--ssl-teal)!important;background:rgba(255,255,255,.82)!important}
.outline:hover{background:#effaf7!important;border-color:var(--ssl-aqua)!important}
.panel,.pond-card,.stat-card,.module-card,.inventory-card,.farm-card,.warehouse-table-panel,.cost-visual-card,.cost-history-card,.cost-category-list{
  border-color:rgba(207,226,220,.86)!important;background:var(--ssl-glass)!important;
  box-shadow:0 12px 28px rgba(15,69,61,.06)!important;backdrop-filter:blur(14px) saturate(1.08)
}
.farm-hero{position:relative;isolation:isolate;overflow:hidden;background:
  linear-gradient(108deg,rgba(5,81,79,.97),rgba(7,124,111,.94) 56%,rgba(24,169,153,.86)),
  url('assets/marix-shrimp-pond-background.png') center/cover!important;border:1px solid rgba(255,255,255,.2);box-shadow:0 20px 40px rgba(4,91,82,.18)!important}
.farm-hero:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 82% 14%,rgba(255,244,205,.38),transparent 16rem)}
.farm-hero:after{content:"";position:absolute;right:-70px;bottom:-110px;width:285px;height:285px;z-index:-1;border:1px solid rgba(255,255,255,.24);border-radius:46% 54% 49% 51% / 44% 45% 55% 56%;transform:rotate(24deg);box-shadow:0 0 0 34px rgba(255,255,255,.05)}
.farm-hero h2{letter-spacing:-.04em}.farm-chip{background:rgba(255,255,255,.13)!important;border-color:rgba(255,255,255,.32)!important;backdrop-filter:blur(9px)}

/* Desktop glass island navigation. */
@media (min-width:701px){
  .shell{grid-template-columns:294px minmax(0,1fr);padding:16px;gap:16px;background:transparent!important}
  .sidebar{position:sticky;top:16px;align-self:start;height:calc(100vh - 32px);padding:18px 13px!important;border:1px solid rgba(193,222,214,.84)!important;border-radius:25px!important;background:linear-gradient(154deg,rgba(255,255,255,.90),rgba(239,249,245,.76))!important;box-shadow:0 18px 44px rgba(15,69,61,.10)!important;backdrop-filter:blur(22px) saturate(1.15)}
  .sidebar:before{content:"";position:absolute;right:-42px;bottom:28px;width:134px;height:134px;border-radius:50%;background:radial-gradient(circle,rgba(217,164,65,.19),transparent 68%);pointer-events:none}
  .sidebar .brand{position:relative;margin:0 7px 24px!important;color:var(--ssl-teal)!important;font-size:19px!important}
  .sidebar .brand-mark{border:1px solid #eed893!important;background:#fff url('shrimp-logo.png') center/117% no-repeat!important;box-shadow:0 7px 17px rgba(188,76,59,.15)!important}
  .nav-label{margin:18px 9px 7px!important;color:#89a09a!important}
  .nav-item{position:relative;min-height:43px;margin:3px 0!important;border:1px solid transparent!important;border-radius:13px!important;color:#385c5a!important}
  .nav-item:hover{background:rgba(239,250,246,.94)!important;border-color:#d5eae2!important;color:var(--ssl-teal)!important;transform:translateX(2px)}
  .nav-item.active{background:linear-gradient(105deg,#e5f7f1,#f9fffb)!important;border-color:#bde7d9!important;color:var(--ssl-teal)!important;box-shadow:inset 3px 0 0 var(--ssl-aqua)!important}
  .nav-item.active .nav-icon{color:var(--ssl-aqua)!important}.nav-icon{color:#6d8b85!important}
  .sidebar-bottom{position:absolute!important;bottom:15px!important;left:13px!important;width:calc(100% - 26px)!important;border-color:#dcece6!important}
  .farm-mini{border-radius:14px!important;background:rgba(240,250,246,.86)!important;color:var(--ssl-teal)!important}
  .content{max-width:none!important;padding:22px clamp(24px,3.2vw,54px) 38px!important}
}

/* Shared operational weather: live hourly strip plus forecast. */
.ssl-weather-panel{display:grid;grid-template-columns:minmax(180px,.9fr) minmax(0,1.5fr);gap:12px;margin:0 0 20px;padding:13px;border:1px solid rgba(196,223,216,.92);border-radius:20px;background:linear-gradient(120deg,rgba(7,94,99,.97),rgba(10,135,120,.90));color:#fff;box-shadow:0 16px 32px rgba(6,91,85,.16);overflow:hidden}
.ssl-weather-now{display:grid;align-content:center;gap:4px;min-height:108px;padding:15px 17px;border:1px solid rgba(255,255,255,.18);border-radius:15px;background:rgba(4,64,62,.36)}
.ssl-weather-now b{font:800 31px/1 'Plus Jakarta Sans',Kanit,sans-serif}.ssl-weather-now span{font-size:12px;font-weight:700}.ssl-weather-now small{color:#d7f1e9;font-size:10px}
.ssl-weather-body{display:grid;gap:9px}.ssl-weather-hours,.ssl-weather-days{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.ssl-weather-hour,.ssl-weather-day{display:grid;place-items:center;gap:2px;min-height:49px;padding:6px;border:1px solid rgba(255,255,255,.15);border-radius:12px;background:rgba(255,255,255,.11);text-align:center}
.ssl-weather-hour span,.ssl-weather-day span{font-size:10px;font-weight:800}.ssl-weather-hour b{font-size:18px;line-height:1}.ssl-weather-hour small,.ssl-weather-day small{color:#e2f8f0;font-size:10px;line-height:1.25}.ssl-weather-day{min-height:40px;grid-template-columns:auto 1fr;column-gap:5px;text-align:left}.ssl-weather-day b{font-size:15px}.ssl-weather-day small{white-space:nowrap}
.farm-weather-strip{display:block!important;min-height:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}.farm-weather-strip .ssl-weather-panel{margin:0}.farm-card .ssl-weather-panel{grid-template-columns:1fr;padding:9px;border-radius:14px}.farm-card .ssl-weather-now{display:none}.farm-card .ssl-weather-hours{grid-template-columns:repeat(3,1fr)}.farm-card .ssl-weather-days{display:none}.farm-card .ssl-weather-hour{min-height:53px;padding:4px}.farm-card .ssl-weather-hour b{font-size:16px}

/* Better hierarchy for status, tables and loading states. */
.eyebrow{color:var(--ssl-gold)!important;font-weight:800!important}.tag{background:#e7f7f1!important;color:var(--ssl-teal)!important}.status{background:#e9f8ef!important;color:#13764e!important}.hint,.reference{border:1px solid #e0eee8!important;background:rgba(246,251,248,.92)!important;color:#55726d!important}.table th{color:#647e7a!important;background:rgba(243,249,247,.78)}.table td{border-color:#e7f0ec!important}
.holy-day-indicator,#holyDayPlan{border-left-color:var(--ssl-gold)!important;background:linear-gradient(110deg,#fffaf0,#fff)!important}.holy-day-indicator .tag,#holyDayPlan .tag{background:#fff0cd!important;color:#95630f!important}
.shrimp-corner-mark{border:2px solid rgba(217,164,65,.7)!important;box-shadow:0 10px 25px rgba(188,76,59,.22)!important}

/* Mobile floating bottom island: white-first, safe-area aware and touch sized. */
@media (max-width:700px){
  body{padding-bottom:96px;background:linear-gradient(150deg,#fbfdfc,#f1faf6 70%,#fffaf0)!important}
  .shell{display:block!important}.content{padding:15px 14px 112px!important}
  .shell .sidebar{position:fixed!important;z-index:80!important;right:max(8px,env(safe-area-inset-right))!important;bottom:max(8px,env(safe-area-inset-bottom))!important;left:max(8px,env(safe-area-inset-left))!important;width:auto!important;max-width:none!important;box-sizing:border-box!important;display:flex!important;align-items:center!important;height:72px!important;min-height:72px!important;padding:6px!important;overflow:visible!important;border:1px solid rgba(207,226,220,.95)!important;border-radius:23px!important;background:rgba(255,255,255,.86)!important;box-shadow:0 17px 37px rgba(17,68,59,.18)!important;backdrop-filter:blur(22px) saturate(1.16)}
  .shell .sidebar .brand,.shell .sidebar .nav-label,.shell .sidebar-bottom{display:none!important}
  .shell .sidebar .sidebar-navigation,.shell .sidebar>nav{display:flex!important;align-items:center!important;justify-content:space-around!important;flex:1!important;gap:1px!important;min-width:0!important;padding:0!important;margin:0!important}
  .shell .sidebar .nav-item{display:flex!important;align-items:center!important;justify-content:center!important;flex:1 1 0!important;min-width:0!important;min-height:58px!important;margin:0!important;padding:5px 2px!important;border:0!important;border-radius:15px!important;background:transparent!important;color:#456461!important;font-size:9px!important;font-weight:800!important;line-height:1.05!important;text-align:center!important}
  .shell .sidebar .nav-item .nav-icon{color:inherit!important;font-size:19px!important;line-height:1!important}.shell .sidebar .nav-item.active{background:#e5f7ef!important;color:var(--ssl-teal)!important;box-shadow:none!important}
  .shell .sidebar .management-center-nav{flex:1.17 1 0!important;max-width:78px!important;min-height:64px!important;height:64px!important;transform:translateY(-14px)!important;border:2px solid #fff!important;border-radius:21px!important;background:linear-gradient(155deg,var(--ssl-teal),#0f8678)!important;color:#fff!important;box-shadow:0 11px 22px rgba(7,94,99,.29),0 0 0 1px rgba(217,164,65,.72)!important}
  .shell .sidebar .management-center-nav .nav-icon{display:grid!important;place-items:center!important;width:25px!important;height:23px!important;margin-bottom:1px!important;border-radius:8px!important;background:rgba(255,255,255,.15)!important;color:#fff!important}
  .shell .sidebar .management-center-nav.active{background:linear-gradient(155deg,#0b726b,#0c9c82)!important;color:#fff!important}
  .topbar{margin-bottom:17px!important}.page-title{font-size:22px!important}.farm-hero{padding:19px!important;border-radius:20px!important;margin-bottom:17px!important}.farm-hero h2{font-size:22px!important}.farm-hero p{font-size:12px!important}.section-head h3{font-size:18px!important}
  .ssl-weather-panel{grid-template-columns:1fr;padding:10px;border-radius:18px}.ssl-weather-now{min-height:82px;padding:13px 15px}.ssl-weather-now b{font-size:27px}.ssl-weather-hour{min-height:50px}.ssl-weather-day{min-height:38px}.farm-card .ssl-weather-panel{margin-top:1px}.farm-card-actions{grid-template-columns:1fr 1fr!important}.farm-card-actions .card-link{grid-column:1/-1!important}
  .panel,.pond-card,.stat-card,.module-card,.inventory-card,.farm-card{border-radius:18px!important}.stats{gap:10px!important}.tabs{scrollbar-width:none!important}
  .theme-fab{right:18px!important;bottom:101px!important}
}
@media (max-width:360px){.shell .sidebar{right:max(5px,env(safe-area-inset-right))!important;left:max(5px,env(safe-area-inset-left))!important;padding:5px!important}.shell .sidebar .nav-item{font-size:8px!important}.shell .sidebar .management-center-nav{max-width:70px!important}}

/* A compact, consistent theme control that works on every rendered route. */
.theme-fab{position:fixed;right:24px;bottom:24px;z-index:90;display:grid;place-items:center;width:42px;height:42px;border:1px solid #cee3dc;border-radius:14px;background:rgba(255,255,255,.87);color:var(--ssl-teal);box-shadow:0 9px 20px rgba(8,72,65,.15);backdrop-filter:blur(12px)}

/* Dark mode remains a full theme, not an inverted light screen. */
:root[data-theme="dark"]{--ssl-ink:#e7f5ef;--ssl-muted:#a8c1b7;--ssl-line:#385a53;--ssl-surface:#18302b;--ssl-wash:#10221e;--ssl-glass:rgba(26,49,43,.84)}
:root[data-theme="dark"] html,:root[data-theme="dark"] body{background:radial-gradient(circle at 100% 0,rgba(217,164,65,.12),transparent 24rem),linear-gradient(140deg,#10221e,#132923)!important;color:var(--ssl-ink)}
:root[data-theme="dark"] .panel,:root[data-theme="dark"] .pond-card,:root[data-theme="dark"] .stat-card,:root[data-theme="dark"] .module-card,:root[data-theme="dark"] .inventory-card,:root[data-theme="dark"] .farm-card,:root[data-theme="dark"] .warehouse-table-panel,:root[data-theme="dark"] .cost-visual-card,:root[data-theme="dark"] .cost-history-card,:root[data-theme="dark"] .cost-category-list{background:rgba(25,48,42,.88)!important;border-color:#36574f!important;box-shadow:0 15px 32px rgba(0,0,0,.17)!important}
:root[data-theme="dark"] .sidebar{background:linear-gradient(154deg,rgba(22,45,40,.92),rgba(16,38,33,.86))!important;border-color:#36564f!important}:root[data-theme="dark"] .sidebar .brand,:root[data-theme="dark"] .nav-item{color:#d9eee5!important}:root[data-theme="dark"] .nav-item.active{background:rgba(40,97,83,.5)!important;color:#a7f1d7!important}:root[data-theme="dark"] .outline,:root[data-theme="dark"] .theme-fab{background:rgba(25,48,42,.9)!important;border-color:#486c62!important;color:#b8f2dd!important}
:root[data-theme="dark"] .table th,:root[data-theme="dark"] .hint,:root[data-theme="dark"] .reference{background:rgba(33,62,54,.86)!important;color:#bed4ca!important}:root[data-theme="dark"] .table td{border-color:#34544d!important}:root[data-theme="dark"] .ssl-weather-panel{border-color:#3b6d62!important}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}