/* ================================================================
   GrupoSMV Admin — Brand Theme  (Filament v3, light only)
   Teal #15505E · Gold #B67D2A · Font DM Sans
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&display=swap');

/* ── Tokens ─────────────────────────────────────────────── */
:root {
  --smv-teal-darkest: #0C2A33;
  --smv-teal-dark:    #0F3A45;
  --smv-teal:         #15505E;
  --smv-teal-light:   #226B7D;
  --smv-gold:         #B67D2A;
  --smv-gold-light:   #D4993B;
  --smv-ivory:        #F9F6F1;
  --smv-off-white:    #F4F3EF;
  --smv-gray-100:     #EEEDE9;
  --smv-gray-200:     #E0DFD9;
  --smv-gray-600:     #65645C;
  --smv-gray-700:     #48473F;
  --smv-gray-800:     #282822;
  --smv-shadow-card:  0 2px 8px rgba(20,20,15,0.07), 0 0 0 1px rgba(20,20,15,0.04);
}

/* ── Fuente ─────────────────────────────────────────────── */
body,
.fi-body,
.fi-sidebar,
.fi-topbar,
.fi-main,
.fi-header,
.fi-section,
.fi-ta,
.fi-card,
.fi-wi,
.fi-modal-content,
.fi-dropdown-panel {
  font-family: 'DM Sans', system-ui, -apple-system, sans-serif !important;
}

/* ── Fondo principal ────────────────────────────────────── */
.fi-body {
  background-color: var(--smv-off-white) !important;
}

/* ═══════════════════════════════════════════════════════════
   LOGIN
   .fi-simple-layout  = fondo de pantalla completa
   .fi-simple-main    = tarjeta blanca del formulario
   ═══════════════════════════════════════════════════════════ */

.fi-simple-layout {
  background: linear-gradient(160deg, #0C1E26 0%, #0F3A45 45%, #15505E 100%) !important;
  min-height: 100vh !important;
}

.fi-simple-main {
  background-color: #ffffff !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 64px rgba(12,42,51,0.35) !important;
}

.fi-simple-layout .fi-logo,
.fi-simple-layout .fi-logo span {
  color: #ffffff !important;
  font-weight: 700 !important;
}

/* ═══════════════════════════════════════════════════════════
   SIDEBAR
   ═══════════════════════════════════════════════════════════ */

.fi-sidebar {
  background: linear-gradient(180deg, var(--smv-teal-dark) 0%, var(--smv-teal) 100%) !important;
  border-right: none !important;
  box-shadow: 2px 0 16px rgba(12,42,51,0.22) !important;
}

/* Header / logo */
.fi-sidebar-header {
  background-color: var(--smv-teal-darkest) !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
  box-shadow: none !important;
  ring: none !important;
}

.fi-sidebar-header a,
.fi-sidebar-header span,
.fi-sidebar-header button,
.fi-logo {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 1.05rem !important;
  letter-spacing: -0.01em !important;
}

/* Brand logo image in sidebar */
.fi-sidebar-header .fi-logo img,
.fi-brand-logo {
  display: block !important;
  filter: drop-shadow(0 1px 6px rgba(0,0,0,0.4)) !important;
  transition: opacity 150ms !important;
}
.fi-sidebar-header a:hover .fi-logo img,
.fi-sidebar-header a:hover .fi-brand-logo { opacity: 0.85 !important; }

/* Labels de grupo de navegación */
.fi-sidebar-group-label {
  color: rgba(212,153,59,0.65) !important;
  font-size: 0.65rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
}

/* Botón de cabecera de grupo (colapsable) */
.fi-sidebar .fi-sidebar-group-button {
  color: rgba(255,255,255,0.72) !important;
  border-radius: 8px !important;
}
.fi-sidebar .fi-sidebar-group-button:hover {
  background-color: rgba(255,255,255,0.09) !important;
  color: #ffffff !important;
}

/* Ítem de nav — estado base */
.fi-sidebar .fi-sidebar-item-button {
  color: rgba(255,255,255,0.72) !important;
  border-radius: 8px !important;
  transition: background 140ms ease, color 140ms ease !important;
}

/* Ítem de nav — hover y focus */
.fi-sidebar .fi-sidebar-item-button:hover,
.fi-sidebar .fi-sidebar-item-button:focus-visible {
  background-color: rgba(255,255,255,0.09) !important;
  color: #ffffff !important;
}

/* Ítem activo — fi-active está en el <li>, no en el <a> */
.fi-sidebar .fi-sidebar-item.fi-active .fi-sidebar-item-button {
  background-color: rgba(182,125,42,0.18) !important;
  color: var(--smv-gold-light) !important;
  box-shadow: inset 3px 0 0 var(--smv-gold) !important;
}

/* Iconos y labels heredan el color del botón */
.fi-sidebar .fi-sidebar-item-icon,
.fi-sidebar .fi-sidebar-group-icon {
  color: inherit !important;
}

.fi-sidebar .fi-sidebar-item-label {
  color: inherit !important;
}

/* Badge de nav (contador leads nuevos) */
.fi-sidebar-item-badge {
  background-color: var(--smv-gold) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* Botón colapsar / expandir sidebar */
.fi-sidebar-close-btn,
.fi-sidebar-toggle-btn,
.fi-sidebar [data-icon="heroicon-o-chevron-left"],
.fi-sidebar [data-icon="heroicon-o-chevron-right"] {
  color: rgba(255,255,255,0.45) !important;
}
.fi-sidebar-close-btn:hover,
.fi-sidebar-toggle-btn:hover {
  background-color: rgba(255,255,255,0.09) !important;
  color: #ffffff !important;
}

/* Scrollbar */
.fi-sidebar { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.15) transparent; }
.fi-sidebar::-webkit-scrollbar { width: 4px; }
.fi-sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 4px; }

/* ═══════════════════════════════════════════════════════════
   TOPBAR
   ═══════════════════════════════════════════════════════════ */

.fi-topbar {
  background-color: #ffffff !important;
  border-bottom: 1px solid var(--smv-gray-100) !important;
  box-shadow: 0 1px 4px rgba(20,20,15,0.06) !important;
}

/* ── Título de página ───────────────────────────────────── */
.fi-header-heading {
  color: var(--smv-gray-800) !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
}

/* ── Secciones de formulario ────────────────────────────── */
.fi-section {
  background-color: #ffffff !important;
  border: 1px solid var(--smv-gray-100) !important;
  border-radius: 12px !important;
  box-shadow: var(--smv-shadow-card) !important;
}

.fi-section-header {
  border-bottom-color: var(--smv-gray-100) !important;
}

.fi-section-header-heading {
  color: var(--smv-gray-800) !important;
  font-weight: 600 !important;
}

/* ── Tabla ──────────────────────────────────────────────── */
.fi-ta-content {
  background-color: #ffffff !important;
  border: 1px solid var(--smv-gray-100) !important;
  border-radius: 12px !important;
  box-shadow: var(--smv-shadow-card) !important;
  overflow: hidden !important;
}

.fi-ta-header-cell {
  background-color: var(--smv-ivory) !important;
  color: var(--smv-gray-600) !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

.fi-ta-row:hover .fi-ta-cell {
  background-color: var(--smv-ivory) !important;
}

/* ── Stats widgets ──────────────────────────────────────── */
.fi-wi-stats-overview-stat {
  background-color: #ffffff !important;
  border: 1px solid var(--smv-gray-100) !important;
  border-radius: 12px !important;
  box-shadow: var(--smv-shadow-card) !important;
}

.fi-wi-stats-overview-stat-label {
  color: var(--smv-gray-600) !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}

.fi-wi-stats-overview-stat-value {
  color: var(--smv-gray-800) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

/* ── Chart widget ───────────────────────────────────────── */
.fi-wi-chart {
  background-color: #ffffff !important;
  border: 1px solid var(--smv-gray-100) !important;
  border-radius: 12px !important;
  box-shadow: var(--smv-shadow-card) !important;
}

.fi-wi-chart-heading {
  color: var(--smv-gray-800) !important;
  font-weight: 600 !important;
}

/* ── Cards genéricas ────────────────────────────────────── */
.fi-card {
  background-color: #ffffff !important;
  border: 1px solid var(--smv-gray-100) !important;
  border-radius: 12px !important;
  box-shadow: var(--smv-shadow-card) !important;
}

/* ═══════════════════════════════════════════════════════════
   TIPTAP EDITOR
   ═══════════════════════════════════════════════════════════ */

/* Toolbar */
.tiptap-wrapper [role="toolbar"],
.tiptap-toolbar {
  background-color: var(--smv-ivory) !important;
  border-bottom: 1px solid var(--smv-gray-200) !important;
  border-radius: 10px 10px 0 0 !important;
  padding: 6px 8px !important;
  gap: 2px !important;
  flex-wrap: wrap !important;
}

/* Toolbar buttons */
.tiptap-toolbar button,
.tiptap-wrapper [role="toolbar"] button {
  border-radius: 6px !important;
  color: var(--smv-gray-600) !important;
  transition: background 120ms, color 120ms !important;
}

.tiptap-toolbar button:hover,
.tiptap-wrapper [role="toolbar"] button:hover {
  background-color: var(--smv-gray-200) !important;
  color: var(--smv-teal) !important;
}

.tiptap-toolbar button.is-active,
.tiptap-wrapper [role="toolbar"] button[aria-pressed="true"] {
  background-color: rgba(21, 80, 94, 0.12) !important;
  color: var(--smv-teal) !important;
}

/* Editor content area */
.tiptap-wrapper .ProseMirror,
.tiptap .ProseMirror {
  min-height: 400px !important;
  padding: 1.25rem 1.5rem !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 0.9375rem !important;
  line-height: 1.75 !important;
  color: var(--smv-gray-800) !important;
  outline: none !important;
}

/* Typography inside editor */
.tiptap .ProseMirror h2 { font-size: 1.4rem; font-weight: 700; margin: 1.5rem 0 0.5rem; color: var(--smv-teal-dark); }
.tiptap .ProseMirror h3 { font-size: 1.15rem; font-weight: 600; margin: 1.25rem 0 0.4rem; color: var(--smv-teal-dark); }
.tiptap .ProseMirror h4 { font-size: 1rem; font-weight: 600; margin: 1rem 0 0.3rem; }
.tiptap .ProseMirror p  { margin: 0.6rem 0; }
.tiptap .ProseMirror blockquote {
  border-left: 3px solid var(--smv-gold) !important;
  padding-left: 1rem !important;
  color: var(--smv-gray-600) !important;
  font-style: italic !important;
  margin: 1rem 0 !important;
}
.tiptap .ProseMirror ul, .tiptap .ProseMirror ol { padding-left: 1.5rem; margin: 0.6rem 0; }
.tiptap .ProseMirror li { margin: 0.2rem 0; }
.tiptap .ProseMirror hr { border-color: var(--smv-gray-200) !important; margin: 1.5rem 0 !important; }
.tiptap .ProseMirror code {
  background: var(--smv-gray-100) !important;
  border-radius: 4px !important;
  padding: 0.15em 0.4em !important;
  font-size: 0.875em !important;
}
.tiptap .ProseMirror pre {
  background: var(--smv-teal-darkest) !important;
  color: #e2e8f0 !important;
  border-radius: 8px !important;
  padding: 1rem 1.25rem !important;
  overflow-x: auto !important;
}

/* Editor outer border */
.tiptap-wrapper {
  border: 1px solid var(--smv-gray-200) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  box-shadow: 0 1px 3px rgba(20,20,15,0.06) !important;
  transition: border-color 150ms !important;
}
.tiptap-wrapper:focus-within {
  border-color: var(--smv-teal) !important;
  box-shadow: 0 0 0 3px rgba(21,80,94,0.12) !important;
}

/* ═══════════════════════════════════════════════════════════
   PERFIL DE USUARIO
   ═══════════════════════════════════════════════════════════ */

/* Quita el wrapper extra que Filament añade al Placeholder */
.fi-fo-placeholder:has(.smv-profile-card) {
  margin-bottom: 0 !important;
}

.smv-profile-card {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 1.75rem 2rem;
  background: linear-gradient(135deg, var(--smv-teal-darkest) 0%, var(--smv-teal) 100%);
  border-radius: 14px;
  box-shadow: 0 4px 24px rgba(12,42,51,0.25), 0 0 0 1px rgba(255,255,255,0.06) inset;
  margin-bottom: 1.5rem;
}

.smv-profile-avatar {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  flex-shrink: 0;
  border: 2.5px solid rgba(255,255,255,0.22);
  box-shadow: 0 2px 14px rgba(12,42,51,0.35);
}

.smv-profile-avatar--img {
  object-fit: cover;
}

.smv-profile-avatar--initials {
  background: rgba(255,255,255,0.13);
  color: #ffffff;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  display: flex;
  align-items: center;
  justify-content: center;
}

.smv-profile-meta {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.smv-profile-name {
  color: #ffffff;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  margin: 0;
  line-height: 1.3;
}

.smv-profile-email {
  color: rgba(255,255,255,0.55);
  font-size: 0.825rem;
  margin: 0;
}

.smv-profile-badge {
  display: inline-flex;
  align-items: center;
  margin-top: 0.4rem;
  padding: 0.2rem 0.65rem;
  background: rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.78);
  border-radius: 999px;
  font-size: 0.67rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border: 1px solid rgba(255,255,255,0.15);
  margin-right: 0.35rem;
}

.smv-profile-badge--gold {
  background: rgba(182,125,42,0.22);
  color: var(--smv-gold-light);
  border-color: rgba(182,125,42,0.32);
}