/* HAS Backoffice V2 · capa visual estable
   Archivo separado para evitar que una versión antigua de app.css quede en caché. */
:root {
  --canvas:#f5f5f2; --surface:#fff; --ink:#1d1d1b; --muted:#696a67;
  --line:#dedfdb; --line-strong:#c8cac5; --radius:12px;
  --shadow-soft:0 10px 28px rgba(35,36,32,.07);
  --sidebar-w:248px; --module-soft:#ecece8; --module-strong:#aaa;
}
body.module-month{--module-soft:#e9e7e2;--module-strong:#aaa49b}
body.module-clients{--module-soft:#dceaf5;--module-strong:#8fb9dd}
body.module-projects{--module-soft:#e2eedc;--module-strong:#9fc38e}
body.module-maintenances{--module-soft:#e8efdf;--module-strong:#acc696}
body.module-quotes{--module-soft:#f7e5d8;--module-strong:#e9ad83}
body.module-billing{--module-soft:#f4dfe4;--module-strong:#d999a8}
body.module-reservations{--module-soft:#dcefed;--module-strong:#83beb7}
body.module-activity{--module-soft:#e9e3f5;--module-strong:#ac99d4}

html{scroll-behavior:smooth} body{min-width:320px;background:var(--canvas);color:var(--ink)} img{max-width:100%}
aside{width:var(--sidebar-w);padding:24px 16px 18px;background:#f8f8f6;border-right:1px solid var(--line)}
.brand-image{display:block!important;width:142px!important;height:72px!important;min-height:72px!important;margin:0 8px 28px!important;padding:7px 10px!important;overflow:hidden!important;border:1px solid var(--line)!important;border-radius:0!important;background:#fff!important;background-image:none!important}
.brand-image>img{display:block!important;width:120px!important;height:56px!important;max-width:120px!important;max-height:56px!important;object-fit:contain!important}
aside nav{margin:0;display:grid;gap:3px}
aside nav a{display:flex;align-items:center;gap:12px;min-height:45px;padding:0 12px;border-radius:8px;color:#50514e;transition:background-color .16s,color .16s,transform .16s}
aside nav a:hover{background:#ecece8;color:var(--ink);transform:translateX(2px)}
aside nav a.active{background:var(--module-soft);color:var(--ink);font-weight:750;box-shadow:inset 3px 0 0 var(--module-strong)}
.nav-icon{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;color:currentColor}
.nav-icon svg{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.account{display:grid;grid-template-columns:34px 1fr;column-gap:10px;align-items:center;padding:15px 8px 0}
.account-avatar{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#222;color:#fff;font-size:13px;font-weight:800}
.account strong,.account small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}.account a{grid-column:2;margin-top:5px}

main{margin-left:var(--sidebar-w);max-width:none;min-width:0;padding:0 32px 80px}
.page-head{margin:0 -32px 28px;padding:27px 32px 25px;background:var(--module-soft);border-top:4px solid var(--module-strong);border-bottom:1px solid rgba(0,0,0,.06)}
.page-head h1{font-size:clamp(29px,3vw,39px);line-height:1.05;letter-spacing:-.035em}
.month-nav{max-width:1500px;margin:0 auto 22px}.month-nav a{display:grid;place-items:center;width:40px;height:40px;padding:0;border-radius:50%;transition:background-color .16s,transform .16s}.month-nav a:hover{background:#fff;transform:scale(1.05)}

.metrics{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:10px!important;width:100%;max-width:1500px;margin-left:auto;margin-right:auto;background:transparent!important;border:0!important}
.metrics.compact{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important}
.metrics>*{min-width:0;overflow:hidden;border:1px solid var(--line)!important;border-top-width:4px!important;border-radius:9px!important;box-shadow:0 1px 0 rgba(0,0,0,.015)}
.dashboard-metrics a{display:flex!important;flex-direction:column;justify-content:space-between;min-height:116px!important;padding:16px!important;line-height:1.25;transition:transform .17s ease,box-shadow .17s ease,border-color .17s ease}
.dashboard-metrics a:hover{transform:translateY(-3px);box-shadow:var(--shadow-soft);border-color:var(--module-strong)!important}
.dashboard-metrics span{font-weight:750;letter-spacing:.04em}.dashboard-metrics strong{font-size:clamp(20px,1.8vw,28px);white-space:nowrap}.dashboard-metrics small{white-space:normal;line-height:1.25}

.panel{border-radius:var(--radius);box-shadow:0 1px 0 rgba(0,0,0,.015);transition:box-shadow .18s ease}.panel:hover{box-shadow:0 7px 22px rgba(35,36,32,.045)}
.panel-heading{background:#fff}.attention{overflow:hidden}.attention-grid{padding:0;gap:0}.attention-grid a{min-width:0;min-height:94px;padding:17px;border-right:1px solid var(--line);border-radius:0;transition:background-color .16s}.attention-grid a:last-child{border-right:0}.attention-grid a:hover{background:#fafaf7}.attention-grid a:hover strong{text-decoration:underline;text-underline-offset:3px}
tbody tr{transition:background-color .14s ease}tbody tr:hover{background:color-mix(in srgb,var(--module-soft) 38%,white)}
.line{transition:background-color .14s ease}.line:hover{background:color-mix(in srgb,var(--module-soft) 28%,white)}
.button,button{transition:transform .12s ease,background-color .14s,border-color .14s,box-shadow .14s}.button:hover,button:hover{box-shadow:0 4px 12px rgba(0,0,0,.08)}.button:active,button:active{transform:translateY(1px)}

.login-page{display:grid;place-items:center;min-height:100vh;padding:24px;background:linear-gradient(135deg,#f5f5f2,#e9e7e2)}
.login-page main.login-card{margin:0!important;width:min(430px,100%)!important;max-width:430px!important;padding:42px!important;border-radius:14px;overflow:hidden;box-shadow:0 18px 50px rgba(35,36,32,.1)}
.login-logo{display:block!important;width:180px!important;height:95px!important;max-width:180px!important;max-height:95px!important;object-fit:contain!important;margin:0 auto 26px!important;padding:8px!important;border:1px solid var(--line);background:#fff}
.login-card .eyebrow,.login-card h1,.login-card>.muted{text-align:center}.login-card h1{margin:8px 0 5px}

@media(max-width:1180px){.metrics{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(max-width:850px){.metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}.attention-grid{grid-template-columns:1fr 1fr}.attention-grid a:nth-child(2){border-right:0}}
@media(max-width:720px){aside{width:min(290px,86vw)}main{margin-left:0;padding:0 15px 70px}.page-head{margin:0 -15px 20px;padding:20px 15px}.brand-image{margin-bottom:20px!important}.login-page main.login-card{padding:30px 24px!important}.login-logo{width:150px!important;height:80px!important}.metrics.compact{grid-template-columns:1fr 1fr!important}}
@media(max-width:480px){.metrics,.metrics.compact{grid-template-columns:1fr!important}.attention-grid{grid-template-columns:1fr}.attention-grid a{border-right:0;border-bottom:1px solid var(--line)}}
