/* =====================================================================================
   TeOsMa Conta - Tema de marca (un solo archivo)
   Para cambiar la identidad (colores, tipografía) edite SOLO las variables --bc-* de abajo.
   Se carga DESPUÉS de Bootstrap y reemplaza sus colores por los de la marca.
   ===================================================================================== */

:root,
[data-bs-theme="light"] {
  /* Paleta de marca */
  --bc-primary:        #14543F;   /* Jade (acción principal) */
  --bc-primary-rgb:    20, 84, 63;
  --bc-primary-hover:  #0B3D2E;
  --bc-primary-active: #082E22;
  --bc-primary-tint:   #E3F4EC;   /* fondos suaves */
  --bc-navy:           #0B3D2E;   /* Jade profundo (barra superior, encabezados) */
  --bc-navy-2:         #14543F;
  --bc-accent:         #FF8A1F;   /* Naranja Impulso (acento / alertas) */
  --bc-accent-rgb:     255, 138, 31;
  --bc-accent-hover:   #E6760A;
  --bc-ink:            #1B2B25;   /* texto principal */
  --bc-muted:          #3E5A4E;   /* texto secundario */
  --bc-app-bg:         #F4F8F5;   /* fondo de la aplicación */
  --bc-surface:        #FFFFFF;
  --bc-line:           #D9E4DE;

  /* Tipografía: Manrope para títulos (si carga) y la del sistema para el resto */
  --bc-font-title: 'Sora', 'Manrope', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
  --bc-font-body:  'Manrope', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;

  /* Bootstrap -> marca */
  --bs-primary: var(--bc-primary);
  --bs-primary-rgb: var(--bc-primary-rgb);
  --bs-link-color: var(--bc-primary);
  --bs-link-color-rgb: var(--bc-primary-rgb);
  --bs-link-hover-color: var(--bc-primary-hover);
  --bs-link-hover-color-rgb: 11, 61, 46;
  --bs-body-bg: var(--bc-app-bg);
  --bs-body-color: var(--bc-ink);
  --bs-body-font-family: var(--bc-font-body);
  --bs-border-color: var(--bc-line);
  --bs-primary-bg-subtle: var(--bc-primary-tint);
  --bs-primary-border-subtle: #BFE3D3;
  --bs-primary-text-emphasis: #082E22;
  --bs-focus-ring-color: rgba(var(--bc-primary-rgb), .25);
}

[data-bs-theme="dark"] {
  --bc-primary:        #1B8F69;
  --bc-primary-rgb:    27, 143, 105;
  --bc-primary-hover:  #22A57A;
  --bc-primary-active: #2BBA8B;
  --bc-primary-tint:   #173F31;
  --bc-navy:           #06261C;
  --bc-navy-2:         #0C3A2B;
  --bc-ink:            #E4F0EA;
  --bc-muted:          #9DB8AB;
  --bc-app-bg:         #0C1A15;
  --bc-surface:        #13261E;
  --bc-line:           #24443A;
  --bs-primary: #3FD0A0;             /* como TEXTO/enlace sobre fondo oscuro */
  --bs-primary-rgb: 63, 208, 160;
  --bs-link-color: #3FD0A0;
  --bs-link-color-rgb: 63, 208, 160;
  --bs-link-hover-color: #7BE3C0;
  --bs-link-hover-color-rgb: 123, 227, 192;
  --bs-body-bg: var(--bc-app-bg);
  --bs-body-color: var(--bc-ink);
  --bs-primary-bg-subtle: var(--bc-primary-tint);
  --bs-primary-border-subtle: #1E6B52;
  --bs-primary-text-emphasis: #7BE3C0;
}

body {
  background-color: var(--bc-app-bg);
  font-family: var(--bc-font-body);
  color: var(--bc-ink);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .modal-title, .offcanvas-title { font-family: var(--bc-font-title); letter-spacing: -.01em; }

/* Cifras alineadas: en contabilidad los números deben tener el mismo ancho */
.table td, .table th, .form-control[type="number"], .text-end, .badge { font-variant-numeric: tabular-nums; }

/* ---------- Botones ---------- */
.btn-primary {
  --bs-btn-color: #fff; --bs-btn-bg: var(--bc-primary); --bs-btn-border-color: var(--bc-primary);
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--bc-primary-hover); --bs-btn-hover-border-color: var(--bc-primary-hover);
  --bs-btn-focus-shadow-rgb: var(--bc-primary-rgb);
  --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--bc-primary-active); --bs-btn-active-border-color: var(--bc-primary-active);
  --bs-btn-disabled-color: #fff; --bs-btn-disabled-bg: var(--bc-primary); --bs-btn-disabled-border-color: var(--bc-primary);
}
.btn-outline-primary {
  --bs-btn-color: var(--bc-primary); --bs-btn-border-color: var(--bc-primary);
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--bc-primary); --bs-btn-hover-border-color: var(--bc-primary);
  --bs-btn-focus-shadow-rgb: var(--bc-primary-rgb);
  --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--bc-primary-hover); --bs-btn-active-border-color: var(--bc-primary-hover);
  --bs-btn-disabled-color: var(--bc-primary); --bs-btn-disabled-border-color: var(--bc-primary);
}
[data-bs-theme="dark"] .btn-outline-primary { --bs-btn-color: #3FD0A0; --bs-btn-border-color: #2E9A76; --bs-btn-hover-bg: var(--bc-primary); --bs-btn-hover-border-color: var(--bc-primary); }
.btn { border-radius: 8px; }
.btn-sm { border-radius: 7px; }

/* ---------- Formularios ---------- */
.form-control:focus, .form-select:focus, .form-check-input:focus {
  border-color: var(--bc-primary); box-shadow: 0 0 0 .22rem rgba(var(--bc-primary-rgb), .22);
}
.form-check-input:checked { background-color: var(--bc-primary); border-color: var(--bc-primary); }
.form-range::-webkit-slider-thumb { background: var(--bc-primary); }
.form-control, .form-select { border-radius: 8px; }
.input-group-text { background: var(--bc-primary-tint); color: var(--bc-primary); border-color: var(--bc-line); }
[data-bs-theme="dark"] .input-group-text { color: #3FD0A0; }

/* ---------- Tarjetas, tablas, modales ---------- */
.card { border-radius: 12px; border-color: var(--bc-line); background-color: var(--bc-surface); box-shadow: 0 1px 2px rgba(11, 61, 46, .06); }
.card-header { background-color: var(--bc-primary-tint); border-bottom-color: var(--bc-line); font-family: var(--bc-font-title); font-weight: 700; }
.table { --bs-table-bg: transparent; }
.table > thead th { color: var(--bc-navy); font-weight: 700; }
[data-bs-theme="dark"] .table > thead th { color: var(--bc-ink); }
/* Encabezado oscuro (table-dark): texto blanco; sin esto el color navy de arriba lo dejaba invisible */
.table > thead.table-dark th, .table > thead.table-dark td, .table > .table-dark th, thead.table-dark > tr > th { color: #fff; }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: var(--bc-primary-tint); background-color: var(--bc-primary-tint); }
.table-dark, .table-dark > :not(caption) > * > * { --bs-table-bg: var(--bc-navy); --bs-table-border-color: var(--bc-navy-2); }
.table-light, .table-light > :not(caption) > * > * { --bs-table-bg: var(--bc-primary-tint); --bs-table-color: var(--bc-ink); }
.modal-content { border-radius: 14px; background-color: var(--bc-surface); }
.modal-header.bg-primary, .modal-header.bg-dark { background: linear-gradient(135deg, var(--bc-navy) 0%, var(--bc-primary) 100%) !important; color: #fff; }
.modal-header .btn-close-white { filter: invert(1) grayscale(100%) brightness(200%); }
.badge.bg-primary { background-color: var(--bc-primary) !important; color: #fff; }
.bg-primary { background-color: var(--bc-primary) !important; }
.text-primary { color: var(--bc-primary) !important; }
[data-bs-theme="dark"] .text-primary { color: #3FD0A0 !important; }
.border-primary { border-color: var(--bc-primary) !important; }
.nav-pills .nav-link.active, .page-item.active .page-link, .list-group-item.active { background-color: var(--bc-primary); border-color: var(--bc-primary); color: #fff; }
.page-link { color: var(--bc-primary); }
.progress-bar { background-color: var(--bc-primary); }
.alert-info { --bs-alert-color: #082E22; --bs-alert-bg: var(--bc-primary-tint); --bs-alert-border-color: #BFE3D3; }
[data-bs-theme="dark"] .alert-info { --bs-alert-color: #CFEFE1; --bs-alert-border-color: #1E6B52; }

/* ---------- Barra superior ---------- */
.navbar-custom {
  background: linear-gradient(90deg, var(--bc-navy) 0%, var(--bc-navy-2) 100%) !important;
  border-bottom: 3px solid var(--bc-accent);
}
.navbar-custom .navbar-brand { display: flex; align-items: center; gap: .6rem; padding: 0; }
.navbar-custom .navbar-brand img { height: 34px; width: auto; display: block; }
.marca-descriptor { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.72); border-left: 1px solid rgba(255,255,255,.28); padding-left: .6rem; line-height: 1.15; font-weight: 600; }
@media (max-width: 991px) { .marca-descriptor { display: none; } }

/* ---------- Menú lateral ---------- */
.sidebar-light { background-color: var(--bc-surface) !important; border-right: 1px solid var(--bc-line) !important; }
.sidebar-light .offcanvas-header { background: linear-gradient(135deg, var(--bc-navy), var(--bc-primary)) !important; border-bottom: 3px solid var(--bc-accent) !important; }
.sidebar-light .offcanvas-header .offcanvas-title, .sidebar-light .offcanvas-header .offcanvas-title i { color: #fff !important; }
.sidebar-light .offcanvas-header .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
.sidebar-light .accordion-button { background-color: var(--bc-surface); color: var(--bc-ink) !important; }
.sidebar-light .accordion-button:not(.collapsed) { background-color: var(--bc-primary-tint) !important; color: var(--bc-primary) !important; box-shadow: none; border-left: 3px solid var(--bc-accent); }
.sidebar-light .list-group-item-action { color: var(--bc-ink) !important; background-color: transparent; }
.sidebar-light .list-group-item-action:hover { background-color: var(--bc-primary-tint) !important; color: var(--bc-primary) !important; }
.sidebar-light .list-group-item-action.active { background-color: var(--bc-primary) !important; color: #fff !important; }
[data-bs-theme="dark"] .sidebar-light .accordion-button:not(.collapsed), [data-bs-theme="dark"] .sidebar-light .list-group-item-action:hover { color: #7BE3C0 !important; }

/* ---------- Inicio de sesión y elección de empresa ---------- */
body.bg-login-screen {
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(var(--bc-accent-rgb), .16), transparent 60%),
    radial-gradient(900px 700px at -10% 110%, rgba(var(--bc-primary-rgb), .55), transparent 60%),
    linear-gradient(135deg, #06261C 0%, var(--bc-navy) 45%, #10503B 100%) !important;
}
#modalLogin .modal-header, #modalSeleccionEmpresaInicial .modal-header { background: linear-gradient(135deg, var(--bc-navy) 0%, var(--bc-primary) 100%) !important; border-bottom: 3px solid var(--bc-accent); }
.login-marca { text-align: center; padding: 1.4rem 1rem 1.1rem; background: linear-gradient(135deg, var(--bc-navy) 0%, #10503B 100%); border-bottom: 3px solid var(--bc-accent); }
.login-marca img { height: 52px; width: auto; }
.login-marca .login-lema { color: rgba(255,255,255,.78); font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; margin-top: .55rem; font-weight: 600; }
#modalSeleccionEmpresaInicial .list-group-item:hover { background-color: var(--bc-primary-tint); border-left: 3px solid var(--bc-accent); }

/* ---------- Impresión: la marca aparece discreta en el pie de cada reporte ---------- */
.marca-pie-impresion { display: flex; align-items: center; gap: .4rem; }
.marca-pie-impresion img { height: 14px; width: auto; }
@media print {
  .navbar-custom { display: none !important; }
  .card-header, .table-light { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Botones planos (sin degradados heredados de otros temas) */
.btn-primary, .btn-outline-primary, .btn-warning, .btn-success, .btn-danger, .btn-secondary, .btn-info { background-image: none; }

/* ---------- Modo oscuro: clases de Bootstrap que traen colores fijos ---------- */
[data-bs-theme="dark"] .bg-white, [data-bs-theme="dark"] .bg-light { background-color: var(--bc-surface) !important; color: var(--bc-ink) !important; }
[data-bs-theme="dark"] .text-dark { color: var(--bc-ink) !important; }
[data-bs-theme="dark"] .text-muted, [data-bs-theme="dark"] .text-secondary { color: var(--bc-muted) !important; }
[data-bs-theme="dark"] .border-dark { border-color: var(--bc-line) !important; }
[data-bs-theme="dark"] .modal-body, [data-bs-theme="dark"] .modal-footer { background-color: var(--bc-surface); }
[data-bs-theme="dark"] .table-secondary, [data-bs-theme="dark"] .table-secondary > :not(caption) > * > * { --bs-table-bg: #1A3328; --bs-table-color: var(--bc-ink); --bs-table-border-color: var(--bc-line); color: var(--bc-ink); }
[data-bs-theme="dark"] .table-light, [data-bs-theme="dark"] .table-light > :not(caption) > * > * { --bs-table-bg: #173F31; --bs-table-color: var(--bc-ink); --bs-table-border-color: var(--bc-line); color: var(--bc-ink); }

/* ---------- Barra superior que se oculta al bajar y reaparece al subir ---------- */
.navbar-custom { position: sticky; top: 0; z-index: 1030; transition: transform .25s ease; }
.navbar-custom.barra-oculta { transform: translateY(-100%); }

/* ---------- Inicio de sesión en dos paneles (como en la propuesta de identidad) ---------- */
#modalLogin .login-split { max-width: 960px; }
#modalLogin .modal-content { background: #F4F8F5; }
.login-grid { display: flex; min-height: 560px; }
.login-lado-marca { flex: 1 1 0; background: #0B3D2E; padding: 44px; display: flex; flex-direction: column; justify-content: space-between; gap: 28px; }
.login-lado-marca .login-logo { height: 46px; width: auto; align-self: flex-start; }
.login-titular { font-family: var(--bc-font-title); font-weight: 700; font-size: 2.1rem; line-height: 1.15; color: #fff; margin-bottom: 14px; }
.login-sub { font-size: 1.05rem; color: #CFE9DF; }
.login-pie { font-size: .82rem; color: #CFE9DF; }
.login-lado-form { flex: 1 1 0; background: #F4F8F5; padding: 44px; display: flex; flex-direction: column; justify-content: center; }
.login-form-wrap { width: 100%; }
.login-h { font-family: var(--bc-font-title); font-weight: 700; font-size: 1.75rem; color: #0B3D2E; }
.btn-login { background: #FF8A1F; border-color: #FF8A1F; color: #0B3D2E; border-radius: 10px; height: 48px; }
.btn-login:hover, .btn-login:focus { background: #E6760A; border-color: #E6760A; color: #0B3D2E; }
@media (max-width: 767px) { .login-lado-marca { display: none; } .login-grid { min-height: 0; } .login-lado-form { padding: 28px 22px; } }
[data-bs-theme="dark"] #modalLogin .modal-content, [data-bs-theme="dark"] .login-lado-form { background: #F4F8F5; color: #1B2B25; }

/* Barra superior: botón Menú sutil y descriptor en una sola línea */
.navbar-custom .btn-outline-light { --bs-btn-border-color: rgba(255,255,255,.38); --bs-btn-hover-bg: rgba(255,255,255,.12); --bs-btn-hover-color: #fff; --bs-btn-hover-border-color: rgba(255,255,255,.65); --bs-btn-active-bg: rgba(255,255,255,.2); --bs-btn-active-color: #fff; border-radius: 10px; }
.marca-descriptor { white-space: nowrap; }


/* Menú lateral: secciones desplegables (Contabilidad, Impuestos, Operación de la empresa, Administración) */
.menu-seccion-titulo { display: flex; justify-content: space-between; align-items: center; width: 100%; background: none; border: 0;
  padding: .75rem 1rem .3rem; font-size: .68rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--bs-secondary-color, #6c757d); cursor: pointer; }
.menu-seccion-titulo:hover { color: var(--bc-primary, #14543F); }
.menu-seccion-titulo span { white-space: nowrap; }
.menu-seccion-titulo i { transition: transform .2s ease; font-size: .75rem; }
.menu-seccion.cerrada .menu-seccion-titulo i { transform: rotate(-90deg); }
.menu-seccion.cerrada .menu-seccion-cuerpo { display: none; }

/* Parche 54: elementos ocultos por permiso del usuario */
.perm-oculto { display: none !important; }

/* Parche 54: modo compacto y avisos */
html.modo-compacto { font-size: 13.5px; }
html.modo-compacto .table > :not(caption) > * > * { padding: .3rem .45rem; }
html.modo-compacto .btn:not(.btn-sm) { padding: .3rem .7rem; }
html.modo-compacto .form-control, html.modo-compacto .form-select { padding-top: .3rem; padding-bottom: .3rem; }
.teosma-densidad { position: fixed; right: 12px; bottom: 10px; z-index: 1030; background: rgba(255,255,255,.92); border: 1px solid var(--bc-line, #D9E4DE); border-radius: 8px; padding: 3px 8px; display: flex; align-items: center; }
.teosma-densidad .btn.active { background: var(--bc-primary, #14543F); color: #fff; border-color: var(--bc-primary, #14543F); }
body.modo-login .teosma-densidad { display: none; }
.aviso-conexion { position: fixed; top: 0; left: 0; right: 0; z-index: 2000; background: #FF8A1F; color: #1B2B25; font-weight: 700; text-align: center; padding: 8px 16px; font-size: 14px; }
.aviso-conexion.ok { background: #17A673; color: #fff; }
@media print { .teosma-densidad, .aviso-conexion { display: none !important; } }