:root{--red:#b91f32;--dark:#451820;--ink:#30282a;--muted:#81777a;--line:#eadfe1;--paper:#faf7f7;--white:#fff;--pale:#f9e9eb;--shadow:0 8px 24px #461b2010}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.5 Segoe UI,Arial,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}h1{font-size:27px;margin:4px 0;letter-spacing:-.5px}h2{font-size:15px;margin:0}p{margin:3px 0}small{font-size:10px}.muted{color:var(--muted);font-size:11px}.red{color:var(--red);font-weight:800;letter-spacing:1px}.login{min-height:100vh;display:grid;place-items:center;padding:18px}.login-card{width:min(410px,100%);background:#fff;padding:30px;border-radius:16px;border:1px solid var(--line);box-shadow:var(--shadow)}.login-card h1{margin-top:25px}.login-card p{color:var(--muted);margin-bottom:19px}.login-card label{display:grid;gap:5px;font-size:12px;margin:12px 0}.login-card input,.form-grid input,.form-grid select,.form-grid textarea,.filters input,.filters select{border:1px solid var(--line);border-radius:8px;padding:10px;background:#fff;width:100%;color:var(--ink)}.brand{display:flex;gap:10px;align-items:center;font-weight:800}.brand small{display:block;color:var(--muted);font-weight:500}.logo{width:36px;height:36px;display:grid;place-items:center;background:var(--red);color:#fff;border-radius:10px;font-size:19px}.primary{border:1px solid var(--red);border-radius:8px;padding:9px 13px;background:var(--red);color:#fff;font-weight:700}.login-card .primary{width:100%;margin-top:6px}.auth-link{display:block;width:100%;border:0;background:transparent;color:var(--red);padding:10px 4px 0;font-size:12px;font-weight:650}.error{color:var(--red);font-size:11px;margin-top:10px}.error.success{color:#247257}.layout{min-height:100vh;display:flex}.sidebar{width:240px;background:var(--dark);color:#fff;display:flex;flex-direction:column;padding:20px 14px;flex-shrink:0}.sidebar .brand{padding:0 5px 24px;font-size:13px}.sidebar .brand small{color:#d9bec2}.sidebar .logo{background:#fff;color:var(--red)}.sidebar nav{display:grid;gap:4px}.sidebar nav button{border:0;background:transparent;color:#e5d9db;text-align:left;border-radius:8px;padding:10px;display:flex;gap:11px;align-items:center}.sidebar nav button.active,.sidebar nav button:hover{background:#ffffff20}.account{margin-top:auto;border-top:1px solid #ffffff30;padding:13px 5px 0;display:grid;grid-template-columns:1fr auto;gap:3px}.account b,.account small{grid-column:1}.account button{grid-column:2;grid-row:1/3;border:0;background:none;color:#fff}.main{flex:1;min-width:0}.topbar{height:62px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;font-size:12px}.content{max-width:1300px;padding:28px;margin:auto}.page{display:none}.page.active{display:block}.heading{display:flex;align-items:start;justify-content:space-between;gap:10px;margin-bottom:18px}.panel{background:#fff;border:1px solid var(--line);border-radius:12px;padding:17px;box-shadow:var(--shadow)}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:9px;margin-bottom:13px}.link{border:0;background:none;color:var(--red);font-weight:700}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-bottom:15px}.stat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px}.stat small{color:var(--muted)}.stat b{display:block;font-size:25px}.scroll{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:left;padding:9px 7px;color:var(--muted);font-size:9px;border-bottom:1px solid var(--line)}td{padding:11px 7px;border-bottom:1px solid #f2ebec;font-size:11px}.badge{padding:3px 8px;border-radius:99px;font-size:9px;font-weight:700}.urgency-Alta{background:#fae5e8;color:#a52635}.urgency-Media{background:#fff0d6;color:#93601b}.urgency-Baja{background:#e5f1e8;color:#387047}.status-Pendiente{background:#edf1f4;color:#556c7c}.status-En-curso{background:#e0f1ea;color:#247257}.status-Pausada{background:#fff0d6;color:#93601b}.status-Resuelta{background:#e5f1e8;color:#387047}.filters{display:flex;gap:8px;margin-bottom:12px}.filters input{max-width:330px}.list{display:grid;gap:10px}.request-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px}.request-title{display:flex;justify-content:space-between;gap:10px}.request-card h3{margin:3px 0;font-size:14px}.request-card p{font-size:11px;color:#655d60}.meta{font-size:10px;color:var(--muted)}.task-actions{display:flex;gap:7px;align-items:end;flex-wrap:wrap;margin-top:12px}.task-actions label{display:grid;gap:4px;font-size:9px;color:var(--muted)}.task-actions select{padding:6px;border:1px solid var(--line);border-radius:7px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-grid label{display:grid;gap:5px;font-size:11px;font-weight:650}.form-grid .full{grid-column:1/-1}.form-grid fieldset{border:0;padding:0;margin:0}.form-grid legend{font-weight:700;font-size:11px;margin-bottom:7px}.urgencies{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.urgency-option{border:1px solid var(--line);border-radius:8px;padding:9px;display:flex;gap:7px;font-size:11px}.urgency-option small{display:block;color:var(--muted)}.urgency-option input{width:auto;accent-color:var(--red)}.actions{display:flex;justify-content:end}.report-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.chart{height:220px;display:flex;align-items:end;justify-content:space-around;padding:10px;background:repeating-linear-gradient(to top,transparent 0,transparent 48px,#f1e9ea 49px,#f1e9ea 50px);border-bottom:1px solid var(--line)}.barcol{height:100%;display:flex;align-items:end;gap:4px;position:relative;padding-bottom:17px}.barcol i{width:11px;background:#ad1e2f;border-radius:3px 3px 0 0}.barcol i.done{background:#df9ba3}.barcol small{position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-size:8px;color:var(--muted)}.resolution-svg{width:100%;height:205px}.chart-caption{font-size:10px;color:var(--muted);padding-top:5px}.catalog-list{display:grid;gap:7px}.catalog-row{display:flex;align-items:center;justify-content:space-between;padding:10px;border:1px solid var(--line);border-radius:8px}.catalog-row button{border:1px solid var(--line);background:#fff;border-radius:6px;padding:5px 8px}.toast{position:fixed;bottom:20px;right:20px;background:#33292b;color:#fff;padding:10px 15px;border-radius:8px;opacity:0;transition:.2s}.toast.show{opacity:1}.empty{color:var(--muted);text-align:center;padding:22px}.admin-only,.technician-only,.requester-only{display:none}.modal-back{position:fixed;inset:0;background:#0007;display:grid;place-items:center;padding:18px}.modal{background:#fff;padding:20px;border-radius:12px;width:min(420px,100%)}.modal label{display:grid;gap:5px;margin:9px 0;font-size:11px}.modal input,.modal select{padding:8px;border:1px solid var(--line);border-radius:7px}@media(max-width:850px){.sidebar{width:195px}.stats{grid-template-columns:repeat(2,1fr)}.report-grid{grid-template-columns:1fr}}@media(max-width:620px){.layout{display:block;padding-bottom:58px}.sidebar{position:fixed;z-index:3;bottom:0;left:0;right:0;height:58px;width:auto;padding:3px}.sidebar .brand,.account{display:none}.sidebar nav{display:flex;justify-content:space-around}.sidebar nav button{display:grid;justify-items:center;gap:0;padding:4px;font-size:15px}.sidebar nav button span{font-size:8px}.topbar{height:50px;padding:0 12px}.content{padding:18px 12px}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.urgencies{grid-template-columns:1fr}.filters{flex-wrap:wrap}.filters input{max-width:none;flex:1}.report-grid{grid-template-columns:1fr}}
.heading-actions{display:flex;gap:8px;flex-wrap:wrap}.heading-actions .primary{white-space:nowrap}@media(max-width:620px){.heading-actions{justify-content:end}.heading-actions .primary{font-size:11px;padding:8px}}

/* Mejor legibilidad en pantallas pequeñas */
@media (max-width: 620px) {
  body { font-size: 15px; }
  h1 { font-size: 25px; }
  h2 { font-size: 17px; }
  small { font-size: 12px; }
  .muted { font-size: 13px; }
  .topbar { font-size: 14px; }
  .login-card label { font-size: 14px; }
  .login-card input, .form-grid input, .form-grid select, .form-grid textarea,
  .filters input, .filters select { font-size: 15px; padding: 12px; }
  .primary { font-size: 15px; padding: 11px 14px; }
  .auth-link { font-size: 14px; }
  .error { font-size: 13px; }
  .sidebar nav button { font-size: 17px; }
  .sidebar nav button span { font-size: 10px; }
  .content { padding: 18px 12px; }
  .panel { padding: 14px; }
  .stat small { font-size: 12px; }
  .stat b { font-size: 24px; }
  th { font-size: 11px; }
  td { font-size: 13px; }
  .badge { font-size: 11px; }
  .request-card h3 { font-size: 16px; }
  .request-card p { font-size: 13px; }
  .meta { font-size: 12px; }
  .task-actions label, .form-grid label { font-size: 13px; }
  .form-grid legend { font-size: 13px; }
  .urgency-option { font-size: 13px; }
  .urgency-option small { font-size: 12px; }
  .chart-caption { font-size: 12px; }
  .barcol small { font-size: 10px; }
}

.mobile-logout{display:none}
@media(max-width:620px){.topbar{gap:8px}.mobile-logout{display:block;flex-shrink:0;border:1px solid var(--red);border-radius:7px;background:#fff;color:var(--red);font-size:12px;font-weight:700;padding:7px 9px}}

/* Segundo ajuste: tipografía más notoria para teléfonos */
@media (max-width: 620px) {
  body, .content { font-size: 16px; }
  h1 { font-size: 27px; }
  h2 { font-size: 18px; }
  small { font-size: 13px; }
  .muted, .topbar { font-size: 14px; }
  .topbar { min-height: 54px; height: auto; }
  .login-card label, .form-grid label, .task-actions label { font-size: 15px; }
  .login-card input, .form-grid input, .form-grid select, .form-grid textarea,
  .filters input, .filters select, .task-actions select { font-size: 16px; }
  .primary { font-size: 16px; }
  .auth-link { font-size: 15px; }
  .error { font-size: 14px; }
  .sidebar nav button { font-size: 18px; }
  .sidebar nav button span { font-size: 11px; }
  .panel-heading, .panel-heading .link { font-size: 14px; }
  .stat small { font-size: 13px; }
  th { font-size: 12px; }
  td { font-size: 14px; }
  .badge { font-size: 12px; }
  .request-card h3 { font-size: 17px; }
  .request-card p { font-size: 14px; }
  .meta { font-size: 13px; }
  .form-grid legend, .urgency-option { font-size: 14px; }
  .urgency-option small, .barcol small { font-size: 12px; }
  .chart-caption { font-size: 13px; }
  .mobile-logout { font-size: 14px; }
}
