/* ============================================================
   Rhino Business Structures — Área de Cliente
   Paleta derivada del sitio público: navy #111A28 + teal #0FAF9F
   ============================================================ */

:root{
  --bg-page:        #0B1420;
  --bg-sidebar:     #0D1826;
  --bg-elevated:    #16202F;
  --bg-elevated-2:  #1B2739;
  --bg-input:       #101B2A;
  --border:         rgba(255,255,255,0.08);
  --border-strong:  rgba(255,255,255,0.16);

  --text-primary:   #EDF6F3;
  --text-secondary: #9FB3C8;
  --text-muted:     #6C7E93;
  --text-inverse:   #0B1420;

  --accent:         #0FAF9F;
  --accent-light:   #21B4A6;
  --accent-soft:    rgba(15,175,159,0.14);
  --accent-border:  rgba(15,175,159,0.55);

  --success:        #37C98F;
  --warning:         #E8B84B;
  --danger:         #E8615C;

  --radius-sm: 2px;
  --radius-md: 4px;

  --font-body: 'Roboto', sans-serif;
  --font-head: 'Noto Sans', sans-serif;
}

*{ box-sizing: border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: var(--font-body);
  background: var(--bg-page);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
}
h1,h2,h3,h4{ font-family: var(--font-head); font-weight:700; margin:0; letter-spacing:0.2px; }
p{ margin:0; }
ul{ list-style:none; margin:0; padding:0; }
a{ color: inherit; }
.hidden{ display:none !important; }

button{ font-family: inherit; cursor:pointer; }
input,select,textarea{ font-family: inherit; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 13px 28px;
  font-size: 13px;
  font-weight:500;
  text-transform: uppercase;
  letter-spacing: 1.6px;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  transition: all .18s ease;
  white-space: nowrap;
}
.btn-primary{
  background: var(--accent);
  color: #06231F;
  border-color: var(--accent);
}
.btn-primary:hover{ background: var(--accent-light); box-shadow: 0 0 0 3px var(--accent-soft); }
.btn-ghost{
  background: transparent;
  color: var(--text-primary);
  border-color: var(--border-strong);
}
.btn-ghost:hover{ border-color: var(--accent-border); color: var(--accent-light); }
.btn-block{ width:100%; }
.btn-sm{ padding: 9px 18px; font-size: 11.5px; letter-spacing: 1.2px; }
.btn-danger{ background: var(--danger); color:#fff; border-color: var(--danger); }
.btn-danger:hover{ background: #d94f4a; box-shadow: 0 0 0 3px rgba(232,97,92,0.18); }
.btn:disabled{ opacity:0.4; cursor:not-allowed; }

.link-btn{
  background:none; border:none; color: var(--accent-light);
  font-size:12px; text-transform:uppercase; letter-spacing:1px; font-weight:500;
}
.link-btn:hover{ color: var(--accent); text-decoration: underline; }

/* ============================================================
   LOGIN SCREEN
   ============================================================ */
.login-screen{
  min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  position:relative;
  overflow:hidden;
  padding: 24px;
  background:
    radial-gradient(circle at 20% 20%, rgba(15,175,159,0.10), transparent 45%),
    radial-gradient(circle at 80% 80%, rgba(15,175,159,0.07), transparent 40%),
    var(--bg-page);
}
.login-bg-grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(circle at 50% 30%, black, transparent 75%);
}
.login-card{
  position:relative;
  width:100%; max-width: 420px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 44px 40px 36px;
  box-shadow: 0 30px 60px -20px rgba(0,0,0,0.6);
}
.login-card h1{ font-size: 26px; margin-top: 22px; color:#fff; }
.login-subtitle{ color: var(--text-secondary); font-size: 14px; margin-top:10px; line-height:1.5; }
.login-form{ margin-top: 28px; display:flex; flex-direction:column; gap:16px; }
.login-note{ margin-top:18px; font-size:11.5px; color: var(--text-muted); text-align:center; line-height:1.5; }

.login-footer-link{
  display:block; width:100%; margin-top:14px; padding-top:14px;
  border-top:1px solid var(--border);
  background:none; border-left:none; border-right:none; border-bottom:none;
  color: var(--text-muted); font-size:12px; text-align:center; letter-spacing:0.3px;
}
.login-footer-link:hover{ color: var(--accent-light); }

.field-error{
  font-size:12.5px; color: var(--danger); background: rgba(232,97,92,0.1);
  border:1px solid rgba(232,97,92,0.35); border-radius: var(--radius-sm);
  padding:10px 12px; margin:0;
}

/* Brand mark */
.brand{ display:flex; align-items:center; gap:12px; }
.brand-mark{
  width:38px; height:38px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background: var(--accent);
  color:#06231F;
  font-family: var(--font-head); font-weight:800; font-size:18px;
  border-radius: var(--radius-sm);
}
.brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.brand-name{ font-family: var(--font-head); font-weight:800; font-size:16px; letter-spacing:2px; color:#fff; }
.brand-sub{ font-size:9px; letter-spacing:1.6px; color: var(--text-secondary); }
.brand-logo-img{ height:32px; width:auto; display:block; }
.login-card .brand-logo-img{ height:38px; }

/* ---------- Fields ---------- */
.field{ display:flex; flex-direction:column; gap:7px; }
.field-label{ font-size:12px; color: var(--text-secondary); text-transform:uppercase; letter-spacing:0.8px; }
.field-hint{ font-size:11.5px; color: var(--text-muted); }
.field-row{ display:flex; gap:14px; }
.field-row .field{ flex:1; }

input[type=text], input[type=email], input[type=password], input[type=file], select, textarea{
  background: var(--bg-input);
  border: 1px solid var(--border-strong);
  color: var(--text-primary);
  padding: 12px 14px;
  border-radius: var(--radius-sm);
  font-size: 14px;
  outline:none;
  transition: border-color .15s ease;
}
input:focus, select:focus, textarea:focus{ border-color: var(--accent-border); }
textarea{ resize: vertical; font-family: inherit; }

/* ============================================================
   PORTAL SHELL
   ============================================================ */
.portal-app{
  display:flex;
  min-height:100vh;
}

/* ---------- Sidebar ---------- */
.sidebar{
  width: 260px;
  flex-shrink:0;
  background: var(--bg-sidebar);
  border-right: 1px solid var(--border);
  display:flex; flex-direction:column;
  padding: 26px 20px;
  position: sticky; top:0; height:100vh;
}
.brand--sidebar{ padding: 0 4px 26px; border-bottom: 1px solid var(--border); margin-bottom: 22px; }

.nav{ display:flex; flex-direction:column; gap:4px; flex:1; }
.nav-item{
  display:flex; align-items:center; gap:12px;
  padding: 12px 14px;
  background:none; border:none;
  color: var(--text-secondary);
  font-size:13.5px; font-weight:500;
  text-align:left;
  border-radius: var(--radius-sm);
  border-left: 2px solid transparent;
  position:relative;
}
.nav-item .icon{ width:18px; height:18px; fill: currentColor; flex-shrink:0; }
.nav-item:hover{ background: var(--bg-elevated); color: var(--text-primary); }
.nav-item.active{
  background: var(--accent-soft);
  color: var(--accent-light);
  border-left-color: var(--accent);
}
.nav-badge{
  margin-left:auto;
  background: var(--accent);
  color:#06231F;
  font-size:10.5px; font-weight:700;
  padding: 2px 7px;
  border-radius: 20px;
}

.sidebar-footer{ border-top:1px solid var(--border); padding-top:18px; display:flex; flex-direction:column; gap:14px; }
.user-chip{ display:flex; align-items:center; gap:10px; }
.user-avatar{
  width:36px; height:36px; border-radius:50%;
  background: var(--bg-elevated-2);
  border: 1px solid var(--accent-border);
  color: var(--accent-light);
  display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:700; flex-shrink:0;
}
.user-info{ display:flex; flex-direction:column; overflow:hidden; }
.user-name{ font-size:13px; font-weight:500; color: var(--text-primary); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.user-company{ font-size:11px; color: var(--text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ---------- Main / Topbar ---------- */
.main-wrap{ flex:1; min-width:0; display:flex; flex-direction:column; }
.topbar{
  display:flex; align-items:center; gap:16px;
  padding: 20px 36px;
  border-bottom: 1px solid var(--border);
  position: sticky; top:0; z-index:5;
  background: rgba(11,20,32,0.85);
  backdrop-filter: blur(8px);
}
.topbar h2{ font-size:19px; color:#fff; flex:1; }
.mobile-nav-toggle{ display:none; background:none; border:none; color:#fff; }
.mobile-nav-toggle .icon{ width:22px; height:22px; fill:currentColor; }

.status-pill{
  display:inline-flex; align-items:center; gap:7px;
  font-size:11.5px; font-weight:600; letter-spacing:0.4px; text-transform:uppercase;
  padding: 7px 13px;
  border-radius: 20px;
  border:1px solid var(--border-strong);
  color: var(--text-secondary);
}
.status-pill .dot{ width:7px; height:7px; border-radius:50%; background: var(--text-muted); }
.status-pill.status-ok{ color: var(--success); border-color: rgba(55,201,143,0.35); background: rgba(55,201,143,0.08); }
.status-pill.status-ok .dot{ background: var(--success); }
.status-pill.status-warn{ color: var(--warning); border-color: rgba(232,184,75,0.35); background: rgba(232,184,75,0.08); }
.status-pill.status-warn .dot{ background: var(--warning); }
.status-pill.status-bad{ color: var(--danger); border-color: rgba(232,97,92,0.35); background: rgba(232,97,92,0.08); }
.status-pill.status-bad .dot{ background: var(--danger); }

.content{ padding: 32px 36px 60px; max-width: 1240px; width:100%; margin:0 auto; }
.section{ display:none; }
.section.active{ display:block; }

.welcome-line{ color: var(--text-secondary); font-size:15px; margin-bottom:26px; }
.welcome-line span{ color:#fff; font-weight:600; }

/* ---------- Stat cards ---------- */
.stat-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap:16px; margin-bottom:32px; }
.stat-card{
  background: var(--bg-elevated);
  border:1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 20px 22px;
  display:flex; flex-direction:column; gap:10px;
}
.stat-label{ font-size:11.5px; text-transform:uppercase; letter-spacing:0.8px; color: var(--text-muted); }
.stat-value{ font-family: var(--font-head); font-size:30px; font-weight:800; color:#fff; }
.stat-value--sm{ font-size:17px; }

/* ---------- Panels ---------- */
.dashboard-columns{ display:grid; grid-template-columns: 1fr 1fr; gap:20px; }
.panel{
  background: var(--bg-elevated);
  border:1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 22px 24px;
}
.panel--wide{ grid-column: 1 / -1; }
.panel-header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.panel-header h3{ font-size:15px; color:#fff; }
.panel-subtitle{ font-size:13px; text-transform:uppercase; letter-spacing:0.8px; color: var(--text-secondary); margin-bottom:16px; }

.mini-list{ display:flex; flex-direction:column; gap:2px; }
.mini-list li{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
  font-size:13.5px;
}
.mini-list li:last-child{ border-bottom:none; }
.mini-list .mini-title{ color: var(--text-primary); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mini-list .mini-meta{ color: var(--text-muted); font-size:12px; flex-shrink:0; }
.empty-hint{ color: var(--text-muted); font-size:13px; padding: 8px 0; }

/* ---------- Documents ---------- */
.section-toolbar{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-wrap:wrap;
  margin-bottom:22px;
}
.filter-tabs{ display:flex; gap:6px; flex-wrap:wrap; }
.filter-tab{
  background:none; border:1px solid var(--border-strong); color: var(--text-secondary);
  padding: 8px 16px; font-size:12.5px; border-radius:20px;
}
.filter-tab:hover{ color: var(--text-primary); }
.filter-tab.active{ background: var(--accent-soft); border-color: var(--accent-border); color: var(--accent-light); }

.toolbar-right{ display:flex; gap:10px; align-items:center; }
.search-input{ min-width:220px; }

.table-wrap{ background: var(--bg-elevated); border:1px solid var(--border); border-radius: var(--radius-md); overflow-x:auto; }
.doc-table{ width:100%; border-collapse:collapse; }
.llc-status-select{
  background: var(--bg-input); border:1px solid var(--border-strong); color: var(--text-primary);
  font-size:11.5px; padding:6px 8px; border-radius: var(--radius-sm); max-width:220px;
}
.doc-table th{
  text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:0.8px;
  color: var(--text-muted); padding: 14px 22px; border-bottom:1px solid var(--border);
}
.doc-table td{ padding: 15px 22px; border-bottom:1px solid var(--border); font-size:13.5px; }
.doc-table tr:last-child td{ border-bottom:none; }
.doc-table tr:hover td{ background: rgba(255,255,255,0.02); }
.doc-name{ display:flex; align-items:center; gap:10px; color:#fff; font-weight:500; }
.doc-name .icon{ width:16px; height:16px; fill: var(--accent-light); flex-shrink:0; }
.doc-cat-badge{
  font-size:11px; padding:4px 10px; border-radius:20px;
  background: var(--bg-elevated-2); color: var(--text-secondary); white-space:nowrap;
}
.doc-download{
  background:none; border:1px solid var(--border-strong); color: var(--text-secondary);
  padding:6px 14px; font-size:11px; border-radius:var(--radius-sm); text-transform:uppercase; letter-spacing:0.6px;
}
.doc-download:hover{ color: var(--accent-light); border-color: var(--accent-border); }
.empty-state{ padding: 40px; text-align:center; color: var(--text-muted); font-size:13.5px; }

/* ---------- LLC ---------- */
.llc-header-card{ display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.eyebrow{ font-size:11px; text-transform:uppercase; letter-spacing:1px; color: var(--text-muted); }
.llc-name{ font-size:22px; color:#fff; margin: 8px 0 12px; }

.llc-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:18px; }

.def-list{ display:flex; flex-direction:column; gap:0; margin:0; }
.def-list .def-row{ display:flex; justify-content:space-between; gap:16px; padding: 11px 0; border-bottom:1px solid var(--border); }
.def-list .def-row:last-child{ border-bottom:none; }
.def-list dt{ font-size:12.5px; color: var(--text-muted); }
.def-list dd{ margin:0; font-size:13.5px; color: var(--text-primary); font-weight:500; text-align:right; }

.member-list{ display:flex; flex-direction:column; gap:12px; }
.member-item{ display:flex; align-items:center; gap:12px; padding: 8px 0; border-bottom:1px solid var(--border); }
.member-item:last-child{ border-bottom:none; }
.member-avatar{
  width:34px; height:34px; border-radius:50%; background: var(--bg-elevated-2);
  color: var(--accent-light); display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700; flex-shrink:0; border:1px solid var(--border-strong);
}
.member-name{ font-size:13.5px; color:#fff; font-weight:500; }
.member-role{ font-size:12px; color: var(--text-muted); }
.member-ownership{ margin-left:auto; font-size:13px; color: var(--accent-light); font-weight:600; }

.compliance-list{ display:grid; grid-template-columns: repeat(2, 1fr); gap:12px; }
.compliance-item{
  display:flex; align-items:center; gap:12px;
  padding: 14px 16px; background: var(--bg-elevated-2); border-radius: var(--radius-sm);
  border:1px solid var(--border);
}
.compliance-icon{
  width:26px; height:26px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
}
.compliance-icon.ok{ background: rgba(55,201,143,0.15); color: var(--success); }
.compliance-icon.pending{ background: rgba(232,184,75,0.15); color: var(--warning); }
.compliance-icon .icon{ width:14px; height:14px; fill:currentColor; }
.compliance-text-title{ font-size:13px; color: var(--text-primary); font-weight:500; }
.compliance-text-sub{ font-size:11.5px; color: var(--text-muted); }

/* ---------- Formation stepper (progreso de constitución LLC) ---------- */
.formation-stepper{ display:flex; flex-direction:column; padding:0; margin:0; }
.formation-step{
  display:flex; align-items:flex-start; gap:14px;
  padding: 10px 0; position:relative;
}
.formation-step:not(:last-child)::before{
  content:''; position:absolute; left:11px; top:32px; bottom:-4px;
  width:2px; background: var(--border-strong);
}
.formation-step.done:not(:last-child)::before{ background: var(--success); }
.formation-step-dot{
  width:24px; height:24px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  border:2px solid var(--border-strong); background: var(--bg-elevated);
  font-size:12px; font-weight:700; color: var(--text-muted); z-index:1;
}
.formation-step.done .formation-step-dot{ background: var(--success); border-color: var(--success); color:#06231F; }
.formation-step.current .formation-step-dot{ background: var(--accent); border-color: var(--accent); color:#06231F; box-shadow: 0 0 0 4px var(--accent-soft); }
.formation-step-label{ font-size:13.5px; padding-top:2px; color: var(--text-muted); }
.formation-step.done .formation-step-label{ color: var(--text-secondary); }
.formation-step.current .formation-step-label{ color:#fff; font-weight:600; }
.formation-step-date{ display:block; font-size:11px; color: var(--text-muted); padding-top:1px; }

/* ---------- Tickets ---------- */
.tickets-layout{ display:grid; grid-template-columns: 360px 1fr; gap:18px; align-items:start; }
.ticket-list{ display:flex; flex-direction:column; gap:10px; }
.ticket-card{
  background: var(--bg-elevated); border:1px solid var(--border); border-radius: var(--radius-md);
  padding: 15px 17px; cursor:pointer; transition: border-color .15s ease;
}
.ticket-card:hover{ border-color: var(--border-strong); }
.ticket-card.active{ border-color: var(--accent-border); background: var(--accent-soft); }
.ticket-card-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.ticket-id{ font-size:11px; color: var(--text-muted); }
.ticket-subject{ font-size:13.5px; color:#fff; font-weight:500; margin-bottom:8px; line-height:1.4; }
.ticket-card-bottom{ display:flex; justify-content:space-between; align-items:center; }
.ticket-meta{ font-size:11px; color: var(--text-muted); }

.badge{ font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; padding:4px 9px; border-radius:20px; }
.badge-abierto{ background: rgba(232,97,92,0.15); color: var(--danger); }
.badge-enproceso{ background: rgba(232,184,75,0.15); color: var(--warning); }
.badge-resuelto{ background: rgba(55,201,143,0.15); color: var(--success); }
.badge-cerrado{ background: rgba(108,126,147,0.2); color: var(--text-muted); }
.badge-recibida{ background: rgba(232,97,92,0.15); color: var(--danger); }
.badge-enrevision{ background: rgba(232,184,75,0.15); color: var(--warning); }
.badge-resuelta{ background: rgba(55,201,143,0.15); color: var(--success); }
.badge-alta{ color: var(--danger); }
.badge-media{ color: var(--warning); }
.badge-baja{ color: var(--text-muted); }

/* ---------- Section intro / feedback ---------- */
.section-intro{ margin-bottom:20px; }
.section-intro p{ color: var(--text-secondary); font-size:13.5px; line-height:1.6; background: var(--bg-elevated); border:1px solid var(--border); border-radius: var(--radius-md); padding:14px 18px; }
.section-intro .link-btn{ font-size:inherit; text-transform:none; letter-spacing:normal; padding:0; }

.feedback-summary{
  margin: 0 24px 20px; padding: 14px 16px;
  background: var(--bg-elevated-2); border:1px solid var(--border); border-radius: var(--radius-sm);
  font-size:13px; color: var(--text-secondary); display:flex; flex-direction:column; gap:6px;
}
.feedback-summary .stars{ color: var(--warning); letter-spacing:2px; }

.radio-row{ display:flex; gap:10px; }
.radio-pill{
  display:flex; align-items:center; gap:8px;
  border:1px solid var(--border-strong); border-radius:20px; padding:9px 16px;
  font-size:13px; color: var(--text-secondary); cursor:pointer;
}
.radio-pill input{ accent-color: var(--accent); }
.radio-pill:has(input:checked){ border-color: var(--accent-border); color: var(--accent-light); background: var(--accent-soft); }

.star-rating{ display:flex; gap:4px; }
.star-rating .star{ background:none; border:none; font-size:26px; color: var(--border-strong); line-height:1; padding:0; }
.star-rating .star.filled{ color: var(--warning); }

/* ---------- Videollamada ---------- */
.videocall-intro p{ color: var(--text-secondary); font-size:14px; line-height:1.6; margin-top:8px; }
.videocall-intro h3{ font-size:17px; color:#fff; }
.videocall-disclaimer{ margin-top:10px !important; font-size:12px !important; color: var(--text-muted) !important; border-top:1px solid var(--border); padding-top:10px; }

.videocall-cta-panel{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px; padding:44px 32px; }
.videocall-cta-icon{ width:38px; height:38px; fill: var(--accent-light); margin-bottom:6px; }
.videocall-cta-panel h4{ font-size:16px; color:#fff; }
.videocall-cta-panel p{ color: var(--text-secondary); font-size:13.5px; max-width:420px; }
.videocall-cta-panel .btn{ margin-top:10px; }
.videocall-link-fallback{ margin-top:14px !important; font-size:11.5px !important; color: var(--text-muted) !important; word-break: break-all; }
.videocall-link-fallback span{ color: var(--accent-light); }

.ticket-detail{
  background: var(--bg-elevated); border:1px solid var(--border); border-radius: var(--radius-md);
  min-height: 420px; display:flex; flex-direction:column;
}
.ticket-detail-empty{ flex:1; display:flex; align-items:center; justify-content:center; color: var(--text-muted); font-size:13.5px; padding: 40px; text-align:center; }
.ticket-detail-header{ padding: 20px 24px; border-bottom:1px solid var(--border); }
.ticket-detail-header h3{ font-size:16px; color:#fff; margin-bottom:8px; }
.ticket-detail-tags{ display:flex; gap:8px; align-items:center; }
.ticket-thread{ flex:1; padding: 20px 24px; display:flex; flex-direction:column; gap:16px; overflow-y:auto; max-height: 420px; }
.thread-msg{ max-width: 80%; padding: 12px 15px; border-radius: var(--radius-md); font-size:13.5px; line-height:1.5; }
.thread-msg-meta{ font-size:11px; color: var(--text-muted); margin-bottom:5px; }
.thread-msg.from-client{ align-self:flex-end; background: var(--accent-soft); border:1px solid var(--accent-border); }
.thread-msg.from-support{ align-self:flex-start; background: var(--bg-elevated-2); border:1px solid var(--border); }
.thread-msg.from-system{ align-self:center; background:none; border:1px dashed var(--border-strong); color: var(--text-muted); font-size:12.5px; max-width:90%; text-align:center; }
.ticket-reply{ padding: 16px 24px; border-top:1px solid var(--border); display:flex; gap:10px; }
.ticket-reply textarea{ flex:1; resize:none; }

/* ---------- Modal ---------- */
.modal-backdrop{
  position:fixed; inset:0; background: rgba(4,8,14,0.7); backdrop-filter: blur(3px);
  display:flex; align-items:center; justify-content:center; z-index:100; padding:20px;
}
.modal{
  width:100%; max-width: 460px; background: var(--bg-elevated); border:1px solid var(--border-strong);
  border-radius: var(--radius-md); box-shadow: 0 30px 60px -20px rgba(0,0,0,0.7);
}
.modal-header{ display:flex; align-items:center; justify-content:space-between; padding: 20px 24px; border-bottom:1px solid var(--border); }
.modal-header h3{ font-size:16px; color:#fff; }
.modal-close{ background:none; border:none; color: var(--text-secondary); font-size:22px; line-height:1; }
.modal-close:hover{ color:#fff; }
.modal-body{ padding: 22px 24px; display:flex; flex-direction:column; gap:16px; }
.modal-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:8px; }

/* ---------- Toasts ---------- */
.toast-container{ position:fixed; bottom:24px; right:24px; display:flex; flex-direction:column; gap:10px; z-index:200; }
.toast{
  background: var(--bg-elevated-2); border:1px solid var(--accent-border); color: var(--text-primary);
  padding: 13px 18px; border-radius: var(--radius-sm); font-size:13px; box-shadow: 0 10px 30px -10px rgba(0,0,0,0.5);
  animation: toast-in .2s ease;
}
@keyframes toast-in{ from{ opacity:0; transform: translateY(8px);} to{ opacity:1; transform:translateY(0);} }

/* ---------- Admin panel ---------- */
.admin-app{ min-height:100vh; display:flex; flex-direction:column; }
.admin-header{
  display:flex; align-items:center; gap:18px;
  padding: 18px 36px; border-bottom:1px solid var(--border);
  position:sticky; top:0; z-index:5; background: rgba(11,20,32,0.9); backdrop-filter: blur(8px);
}
.admin-header-title{ display:flex; flex-direction:column; flex:1; }
.admin-header-title h2{ font-size:18px; color:#fff; }
.admin-header-sub{ font-size:12px; color: var(--text-secondary); }
.admin-app .content{ max-width:1240px; }
.admin-intro{ color: var(--text-secondary); font-size:13px; max-width:620px; line-height:1.5; }
.admin-intro code{ background: var(--bg-elevated-2); border:1px solid var(--border); border-radius:3px; padding:1px 5px; font-size:12px; color: var(--accent-light); }

.status-toggle{
  display:inline-flex; align-items:center; gap:6px;
  border:none; padding:5px 12px; border-radius:20px; font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:0.5px; cursor:pointer;
}
.status-toggle.active{ background: rgba(55,201,143,0.15); color: var(--success); }
.status-toggle.inactive{ background: rgba(108,126,147,0.2); color: var(--text-muted); }

.password-cell{ display:flex; align-items:center; gap:8px; font-family: monospace; font-size:12.5px; }
.password-reveal-btn{ background:none; border:none; color: var(--accent-light); font-size:11px; text-transform:uppercase; letter-spacing:0.5px; }
.password-reveal-btn:hover{ text-decoration:underline; }

.admin-row-actions{ display:flex; gap:8px; }

.admin-tabs{ display:flex; gap:6px; margin-bottom:24px; border-bottom:1px solid var(--border); }
.admin-tab{
  background:none; border:none; border-bottom:2px solid transparent;
  color: var(--text-secondary); font-size:13px; font-weight:500;
  padding:12px 6px; margin-right:22px;
}
.admin-tab:hover{ color: var(--text-primary); }
.admin-tab.active{ color: var(--accent-light); border-bottom-color: var(--accent); }
.admin-section.hidden{ display:none; }

.billing-cards{ display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
.billing-card{ display:flex; flex-direction:column; align-items:flex-start; }
.billing-card-head{ display:flex; justify-content:space-between; align-items:center; width:100%; margin-bottom:6px; }
.billing-amount{ font-family: var(--font-head); font-size:20px; font-weight:800; color:#fff; }

.risk-badge-cell{ display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.4px; padding:4px 10px; border-radius:20px; }

/* ---------- Solicitud de alta de LLC (resumen admin) ---------- */
.la-summary-empty{ color: var(--text-muted); font-size:13.5px; }
.la-summary-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:0 24px; margin-bottom:18px; }
.la-summary-row{ display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--border); font-size:13px; }
.la-summary-row dt{ color: var(--text-muted); }
.la-summary-row dd{ margin:0; color: var(--text-primary); font-weight:500; text-align:right; }
.la-files{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:18px; }
.la-file-badge{
  display:flex; align-items:center; gap:6px; font-size:11.5px;
  background: var(--bg-elevated-2); border:1px solid var(--border); border-radius:20px; padding:6px 12px; color: var(--text-secondary);
}
.la-names-list{ display:flex; flex-direction:column; gap:8px; margin-bottom:18px; }
.la-name-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  background: var(--bg-elevated-2); border:1px solid var(--border); border-radius: var(--radius-sm); padding:9px 14px;
}
.la-name-row.is-official{ border-color: var(--accent-border); background: var(--accent-soft); }
.la-name-text{ font-size:13px; color: var(--text-primary); }
.la-activity-box{
  background: var(--bg-elevated-2); border:1px solid var(--border); border-radius: var(--radius-sm);
  padding:12px 14px; font-size:13px; color: var(--text-secondary); line-height:1.6;
}

/* ---------- Expediente de cliente (admin) ---------- */
.client-detail-topbar-info{ display:flex; flex-direction:column; align-items:flex-end; gap:2px; }
.client-detail-topbar-info strong{ color:#fff; font-size:14px; }
.client-detail-topbar-info span{ color: var(--text-muted); font-size:12px; }
.client-detail-summary{
  display:flex; flex-wrap:wrap; gap:28px; align-items:center; margin-bottom:18px;
}
.client-detail-summary-item{ display:flex; flex-direction:column; gap:4px; }
.client-detail-summary-item .field-label{ font-size:11px; text-transform:uppercase; letter-spacing:0.6px; color: var(--text-muted); }
.client-detail-quicklinks{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:24px; }
.client-name-link{
  background:none; border:none; padding:0; margin:0; cursor:pointer; text-align:left;
  color:#fff; font-weight:500; font-size:inherit; font-family:inherit; text-decoration:underline; text-decoration-color:transparent;
}
.client-name-link:hover{ text-decoration-color: currentColor; color: var(--accent-light); }

/* ---------- Freelancer ---------- */
.freelancer-profile-card{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.freelancer-profile-avatar{
  width:44px; height:44px; border-radius:50%; flex-shrink:0;
  background: var(--accent-soft); color: var(--accent-light);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:15px;
}
.freelancer-profile-name{ color:#fff; font-weight:600; font-size:14px; }
.freelancer-profile-meta{ color: var(--text-muted); font-size:12.5px; margin-top:2px; }
.freelancer-task-desc{ color: var(--text-muted); font-size:12px; margin-top:3px; line-height:1.5; }
.freelancer-toggle-row{ display:flex; align-items:center; gap:10px; cursor:pointer; font-size:13.5px; color: var(--text-primary); margin-bottom:16px; }
.freelancer-fields{ display:flex; flex-wrap:wrap; gap:14px; }
.freelancer-fields .field{ min-width:180px; flex:1; }

/* ---------- Avisos (notificaciones internas) ---------- */
.notifications-panel{ margin-bottom:20px; }
.notifications-list{ display:flex; flex-direction:column; gap:8px; list-style:none; padding:0; margin:0; }
.notification-item{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  background: var(--bg-elevated); border:1px solid var(--border); border-radius: var(--radius-sm);
  padding:12px 14px; font-size:13px; color: var(--text-secondary);
}
.notification-item.unread{ border-color: var(--accent-border); background: var(--accent-soft); color: var(--text-primary); }
.notification-item .notification-date{ color: var(--text-muted); font-size:11.5px; white-space:nowrap; }
.notification-dismiss{ background:none; border:none; color: var(--text-muted); cursor:pointer; font-size:16px; line-height:1; padding:0 2px; }
.notification-dismiss:hover{ color: var(--text-primary); }
.payment-reminder-banner{
  background: var(--bg-elevated); border:1px solid var(--warning); border-left:4px solid var(--warning);
  border-radius: var(--radius-sm); padding:12px 16px; font-size:13px; color: var(--text-secondary); margin-bottom:20px;
}

/* ---------- Previsualización de documentos ---------- */
.upload-preview{ margin-top:4px; border:1px solid var(--border); border-radius: var(--radius-sm); overflow:hidden; background: var(--bg-elevated-2); }
.upload-preview img{ display:block; max-width:100%; max-height:260px; margin:0 auto; }
.upload-preview iframe{ width:100%; height:320px; border:none; display:block; }
.upload-preview .upload-preview-generic{ padding:16px; font-size:12.5px; color: var(--text-muted); text-align:center; }
.doc-preview-modal{ width:min(820px, 92vw); max-width:820px; max-height:88vh; overflow-y:auto; }
.doc-preview-body{ padding:0; }
.doc-preview-body img{ display:block; max-width:100%; margin:0 auto; }
.doc-preview-body iframe{ width:100%; height:72vh; border:none; display:block; }

.badge-si{ background: rgba(55,201,143,0.15); color: var(--success); }
.badge-no{ background: rgba(108,126,147,0.2); color: var(--text-muted); }
.badge-overdue{ background: rgba(232,97,92,0.18); color: var(--danger); font-weight:800; }

.report-questionnaire-preview{
  background: var(--bg-elevated-2); border:1px solid var(--border); border-radius: var(--radius-sm);
  padding:14px 16px; font-size:12.5px; color: var(--text-secondary); line-height:1.6; max-height:220px; overflow-y:auto;
}
.report-questionnaire-preview strong{ color: var(--text-primary); }
.report-questionnaire-preview .rqp-empty{ color: var(--text-muted); font-style:italic; }

/* ---------- Cuestionario (cliente) ---------- */
.questionnaire-intro-text{ color: var(--text-secondary); font-size:14px; line-height:1.6; margin-top:8px; }
.questionnaire-fields{ display:flex; flex-direction:column; gap:22px; }
.questionnaire-item{ padding-bottom:18px; border-bottom:1px solid var(--border); }
.questionnaire-item:last-child{ border-bottom:none; padding-bottom:0; }
.questionnaire-proof-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  margin-top:8px; padding:9px 12px; background: var(--bg-elevated-2); border-radius: var(--radius-sm);
}
.questionnaire-proof-hint{ font-size:12px; color: var(--text-secondary); }
.questionnaire-file-input{
  font-size:11.5px; color: var(--text-muted); max-width:210px;
  background:none; border:none; padding:0;
}
.questionnaire-file-input::file-selector-button{
  background: var(--bg-elevated); border:1px solid var(--border-strong); color: var(--text-primary);
  padding:6px 12px; border-radius: var(--radius-sm); font-size:11px; margin-right:8px; cursor:pointer;
}
.questionnaire-evidence-note{ display:block; margin-top:6px; font-size:11.5px; color: var(--accent-light); }
.questionnaire-cta-panel{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.questionnaire-cta-panel h4{ font-size:14.5px; color:#fff; margin-bottom:4px; }
.questionnaire-cta-panel p{ font-size:13px; color: var(--text-secondary); margin:0; }

/* ---------- Riesgo Fiscal ---------- */
.risk-gauge-panel{ display:flex; align-items:center; gap:32px; flex-wrap:wrap; }
.risk-gauge-wrap{ display:flex; flex-direction:column; align-items:center; flex-shrink:0; width:220px; }
.risk-gauge-readout{ display:flex; align-items:baseline; gap:4px; margin-top:-58px; }
.risk-gauge-score{ font-family: var(--font-head); font-size:40px; font-weight:800; color:#fff; }
.risk-gauge-scale{ font-size:13px; color: var(--text-muted); }
.risk-gauge-wrap .badge{ margin-top:10px; font-size:11.5px; padding:5px 14px; }
.risk-gauge-info{ flex:1; min-width:240px; }
.risk-gauge-info h3{ font-size:16px; color:#fff; margin-bottom:8px; }
.risk-gauge-info p{ font-size:13px; color: var(--text-secondary); line-height:1.6; }
.risk-gauge-month{ margin-top:8px !important; font-size:12px !important; color: var(--text-muted) !important; }

.risk-bar-row{ margin-bottom:16px; }
.risk-bar-row:last-child{ margin-bottom:0; }
.risk-bar-head{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:6px; }
.risk-bar-name{ font-size:13px; color: var(--text-primary); font-weight:500; }
.risk-bar-value{ font-size:12.5px; font-weight:700; }
.risk-bar-track{ height:10px; background: var(--bg-elevated-2); border-radius:20px; overflow:hidden; }
.risk-bar-fill{ height:100%; border-radius:20px; transition: width .3s ease; }

.risk-plan-panel{ border-left:4px solid var(--border-strong); }
.risk-plan-panel.risk-low{ border-left-color: var(--success); }
.risk-plan-panel.risk-mid{ border-left-color: var(--warning); }
.risk-plan-panel.risk-high{ border-left-color: var(--danger); }
.risk-plan-panel p{ font-size:13.5px; color: var(--text-secondary); line-height:1.6; }

.benefit-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:14px; margin-bottom:20px; }
.benefit-card{
  background: var(--bg-elevated-2); border:1px solid var(--border); border-radius: var(--radius-md);
  padding:16px 18px; display:flex; flex-direction:column; gap:8px;
}
.benefit-card--accent{ border-color: var(--accent-border); background: var(--accent-soft); }
.benefit-label{ font-size:11px; text-transform:uppercase; letter-spacing:0.6px; color: var(--text-muted); }
.benefit-value{ font-family: var(--font-head); font-size:22px; font-weight:800; color:#fff; }

.benefit-compare{ display:flex; flex-direction:column; gap:0; border-top:1px solid var(--border); }
.benefit-compare-row{
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  padding:12px 0; border-bottom:1px solid var(--border); font-size:13px; color: var(--text-secondary);
}
.benefit-compare-row strong{ color: var(--text-primary); font-family: var(--font-head); font-size:14px; }
.benefit-compare-total{ border-bottom:none; padding-top:16px; }
.benefit-compare-total strong{ color: var(--success); font-size:17px; }

.report-legal-note-dark{
  margin-top:16px !important; font-size:11.5px !important; color: var(--text-muted) !important;
  font-style:italic; border-top:1px solid var(--border); padding-top:12px; line-height:1.6;
}

/* ---------- Report doc (vista imprimible) ---------- */
.report-view{
  position:fixed; inset:0; background: var(--bg-page); z-index:300;
  overflow-y:auto; display:flex; flex-direction:column;
}
.report-view-bar{
  display:flex; justify-content:space-between; align-items:center;
  padding:16px 32px; border-bottom:1px solid var(--border);
  position:sticky; top:0; background: rgba(11,20,32,0.95); z-index:2;
}
.report-doc{
  max-width:760px; margin:0 auto; padding:48px 40px 80px; color:#1a1a1a;
  background:#fff; width:100%; box-sizing:border-box;
  font-family: var(--font-body);
}
.report-doc-band{
  margin: -48px -40px 24px;
  padding: 22px 40px;
  background:#111A28;
  print-color-adjust: exact; -webkit-print-color-adjust: exact;
}
.report-doc-logo{ height:30px; width:auto; display:block; }
.report-doc-header{ border-bottom:2px solid #111A28; padding-bottom:20px; margin-bottom:28px; }
.report-doc-header h1{ font-size:19px; margin:0 0 4px; color:#111A28; font-family: var(--font-head); font-weight:800; }
.report-doc-header p{ margin:0; font-size:13px; color:#4a5568; }
.report-doc-confidential{ margin-top:8px !important; font-size:10.5px !important; text-transform:uppercase; letter-spacing:0.5px; color:#9c4221 !important; }
.report-doc section{ margin-bottom:26px; break-inside: avoid-page; }
.report-doc h2{ font-size:15px; color:#111A28; margin:0 0 10px; font-family: var(--font-head); }
.report-doc h3{ font-size:13.5px; color:#111A28; margin:0 0 6px; font-family: var(--font-head); }
.report-doc p, .report-doc li{ font-size:13px; line-height:1.7; color:#2d3748; }
.report-doc ul, .report-doc ol{ padding-left:20px; margin:0; }
.report-doc li{ margin-bottom:6px; }
.report-doc .report-warning{ color:#9c4221; background:#fffaf0; border:1px solid #fbd38d; padding:10px 14px; border-radius:4px; font-size:12.5px; margin-top:10px; }
.report-doc-footer{ border-top:1px solid #e2e8f0; padding-top:16px; margin-top:36px; }
.report-doc-footer p{ font-size:11px; color:#718096; line-height:1.6; }

.report-doc-toc{
  background:#f7fafc; border:1px solid #e2e8f0; border-radius:6px;
  padding:18px 24px; margin-bottom:32px;
}
.report-doc-toc strong{ display:block; font-size:12px; text-transform:uppercase; letter-spacing:0.6px; color:#111A28; margin-bottom:8px; }
.report-doc-toc ol{ font-size:12.5px; color:#4a5568; padding-left:18px; }
.report-doc-toc ol ol{ margin-top:2px; margin-bottom:6px; font-size:11.5px; color:#718096; }
.report-doc-toc li{ margin-bottom:4px; }

.report-legal-note{ font-size:11.5px !important; color:#718096 !important; font-style:italic; border-left:3px solid #e2e8f0; padding-left:12px; margin-top:8px !important; }

.report-criteria-list li{ margin-bottom:10px; }

.report-transcript-box{
  background:#f7fafc; border:1px solid #e2e8f0; border-radius:6px;
  padding:16px 18px; font-size:12.5px; line-height:1.7; color:#2d3748;
}

.report-group{ margin-bottom:20px; break-inside: avoid-page; }
.report-group:last-child{ margin-bottom:0; }
.report-group-intro{ font-size:12px !important; color:#718096 !important; font-style:italic; margin-bottom:8px !important; }
.report-item-missing{ color:#a0aec0 !important; }
.report-item-missing strong{ color:#718096; }

.report-exhibit-table, .report-score-table{
  width:100%; border-collapse:collapse; font-size:12.5px; margin-top:6px;
}
.report-exhibit-table th, .report-score-table th{
  text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:0.5px;
  color:#718096; border-bottom:2px solid #111A28; padding:8px 10px;
}
.report-exhibit-table td, .report-score-table td{
  border-bottom:1px solid #e2e8f0; padding:9px 10px; color:#2d3748; vertical-align:top;
}
.report-score-total td{ border-top:2px solid #111A28; border-bottom:none; padding-top:12px; }

.score-pill{
  display:inline-block; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.4px;
  padding:3px 10px; border-radius:20px;
}
.score-pill.score-ok{ background:#e6fffa; color:#0e6b5f; }
.score-pill.score-mid{ background:#fffaf0; color:#9c4221; }
.score-pill.score-low{ background:#fff5f5; color:#c53030; }

@media print{
  body *{ visibility:hidden; }
  #report-view, #report-view *{ visibility:visible; }
  #report-view{ position:absolute; inset:0; background:#fff; }
  .no-print{ display:none !important; }
  .report-doc{ max-width:100%; }
  .report-doc section, .report-group{ break-inside: avoid-page; }
  .report-doc-toc{ break-after: page; }
}

/* ---------- Responsive ---------- */
@media (max-width: 980px){
  .stat-grid{ grid-template-columns: repeat(2,1fr); }
  .dashboard-columns{ grid-template-columns: 1fr; }
  .llc-grid{ grid-template-columns: 1fr; }
  .tickets-layout{ grid-template-columns: 1fr; }
  .compliance-list{ grid-template-columns: 1fr; }
  .benefit-grid{ grid-template-columns: 1fr; }
  .billing-cards{ grid-template-columns: 1fr; }
  .risk-gauge-panel{ flex-direction:column; text-align:center; }
}
@media (max-width: 760px){
  .sidebar{
    position:fixed; z-index:50; left:-270px; top:0; bottom:0;
    transition: left .2s ease;
    box-shadow: 20px 0 40px rgba(0,0,0,0.4);
  }
  .sidebar.open{ left:0; }
  .mobile-nav-toggle{ display:flex; align-items:center; }
  .content{ padding: 24px 18px 60px; }
  .topbar{ padding: 16px 18px; }
  .section-toolbar{ flex-direction:column; align-items:stretch; }
  .toolbar-right{ flex-direction:column; align-items:stretch; }
  .search-input{ min-width:0; }
}