/* Minaya AgroFresh - Look Premium Ready Live
   Solo presentación visual. No modifica lógica, datos, permisos ni APIs. */
:root{
  --premium-green-950:#052b1b;
  --premium-green-900:#063b24;
  --premium-green-800:#075b32;
  --premium-green-700:#0d7342;
  --premium-green-600:#168a4d;
  --premium-green-100:#e8f5ed;
  --premium-green-50:#f4faf6;
  --premium-ink:#153326;
  --premium-muted:#667a6e;
  --premium-line:#dfeae3;
  --premium-bg:#f5f8f6;
  --premium-white:#fff;
  --premium-gold:#b8cc42;
  --premium-radius-xl:24px;
  --premium-radius-lg:18px;
  --premium-radius-md:13px;
  --premium-shadow-sm:0 6px 18px rgba(10,55,33,.055);
  --premium-shadow-md:0 14px 36px rgba(9,56,33,.095);
  --premium-shadow-lg:0 24px 56px rgba(5,43,27,.16);
}
html,body{background:var(--premium-bg)!important;color:var(--premium-ink)!important}
body{letter-spacing:-.005em}

/* Sidebar: marca limpia, navegación respirada */
#sidebar{background:linear-gradient(180deg,var(--premium-green-950),var(--premium-green-900) 62%,#052f1e)!important;border-right:1px solid rgba(255,255,255,.06)}
#sidebar .brand{padding:18px 14px 20px!important;gap:13px!important;border-bottom:1px solid rgba(255,255,255,.10);margin-bottom:10px}
#sidebar .brand img{width:62px!important;height:62px!important;max-width:62px!important;max-height:62px!important;padding:5px!important;background:#fff!important;border-radius:16px!important;object-fit:contain!important;box-shadow:0 8px 24px rgba(0,0,0,.18)!important}
#sidebar .brand strong{font-size:1.05rem!important;color:#fff!important;font-weight:800!important;letter-spacing:-.02em}
#sidebar .brand small{margin-top:3px;color:#cce8d7!important;font-size:.72rem!important;font-weight:600!important;letter-spacing:.01em}
#sidebar nav{gap:5px!important;padding:4px 7px 12px!important}
#sidebar .nav-btn{min-height:46px!important;padding:11px 12px!important;border:1px solid transparent!important;border-radius:12px!important;color:#e8f4ed!important;font-weight:650!important;transition:background .16s ease,border-color .16s ease,transform .16s ease!important}
#sidebar .nav-btn:hover{background:rgba(255,255,255,.09)!important;border-color:rgba(255,255,255,.08)!important;transform:translateX(2px)}
#sidebar .nav-btn.active{background:linear-gradient(135deg,rgba(255,255,255,.17),rgba(255,255,255,.09))!important;border-color:rgba(255,255,255,.13)!important;box-shadow:inset 3px 0 0 var(--premium-gold)}
#sidebar .nav-icon{color:#c6e9d4}

/* Header principal */
#app main>header{min-height:82px!important;padding:14px clamp(18px,2.3vw,32px)!important;background:rgba(255,255,255,.96)!important;backdrop-filter:blur(12px);border-bottom:1px solid var(--premium-line)!important;box-shadow:0 5px 22px rgba(12,60,37,.04)!important}
.header-left h2{font-size:clamp(1.22rem,2vw,1.55rem)!important;font-weight:800!important;color:var(--premium-ink)!important;letter-spacing:-.025em}
.header-left p{font-size:.83rem!important;color:var(--premium-muted)!important}
.header-actions .date-box{padding:7px 11px;border:1px solid var(--premium-line);border-radius:11px;background:#fbfdfc}
.global-search input{border-color:var(--premium-line)!important;background:#f9fcfa!important;box-shadow:none!important}
.global-search input:focus{background:#fff!important;border-color:#86b99b!important;box-shadow:0 0 0 4px rgba(22,138,77,.09)!important}

/* Contenido y ritmo vertical */
#content{max-width:1640px!important;padding:clamp(18px,2.2vw,32px)!important}
#content>*+*{margin-top:18px}
.version-banner,.phase-banner{display:none!important}

/* Heroes: una familia visual premium */
.dashboard-welcome,.company-hero,.module-hero,.production-hero24,.equipment-hero,.compliance-hero,.export-hero,.cost-hero,.performance-hero,.today-hero,.calendar-hero,
[class$="-hero"],[class*="-hero "]{
  border-radius:var(--premium-radius-xl)!important;
  box-shadow:var(--premium-shadow-md)!important;
}
.dashboard-welcome,.company-hero,.production-hero24,.equipment-hero,.compliance-hero,.export-hero,.cost-hero,.performance-hero{
  background:linear-gradient(125deg,var(--premium-green-950) 0%,var(--premium-green-800) 62%,#16804b 100%)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  position:relative;overflow:hidden;
}
.dashboard-welcome:after,.company-hero:after,.production-hero24:after,.equipment-hero:after,.compliance-hero:after,.export-hero:after,.cost-hero:after,.performance-hero:after{
  content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-90px;top:-120px;background:radial-gradient(circle,rgba(184,204,66,.20),rgba(184,204,66,0) 70%);pointer-events:none
}
.dashboard-welcome>*,.company-hero>*,.production-hero24>*,.equipment-hero>*,.compliance-hero>*,.export-hero>*,.cost-hero>*,.performance-hero>*{position:relative;z-index:1}
.dashboard-welcome h2,.company-hero h3,.production-hero24 h2,.equipment-hero h3,.compliance-hero h3,.export-hero h3,.cost-hero h2,.performance-hero h2{color:#fff!important;letter-spacing:-.03em!important;font-weight:800!important}
.dashboard-welcome p,.company-hero p,.production-hero24 p,.equipment-hero p,.compliance-hero p,.export-hero p,.cost-hero p,.performance-hero p{color:#dcefe4!important;line-height:1.6!important}
.dashboard-welcome .eyebrow,.company-hero .eyebrow,.production-hero24 .eyebrow,.equipment-hero .eyebrow,.compliance-hero .eyebrow,.export-hero .eyebrow,.cost-hero .eyebrow,.performance-hero .eyebrow{color:#cde88a!important}
.dashboard-welcome{padding:30px clamp(22px,3vw,38px)!important;min-height:150px}
.dashboard-welcome h2{font-size:clamp(1.65rem,3vw,2.25rem)!important;margin:5px 0 7px!important}
.dashboard-actions{gap:10px!important}
.dashboard-actions .btn{min-height:44px!important}
.dashboard-actions .secondary{background:rgba(255,255,255,.10)!important;border-color:rgba(255,255,255,.28)!important;color:#fff!important}
.dashboard-actions .secondary:hover{background:rgba(255,255,255,.17)!important}

/* Logo corporativo */
.company-logo-wrap{width:210px!important;height:126px!important;padding:12px 15px!important;border-radius:20px!important;background:#fff!important;box-shadow:0 14px 34px rgba(0,0,0,.18)!important;border:1px solid rgba(255,255,255,.6)!important}
.company-logo-wrap img{width:100%!important;height:100%!important;object-fit:contain!important}

/* KPI premium */
.dashboard-kpis{gap:15px!important;margin:20px 0 30px!important}
.dashboard-kpi{min-height:112px!important;padding:18px!important;border:1px solid var(--premium-line)!important;border-radius:var(--premium-radius-lg)!important;background:linear-gradient(180deg,#fff,#fbfdfc)!important;box-shadow:var(--premium-shadow-sm)!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important}
.dashboard-kpi:hover{transform:translateY(-3px)!important;border-color:#a7cfb6!important;box-shadow:var(--premium-shadow-md)!important}
.dashboard-kpi-icon{width:48px!important;height:48px!important;border-radius:14px!important;background:linear-gradient(145deg,#e5f5eb,#f6fbf8)!important;color:var(--premium-green-700)!important;box-shadow:inset 0 0 0 1px #d7eadf}
.dashboard-kpi small{font-size:.75rem!important;color:var(--premium-muted)!important;line-height:1.25!important}
.dashboard-kpi strong{font-size:clamp(1.18rem,2vw,1.45rem)!important;color:var(--premium-ink)!important;letter-spacing:-.02em!important}
.dashboard-kpi em{color:var(--premium-green-700)!important;letter-spacing:.01em!important}

/* Cards, paneles y charts */
.card,.panel,.chart-card,.attention-panel,.dashboard-card,.widget,.table-card,.form-card,
[class*="-kpi"] article,[class*="-kpis"] article{
  border:1px solid var(--premium-line)!important;
  border-radius:var(--premium-radius-lg)!important;
  background:#fff!important;
  box-shadow:var(--premium-shadow-sm)!important;
}
.card,.panel,.chart-card,.attention-panel{transition:border-color .16s ease,box-shadow .16s ease}
.card:hover,.chart-card:hover{border-color:#c8ded0!important;box-shadow:0 10px 28px rgba(10,55,33,.075)!important}
.cards{gap:15px!important}
.card{min-width:0!important;padding:19px!important}
.card .kpi{font-size:clamp(1.32rem,2vw,1.65rem)!important;font-weight:800!important;line-height:1.15!important;color:var(--premium-ink)!important;overflow-wrap:anywhere}
.card small{color:var(--premium-muted)!important}
.kpi-icon{border-radius:13px!important;background:var(--premium-green-100)!important;color:var(--premium-green-700)!important}
.panel{padding:clamp(18px,2vw,24px)!important}
.panel-head{padding-bottom:14px!important;margin-bottom:17px!important;border-bottom:1px solid #edf2ef!important;gap:16px!important}
.panel-head h3{font-size:1.08rem!important;font-weight:800!important;color:var(--premium-ink)!important;letter-spacing:-.015em!important;margin:0 0 4px!important}
.panel-description,.panel-head p{color:var(--premium-muted)!important;line-height:1.5!important}
.chart-card{min-height:300px!important;padding:20px!important}
.chart-head h4{font-size:1rem!important;font-weight:800!important;color:var(--premium-ink)!important}
.chart-head p{line-height:1.45!important}
.dashboard-section-head{margin:28px 0 15px!important}
.dashboard-section-head h3,.attention-head h3{font-size:1.2rem!important;font-weight:800!important;color:var(--premium-ink)!important}
.dashboard-period{background:var(--premium-green-100)!important;color:var(--premium-green-800)!important;border:1px solid #d8eadd}
.attention-panel{padding:22px!important}
.attention-item{min-height:54px!important;background:#fcfefd!important;border-radius:13px!important}

/* Botones */
.btn,button.btn{border-radius:11px!important;min-height:42px;font-weight:750!important;letter-spacing:-.005em!important;box-shadow:none;transition:transform .14s ease,box-shadow .14s ease,background .14s ease!important}
.btn.primary{background:linear-gradient(135deg,var(--premium-green-700),var(--premium-green-600))!important;border-color:var(--premium-green-700)!important;color:#fff!important}
.btn.primary:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(13,115,66,.19)!important}
.btn.secondary{background:#fff!important;border-color:#cfe0d6!important;color:#24513a!important}
.btn.secondary:hover{background:#f4faf6!important;border-color:#a8ccb6!important}
.btn.danger{color:#fff!important}

/* Formularios */
input,select,textarea{border-radius:11px!important;border-color:#d5e2da!important;background:#fff!important;line-height:1.35!important}
input:focus,select:focus,textarea:focus{outline:none!important;border-color:#7ab391!important;box-shadow:0 0 0 4px rgba(22,138,77,.09)!important}
label{line-height:1.35!important}
.modal-card,.confirm-card{border:1px solid var(--premium-line)!important;border-radius:22px!important;box-shadow:var(--premium-shadow-lg)!important}

/* Tablas */
.table-wrap,.table-responsive,.responsive-table{border:1px solid var(--premium-line)!important;border-radius:15px!important;background:#fff!important;overflow:auto!important}
table{border-collapse:separate!important;border-spacing:0!important;background:#fff!important}
th{background:#f3f8f5!important;color:#365444!important;font-size:.74rem!important;text-transform:none!important;letter-spacing:.01em!important;font-weight:800!important;border-bottom:1px solid #dce8e1!important}
td{color:#314b3c!important;border-bottom:1px solid #edf2ef!important;line-height:1.45!important}
tbody tr:hover td{background:#f9fcfa!important}

/* Eyebrows semánticos, sin apariencia de texto técnico */
.eyebrow{font-size:.68rem!important;letter-spacing:.12em!important;font-weight:850!important}

/* Mejoras de responsive y anti-solapamiento */
#content *{min-width:0}
h1,h2,h3,h4,h5,h6,p,small,strong,b,span,em,td,th,label{overflow-wrap:break-word}
.row-actions,.toolbar,.panel-head,.dashboard-actions{flex-wrap:wrap!important}
@media(max-width:1150px){
  .dashboard-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:800px){
  #content{padding:16px!important}
  .dashboard-welcome{padding:23px!important}
  .dashboard-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .company-logo-wrap{width:100%!important;height:108px!important}
  .panel{padding:17px!important}
  .chart-card{padding:17px!important}
}
@media(max-width:560px){
  .dashboard-kpis{grid-template-columns:1fr!important}
  .dashboard-kpi{min-height:96px!important}
  .dashboard-actions{display:grid!important;grid-template-columns:1fr!important}
  .dashboard-actions .btn{width:100%!important}
  .cards{grid-template-columns:1fr!important}
  .panel-head{align-items:stretch!important}
  .panel-head .btn,.panel-head button{width:100%!important}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
