/* KELMATEC · identidad visual transversal. Sobrescribe estilos sin alterar lógica ni formularios. */
:root{--km-navy:#10243a;--km-blue:#1678ed;--km-bg:#edf4fb;--km-ink:#142b48;--km-stroke:#dbe6f1}
body{background:var(--km-bg);font-family:'IBM Plex Sans',Arial,sans-serif}
.app{width:100%;max-width:none;min-height:100vh;display:flex;align-items:stretch}
.app>aside{background:linear-gradient(180deg,#0e2237,#102b47 58%,#0b1d31);color:#e7f1fc;box-shadow:4px 0 18px #0c254319;min-height:100vh;position:sticky;top:0;align-self:flex-start}
.app>aside .nav{border-radius:9px;transition:background .16s,color .16s}
.app>aside .nav.on{background:linear-gradient(105deg,#1884ff,#0964d5);color:#fff;box-shadow:0 5px 14px #0862bd36}
.app>aside .nav:not(.on):hover{background:#ffffff17}
.app>main{flex:1;min-width:0;width:auto;max-width:none;margin:0;padding:0 18px 28px!important;background:linear-gradient(150deg,#eaf3fc,#f4f8fc 62%,#eaf2fa)}
.km-toolbar{height:59px;background:linear-gradient(90deg,#10243a,#193957);color:#f6faff;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 22px;margin:0 -18px 8px;box-shadow:0 2px 12px #102b4620}
.km-brand-mini,.km-toolbar-actions{display:flex;align-items:center;gap:11px}.km-brand-mini strong{font-size:19px;font-style:italic;letter-spacing:.6px;color:#65c6ff}.km-brand-mark{color:#59b9ff;font-size:25px}.km-brand-desc{font-size:10px;opacity:.8}.km-toolbar-actions{font-size:12px}.km-toolbar-label{opacity:.72}.km-user-circle{width:32px;height:32px;display:grid;place-items:center;background:#fff;color:#163553;border-radius:50%;font-weight:700}.km-user-name{font-weight:600}
.km-hero{height:136px;position:relative;isolation:isolate;display:flex;align-items:center;overflow:hidden;border-radius:12px;margin:8px 0 14px;padding:20px 29px;color:#fff;background:linear-gradient(100deg,#12355d 0%,#1162a5 53%,#103354 100%);box-shadow:0 3px 12px #163f6c1e}
.km-hero:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 74% 8%,#67d3ff6b,transparent 43%),repeating-linear-gradient(150deg,transparent 0 24px,#ffffff0a 25px 26px);z-index:-1}
.km-hero-copy{position:relative;z-index:2;max-width:62%}.km-kicker{font-size:10px;letter-spacing:2px;font-weight:600;color:#a7e6ff}.km-hero h1{font-size:clamp(23px,2.25vw,36px);line-height:1.15;margin:7px 0 6px;color:#fff;font-weight:700}.km-hero p{font-size:13px;margin:0;color:#dbeeff}
.km-hero-art{position:absolute;right:0;top:0;height:100%;width:45%;background-position:center;background-repeat:no-repeat;background-size:cover;mask-image:linear-gradient(90deg,transparent,#000 28%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 28%);opacity:.95}
.km-hero-refrigeracion .km-hero-art,.km-hero-mantenimiento .km-hero-art{background-image:url('/static/hero_refrigeracion.svg')}
.km-hero-electricidad .km-hero-art{background-image:url('/static/hero_electricidad.svg')}
.km-hero-facturacion .km-hero-art,.km-hero-fiscal .km-hero-art,.km-hero-contabilidad .km-hero-art,.km-hero-bancos .km-hero-art,.km-hero-pagos .km-hero-art{background-image:url('/static/hero_finanzas.svg')}
.km-hero-clientes .km-hero-art,.km-hero-panel .km-hero-art{background-image:url('/static/hero_clientes.svg')}
.app main .card,.app main .panel,.app main .box{border-radius:12px;box-shadow:0 2px 8px #1b4b7610;border-color:var(--km-stroke)}
.app main table{width:100%}.app main th{background:#eaf2fb;color:#355575}.app main .btn,.app main button{border-radius:8px}
@media(max-width:850px){.km-brand-desc,.km-toolbar-label{display:none}.km-hero{height:116px;padding:15px 19px}.km-hero-copy{max-width:80%}.km-hero-art{width:40%;opacity:.6}.app>main{padding-left:10px!important;padding-right:10px!important}.km-toolbar{margin-left:-10px;margin-right:-10px}}
@media(max-width:550px){.km-hero{height:105px}.km-hero h1{font-size:22px}.km-hero p{font-size:11px}.km-hero-art{opacity:.35}.km-user-name{display:none}}
