:root{
  --navy:#082B4C; --navy-deep:#051B32; --red:#A81014; --wine:#640B12;
  --gold:#D9A12E; --gold-light:#F2CB69; --ivory:#FFF3D6; --orange:#F26B16;
  --white:#FFFFFF; --black-warm:#18120F; --max-width:1160px;
  --font-title:'Cinzel','Cambria',serif; --font-body:'Montserrat','Source Sans 3','Lato',sans-serif;
}
*{box-sizing:border-box;}

/* ---------- Ajustes: tamaño de letra (escala toda la interfaz vía rem) ---------- */
html{font-size:16px;transition:font-size .15s ease;}
html[data-font-size="pequena"]{font-size:14px;}
html[data-font-size="normal"]{font-size:16px;}
html[data-font-size="grande"]{font-size:19px;}
html[data-font-size="muy_grande"]{font-size:23px;}

body{margin:0;font-family:var(--font-body);background:var(--ivory);color:var(--black-warm);}
a{color:inherit;}
.hidden{display:none !important;}

/* ---------- Login ---------- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,var(--navy) 0%,var(--navy-deep) 100%);padding:24px;}
.login-card{background:var(--ivory);border-radius:16px;box-shadow:0 20px 50px rgba(0,0,0,.35);max-width:420px;width:100%;padding:40px 34px;text-align:center;}
.login-card .brand-logo{width:auto;height:108px;object-fit:contain;margin:0 auto 14px;display:block;}
.login-card .org-name{font-family:var(--font-title);color:var(--navy);font-size:1rem;font-weight:700;letter-spacing:.02em;margin:0;}
.login-card .org-sub{color:var(--wine);font-size:.8rem;margin:2px 0 18px;font-weight:600;letter-spacing:.03em;}
.login-card h1{font-family:var(--font-title);color:var(--navy);font-size:1.4rem;margin:0 0 22px;padding-top:14px;border-top:1px solid rgba(8,43,76,.12);}
.login-card p.subtitle{color:#666;font-size:.9rem;margin:0 0 28px;}
.btn{display:block;width:100%;padding:12px 16px;border-radius:10px;border:none;font-family:var(--font-body);font-weight:600;font-size:.95rem;cursor:pointer;margin-bottom:12px;transition:transform .15s ease, box-shadow .15s ease;}
.btn:hover{transform:translateY(-1px);}
.btn-google{background:var(--white);color:#3c4043;border:1px solid #dadce0;display:flex;align-items:center;justify-content:center;gap:10px;}
.btn-google img{width:18px;height:18px;margin:0;}
.btn-primary{background:var(--navy);color:var(--white);}
.btn-primary:hover{background:var(--navy-deep);}
.divider{display:flex;align-items:center;gap:10px;color:#999;font-size:.75rem;margin:18px 0;text-transform:uppercase;letter-spacing:.06em;}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:#e2e2e2;}
.field{text-align:left;margin-bottom:14px;}
.field label{display:block;font-size:.78rem;font-weight:600;color:var(--navy);margin-bottom:5px;}
.field input{width:100%;padding:10px 12px;border-radius:8px;border:1px solid #d8d8d8;font-family:var(--font-body);font-size:.9rem;}
.field input:focus{outline:2px solid var(--gold);border-color:var(--gold);}
.login-msg{font-size:.82rem;color:var(--wine);margin-top:10px;min-height:18px;}
.login-footer{margin-top:22px;font-size:.75rem;color:#999;}
.login-footer a{color:var(--wine);font-weight:700;text-decoration:underline;}
.field select{width:100%;padding:10px 12px;border-radius:8px;border:1px solid #d8d8d8;font-family:var(--font-body);font-size:.9rem;background:var(--white);}
.field textarea{width:100%;padding:10px 12px;border-radius:8px;border:1px solid #d8d8d8;font-family:var(--font-body);font-size:.9rem;resize:vertical;min-height:72px;}
.field textarea:focus,.field select:focus{outline:2px solid var(--gold);border-color:var(--gold);}
.field .hint{font-size:.72rem;color:#888;margin-top:4px;}
.success-box{background:#eaf7ee;border:1px solid #8fd19e;color:#1e6b34;padding:16px 18px;border-radius:10px;font-size:.85rem;text-align:left;line-height:1.5;}
.back-link{display:inline-block;margin-top:18px;font-size:.8rem;color:var(--navy);text-decoration:none;font-weight:600;}
.back-link:hover{text-decoration:underline;}

/* ---------- App shell ---------- */
.app-shell{display:flex;min-height:100vh;}
.sidebar{width:250px;flex-shrink:0;background:var(--navy-deep);color:var(--ivory);padding:22px 16px;display:flex;flex-direction:column;}
.sidebar .brand{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;margin-bottom:26px;}
.sidebar .brand img{width:72px;height:72px;object-fit:contain;margin-bottom:4px;}
.sidebar .brand strong{font-family:var(--font-title);font-size:1rem;line-height:1.2;letter-spacing:.02em;}
.sidebar .brand .brand-sub{font-size:.7rem;color:var(--gold-light);letter-spacing:.04em;font-weight:600;}
.sidebar nav{flex:1;}
.sidebar nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;color:var(--ivory);text-decoration:none;font-size:.88rem;font-weight:600;margin-bottom:4px;opacity:.85;}
.sidebar nav a:hover{background:rgba(255,255,255,.08);opacity:1;}
.sidebar nav a.active{background:var(--gold);color:var(--navy-deep);opacity:1;}
.sidebar nav a.disabled{opacity:.35;cursor:default;}
.sidebar nav a.disabled:hover{background:none;}
.sidebar .user-box{border-top:1px solid rgba(255,255,255,.15);padding-top:14px;font-size:.78rem;}
.sidebar .user-box .role-badge{display:inline-block;background:var(--gold);color:var(--navy-deep);font-weight:700;font-size:.68rem;padding:2px 8px;border-radius:20px;margin-top:4px;}
.user-box-ajustes-link{display:flex;align-items:center;gap:6px;color:var(--ivory);text-decoration:none;font-size:.76rem;font-weight:600;opacity:.85;margin-top:10px;padding:6px 0;}
.user-box-ajustes-link:hover{opacity:1;text-decoration:underline;}
.user-box-ajustes-link.active{color:var(--gold-light);opacity:1;}
.sidebar .logout{background:none;border:none;color:var(--gold-light);font-size:.78rem;margin-top:12px;cursor:pointer;padding:0;text-align:left;}

/* ---------- Vista previa de rol (solo administrador) ---------- */
.view-as-wrap{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.15);}
.view-as-wrap label{display:block;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--gold-light);margin-bottom:5px;}
.view-as-wrap select{width:100%;padding:7px 8px;border-radius:7px;border:1px solid rgba(255,255,255,.25);background:var(--navy);color:var(--ivory);font-family:var(--font-body);font-size:.78rem;}
.view-as-banner{background:var(--gold);color:var(--navy-deep);padding:10px 16px;border-radius:10px;font-size:.82rem;font-weight:600;margin-bottom:20px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.view-as-banner a{color:var(--navy-deep);text-decoration:underline;font-weight:700;white-space:nowrap;}
.main{flex:1;padding:32px 40px;}
.main h1{font-family:var(--font-title);color:var(--navy);margin:0 0 6px;}
.main .lead{color:#555;margin:0 0 28px;}
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;}
.module-card{background:var(--white);border-radius:14px;padding:22px 20px;box-shadow:0 8px 20px rgba(0,0,0,.08);border-top:4px solid var(--gold);}
.module-card h3{font-family:var(--font-title);color:var(--navy);margin:0 0 6px;font-size:1.05rem;}
.module-card p{font-size:.85rem;color:#666;margin:0 0 12px;}
.module-card .status{display:inline-block;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:3px 9px;border-radius:20px;background:var(--ivory);color:var(--wine);}
.module-card.locked{opacity:.5;}
.module-card{display:block;text-decoration:none;transition:transform .15s ease, box-shadow .15s ease;}
.module-card.available:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(0,0,0,.14);}
.module-card .status.available{background:#eaf7ee;color:#1e6b34;}
.top-alert{background:var(--ivory);border:1px solid var(--gold);color:var(--wine);padding:10px 16px;border-radius:10px;font-size:.82rem;margin-bottom:20px;}
.back-to-dashboard{display:inline-flex;align-items:center;gap:6px;color:var(--navy);text-decoration:none;font-weight:600;font-size:.85rem;margin-bottom:18px;}
.back-to-dashboard:hover{text-decoration:underline;}

/* ---------- Tickets (Kanban) ---------- */
.tickets-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;flex-wrap:wrap;gap:12px;}
.tickets-toolbar .btn{width:auto;padding:10px 20px;margin:0;}
.readonly-note{background:var(--ivory);border:1px solid var(--gold);color:var(--wine);padding:8px 14px;border-radius:8px;font-size:.78rem;}
.tickets-board{display:flex;gap:16px;overflow-x:auto;padding-bottom:16px;align-items:flex-start;}
.tickets-col{background:rgba(8,43,76,.045);border-radius:12px;padding:14px;min-width:270px;flex:1 0 270px;transition:outline .1s ease;}
.tickets-col.dragover{outline:2px dashed var(--gold);outline-offset:-4px;}
.tickets-col h3{font-family:var(--font-title);font-size:.88rem;color:var(--navy);margin:0 0 12px;display:flex;justify-content:space-between;align-items:center;}
.tickets-col h3 .count{background:var(--navy);color:var(--white);font-size:.66rem;font-weight:700;padding:2px 9px;border-radius:20px;font-family:var(--font-body);}
.tickets-col .empty-hint{font-size:.75rem;color:#999;text-align:center;padding:14px 4px;}
.ticket-card{background:var(--white);border-radius:10px;padding:12px 14px;margin-bottom:10px;box-shadow:0 4px 10px rgba(0,0,0,.08);cursor:pointer;border-left:4px solid var(--gold);}
.ticket-card:hover{box-shadow:0 6px 16px rgba(0,0,0,.14);}
.ticket-card.dragging{opacity:.35;}
.ticket-card.tipo-acceso_credenciales{border-left-color:var(--wine);}
.ticket-card.tipo-diseno{border-left-color:var(--gold);}
.ticket-card.tipo-mantenimiento{border-left-color:var(--navy);}
.ticket-card .tag{font-size:.62rem;text-transform:uppercase;letter-spacing:.04em;font-weight:700;color:#888;margin-bottom:4px;display:block;}
.ticket-card h4{margin:0 0 5px;font-size:.86rem;color:var(--navy);line-height:1.3;}
.ticket-card .meta{font-size:.7rem;color:#888;}

/* ---------- Modal ---------- */
.modal-overlay{position:fixed;inset:0;background:rgba(5,27,50,.55);display:flex;align-items:center;justify-content:center;padding:20px;z-index:200;}
.modal-box{background:var(--white);border-radius:14px;max-width:480px;width:100%;padding:28px;max-height:88vh;overflow-y:auto;position:relative;text-align:left;}
.modal-box .modal-close{position:absolute;top:16px;right:16px;background:none;border:none;font-size:1.3rem;line-height:1;cursor:pointer;color:#999;}
.modal-box h2{font-family:var(--font-title);color:var(--navy);margin:0 22px 4px 0;font-size:1.1rem;}
.modal-meta{font-size:.75rem;color:#888;margin-bottom:16px;}
.modal-field{margin-bottom:12px;font-size:.86rem;}
.modal-field label{display:block;font-weight:700;color:var(--navy);font-size:.7rem;margin-bottom:3px;text-transform:uppercase;letter-spacing:.03em;}
.modal-field textarea{width:100%;padding:8px 10px;border-radius:8px;border:1px solid #d8d8d8;font-family:var(--font-body);font-size:.85rem;min-height:64px;}
.modal-field select{width:100%;padding:8px 10px;border-radius:8px;border:1px solid #d8d8d8;font-family:var(--font-body);font-size:.85rem;background:var(--white);}
.modal-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;border-top:1px solid #eee;padding-top:16px;}
.modal-actions button{flex:1 1 auto;min-width:120px;padding:9px 12px;margin:0;font-size:.82rem;}
.btn-secondary{background:var(--ivory);color:var(--navy);border:1px solid var(--gold);}
.btn-danger{background:var(--wine);color:var(--white);}
.btn-outline{background:transparent;border:1px solid #ccc;color:var(--navy-deep);}
.status-pill{display:inline-block;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:3px 10px;border-radius:20px;white-space:nowrap;}
.status-pill.nuevo{background:#e6f0ff;color:#1d4ed8;}
.status-pill.en_proceso{background:#fff4d6;color:#8a6100;}
.status-pill.esperando_informacion{background:#ffe4e0;color:var(--wine);}
.status-pill.resuelto{background:#eaf7ee;color:#1e6b34;}
.status-pill.pendiente{background:#fff4d6;color:#8a6100;}
.status-pill.activo{background:#eaf7ee;color:#1e6b34;}
.status-pill.inactivo{background:#ffe4e0;color:var(--wine);}

/* ---------- Gestión de Permisos ---------- */
.users-list{display:flex;flex-direction:column;gap:10px;max-width:720px;}
.user-row{background:var(--white);border-radius:10px;padding:14px 16px;box-shadow:0 4px 10px rgba(0,0,0,.06);display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.user-row-info{flex:1;min-width:180px;}
.user-row-name{font-weight:700;color:var(--navy);font-size:.9rem;}
.user-row-name .you-tag{font-weight:600;color:var(--gold);font-size:.72rem;}
.user-row-email{font-size:.76rem;color:#888;}
.user-row .btn-outline{width:auto;padding:7px 16px;margin:0;font-size:.78rem;}

/* ---------- Ajustes ---------- */
.settings-section{background:var(--white);border-radius:14px;padding:24px 26px;box-shadow:0 8px 20px rgba(0,0,0,.08);max-width:560px;margin-bottom:20px;}
.settings-section h2{font-family:var(--font-title);color:var(--navy);margin:0 0 6px;font-size:1.05rem;}
.settings-section .settings-desc{font-size:.82rem;color:#666;margin:0 0 18px;}
.font-size-options{display:flex;gap:10px;flex-wrap:wrap;}
.font-size-btn{flex:1 1 110px;background:var(--ivory);border:2px solid transparent;border-radius:10px;padding:12px 10px;cursor:pointer;text-align:center;font-family:var(--font-body);color:var(--navy);transition:border-color .15s ease, background .15s ease;}
.font-size-btn .sample{display:block;font-weight:700;margin-bottom:4px;}
.font-size-btn.small .sample{font-size:.8rem;}
.font-size-btn.normal .sample{font-size:1rem;}
.font-size-btn.large .sample{font-size:1.2rem;}
.font-size-btn.xlarge .sample{font-size:1.45rem;}
.font-size-btn .label{display:block;font-size:.72rem;font-weight:600;}
.font-size-btn:hover{background:#ffe9b0;}
.font-size-btn.active{border-color:var(--gold);background:var(--white);box-shadow:0 4px 12px rgba(217,161,46,.35);}
.settings-field{margin-bottom:14px;}
.settings-field label{display:block;font-size:.78rem;font-weight:600;color:var(--navy);margin-bottom:5px;}
.settings-field input{width:100%;padding:10px 12px;border-radius:8px;border:1px solid #d8d8d8;font-family:var(--font-body);font-size:.9rem;}
.settings-save{width:auto;padding:10px 22px;margin:6px 0 0;}
.settings-saved-msg{font-size:.78rem;color:#1e6b34;margin-top:10px;min-height:16px;}

/* ---------- Secretaría ---------- */
.secretaria-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px;flex-wrap:wrap;}
.secretaria-tabs{display:flex;gap:6px;flex-wrap:wrap;}
.secretaria-tab{background:var(--white);border:1px solid #ddd;color:var(--navy);padding:8px 16px;border-radius:20px;font-size:.8rem;font-weight:600;cursor:pointer;font-family:var(--font-body);}
.secretaria-tab:hover{background:var(--ivory);}
.secretaria-tab.active{background:var(--navy);border-color:var(--navy);color:var(--white);}
#secretariaSearch{padding:9px 14px;border-radius:20px;border:1px solid #ddd;font-family:var(--font-body);font-size:.82rem;min-width:220px;}
.secretaria-note{background:var(--ivory);border:1px solid var(--gold);color:#5a4a1e;padding:10px 16px;border-radius:10px;font-size:.8rem;margin-bottom:20px;max-width:820px;}
.secretaria-collapse{margin-bottom:24px;}
.secretaria-collapse summary{cursor:pointer;font-family:var(--font-title);color:var(--navy);font-size:1rem;font-weight:700;margin-bottom:10px;}
.secretaria-h2{font-family:var(--font-title);color:var(--navy);font-size:1rem;margin:26px 0 12px;display:flex;align-items:center;gap:8px;}
.secretaria-h2 .count{background:var(--navy);color:var(--white);font-size:.66rem;font-weight:700;padding:2px 9px;border-radius:20px;font-family:var(--font-body);}
.miembros-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-bottom:8px;}
.miembro-card{background:var(--white);border-radius:12px;padding:16px 18px;box-shadow:0 4px 10px rgba(0,0,0,.07);border-left:4px solid var(--gold);}
.miembro-card.inactivo{opacity:.55;border-left-color:#ccc;}
.miembro-nombre{font-weight:700;color:var(--navy);font-size:.92rem;}
.miembro-cargo{font-size:.78rem;color:var(--wine);font-weight:600;margin-top:2px;}
.miembro-meta{font-size:.74rem;color:#666;margin-top:8px;line-height:1.5;}
.miembro-contacto{font-size:.74rem;color:#444;margin-top:8px;}
.miembro-notas{font-size:.7rem;color:#999;margin-top:8px;font-style:italic;line-height:1.4;}