/* Intranet con el estilo de as4u.ai (Inter, azul → cian, tarjetas redondeadas). Se carga después de adminlte.min.css y style.css. */
:root {
    --as4u-azul: #1247d3;
    --as4u-cian: #22cde9;
    --as4u-degradat: linear-gradient(135deg, #1247d3 0%, #22cde9 100%);
    --as4u-fosc: linear-gradient(180deg, #0a1a3d 0%, #10285c 55%, #12405f 100%);
    --as4u-fons: #f4f6fb;
    --as4u-vora: #e2e8f0;
    --as4u-text: #0f172a;
    --as4u-suau: #64748b;
    --as4u-ombra: 0 2px 8px -2px rgba(18, 71, 211, .10), 0 1px 2px rgba(15, 23, 42, .04);
}

body, .tooltip, .popover { font-family: Inter, "Source Sans Pro", system-ui, -apple-system, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
body { color: var(--as4u-text); }
.content-wrapper { background: var(--as4u-fons); }
.content-header h1 { font-weight: 700; letter-spacing: -.02em; font-size: 1.75rem; }
a { color: var(--as4u-azul); }

/* barra superior */
.main-header.navbar { background: #fff; border-bottom: 1px solid var(--as4u-vora); box-shadow: none; }
.main-header .nav-link { color: var(--as4u-suau); }

/* menú lateral oscuro, como la cabecera de as4u.ai */
.main-sidebar { background: var(--as4u-fosc); }
.main-sidebar .brand-link { background: transparent !important; border-bottom: 1px solid rgba(255, 255, 255, .08) !important; color: #fff; }
.main-sidebar .brand-link .brand-text { font-weight: 700 !important; letter-spacing: -.01em; color: #fff !important; }
.main-sidebar .brand-link .brand-image { opacity: 1 !important; box-shadow: none !important; }
.main-sidebar .nav-sidebar .nav-link { color: rgba(255, 255, 255, .72); border-radius: 10px; margin: 2px 8px; width: calc(100% - 16px); transition: background .15s, color .15s; }
.main-sidebar .nav-sidebar .nav-link .nav-icon { color: rgba(255, 255, 255, .55); }
.main-sidebar .nav-sidebar .nav-link:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.main-sidebar .nav-sidebar .nav-link.active,
.main-sidebar .nav-sidebar > .nav-item > .nav-link.active { background: var(--as4u-degradat) !important; color: #fff !important; box-shadow: 0 6px 16px -6px rgba(34, 205, 233, .55); }
.main-sidebar .nav-sidebar .nav-link.active .nav-icon { color: #fff; }
/* al pasar el ratón o con el submenú abierto: fondo un poco más claro y texto blanco (AdminLTE los pone oscuros) */
.main-sidebar .nav-sidebar .nav-link:not(.active):hover,
.main-sidebar .nav-sidebar .nav-link:not(.active):focus,
.main-sidebar .nav-sidebar > .nav-item.menu-open > .nav-link:not(.active),
.main-sidebar .nav-sidebar > .nav-item:hover > .nav-link:not(.active) { background: rgba(255, 255, 255, .10) !important; color: #fff !important; }
.main-sidebar .nav-sidebar .nav-link:not(.active):hover .nav-icon,
.main-sidebar .nav-sidebar > .nav-item.menu-open > .nav-link:not(.active) .nav-icon { color: #fff !important; }
.main-sidebar .nav-sidebar .nav-link p { color: inherit !important; }
.main-sidebar .nav-treeview { background: transparent !important; }
.main-sidebar .nav-treeview .nav-link { padding-left: 1.6rem; font-size: .93rem; color: rgba(255, 255, 255, .72) !important; border-left: 0 !important; }
.main-sidebar .nav-treeview .nav-link .nav-icon { color: rgba(255, 255, 255, .45) !important; font-size: .8rem; }
.main-sidebar .user-panel { border-bottom-color: rgba(255, 255, 255, .08); }

/* tarjetas */
.card { border: 1px solid var(--as4u-vora); border-radius: 14px; box-shadow: var(--as4u-ombra); }
.card > .card-header { background: #fff; border-bottom: 1px solid var(--as4u-vora); border-radius: 14px 14px 0 0; padding: .9rem 1.25rem; }
.card > .card-header .card-title { font-weight: 600; font-size: 1.05rem; }
.card-primary:not(.card-outline) > .card-header,
.card-secondary:not(.card-outline) > .card-header { background: var(--as4u-degradat); border-bottom: 0; color: #fff; }
.card-primary:not(.card-outline) > .card-header .btn-tool,
.card-secondary:not(.card-outline) > .card-header .btn-tool { color: rgba(255, 255, 255, .85); }
.card-outline.card-primary { border-top: 3px solid var(--as4u-azul); }
.card-footer { background: #fafbfd; border-top: 1px solid var(--as4u-vora); border-radius: 0 0 14px 14px; }
.card-body h5 { font-weight: 600; font-size: 1.02rem; }

/* formularios */
.form-control, .custom-select { border-color: var(--as4u-vora); border-radius: 9px; height: calc(2.4rem + 2px); }
textarea.form-control { height: auto; }
.form-control:focus, .custom-select:focus { border-color: var(--as4u-azul); box-shadow: 0 0 0 3px rgba(18, 71, 211, .14); }
.input-group-text { background: #f8fafc; border-color: var(--as4u-vora); color: var(--as4u-suau); }
.input-group > .input-group-prepend > .input-group-text { border-radius: 9px 0 0 9px; }
.input-group > .form-control:not(:first-child) { border-radius: 0 9px 9px 0; }
.input-group > .form-control:not(:last-child) { border-radius: 9px 0 0 9px; }
.input-group-append > .btn { border-radius: 0 9px 9px 0; }
.form-group label { font-weight: 500; font-size: .93rem; }
.custom-control-input:checked ~ .custom-control-label::before { background: var(--as4u-azul); border-color: var(--as4u-azul); }
.custom-switch .custom-control-label { cursor: pointer; }

/* botones */
.btn { border-radius: 9px; font-weight: 500; }
.btn-primary { background: var(--as4u-degradat); border: 0; box-shadow: 0 6px 16px -8px rgba(18, 71, 211, .6); }
.btn-primary:hover, .btn-primary:focus { background: var(--as4u-degradat); filter: brightness(1.06); }
.btn-outline-secondary { border-color: var(--as4u-vora); color: var(--as4u-text); background: #fff; }
.btn-outline-secondary:hover { background: #f1f5f9; color: var(--as4u-text); border-color: #cbd5e1; }
.btn-default { background: #fff; border-color: var(--as4u-vora); }
.btn-warning { background: #fff4d6; border-color: #fde68a; color: #b45309; }
.btn-warning:hover, .btn-warning:focus { background: #fde68a; border-color: #fcd34d; color: #92400e; }
.btn-success { background: #10b981; border-color: #10b981; }
.btn-danger { background: #fff; border-color: #fecaca; color: #dc2626; }
.btn-danger:hover, .btn-danger:focus { background: #fef2f2; border-color: #fca5a5; color: #b91c1c; }
.table .btn .fa-2x { font-size: 1.15em; }
.page-item.active .page-link { background: var(--as4u-azul); border-color: var(--as4u-azul); }
.page-link { color: var(--as4u-azul); }

/* etiquetas */
.badge { border-radius: 99px; font-weight: 600; padding: .35em .7em; }
.badge-success { background: #d1fae5; color: #047857; }
.badge-warning { background: #fef3c7; color: #b45309; }
.badge-danger { background: #fee2e2; color: #b91c1c; }
.badge-info { background: #cffafe; color: #0e7490; }
.badge-primary { background: #dbeafe; color: #1d4ed8; }
.badge-secondary { background: #f1f5f9; color: #475569; }
.badge-light { background: #f8fafc; color: #475569; border: 1px solid var(--as4u-vora); }

/* tablas */
.table thead th { border-top: 0; border-bottom: 1px solid var(--as4u-vora); color: var(--as4u-suau); font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.table td { border-top-color: #eef2f7; vertical-align: middle; }
.table-striped tbody tr:nth-of-type(odd) { background: #fafbfd; }
.table-hover tbody tr:hover { background: #f1f6ff; }

/* avisos */
.alert { border: 0; border-radius: 12px; box-shadow: var(--as4u-ombra); }
.callout { border-radius: 12px; box-shadow: var(--as4u-ombra); border-left-width: 4px; }
.callout.callout-info { border-left-color: var(--as4u-cian); }
.callout.callout-primary { border-left-color: var(--as4u-azul); }
.info-box { border-radius: 12px; box-shadow: var(--as4u-ombra); border: 1px solid var(--as4u-vora); min-height: 76px; }
.info-box .info-box-icon { border-radius: 10px; }
.info-box .info-box-icon.bg-as4u { background: var(--as4u-degradat); color: #fff; }
.progress { border-radius: 99px; background: #eef2f7; }

/* cajas del panel de control: iconos con el degradado de as4u.ai */
.small-box { border-radius: 12px; box-shadow: var(--as4u-ombra); border: 1px solid var(--as4u-vora); }
.small-box .icon > i { background: var(--as4u-degradat); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.small-box .inner h3 { font-weight: 700; letter-spacing: -.02em; }
.progress-bar.bg-as4u { background: var(--as4u-degradat); }

/* Menú lateral más ancho (AdminLTE fija 250px): «Conocimiento del asistente» cabe en una línea */
.main-sidebar, .main-sidebar::before { width: 300px; }
/* (nav-flat/nav-legacy de AdminLTE fijan 250px; aquí, el ancho del menú menos los márgenes de 8px) */
.sidebar-mini .main-sidebar .nav-sidebar .nav-link,
.sidebar-mini .main-sidebar .nav-flat .nav-link,
.sidebar-mini .main-sidebar .nav-legacy .nav-link { width: calc(100% - 16px); }
.sidebar-collapse .main-sidebar, .sidebar-collapse .main-sidebar::before { margin-left: -300px; }
.layout-fixed .brand-link { width: 300px; }
.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover,
.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused,
.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover .brand-link,
.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused .brand-link { width: 300px; }
@media (min-width: 992px) {
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .content-wrapper,
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-footer,
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-header { margin-left: 300px; }
}
/* tablet (768–991px): el menú se abre por encima, como en el móvil, y el contenido usa todo el ancho
   (la regla de AdminLTE para esto está mal escrita y nunca se aplica) */
@media (min-width: 768px) and (max-width: 991.98px) {
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .content-wrapper,
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-footer,
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-header { margin-left: 0; }
}
/* plegado (solo iconos): AdminLTE solo lo hace a partir de 992px; por debajo el menú plegado se oculta */
@media (min-width: 992px) {
    .sidebar-mini.sidebar-collapse .main-sidebar { margin-left: 0; }
}
@media (max-width: 767.98px) {
    .main-sidebar, .main-sidebar::before { margin-left: -300px; }
    .sidebar-open .main-sidebar, .sidebar-open .main-sidebar::before { margin-left: 0; }
}
/* plegado y desplegado al pasar el ratón: los enlaces también al ancho nuevo */
.sidebar-collapse.sidebar-mini .main-sidebar:hover:not(.sidebar-no-expand) .nav-sidebar .nav-link,
.sidebar-collapse.sidebar-mini .main-sidebar.sidebar-focused:not(.sidebar-no-expand) .nav-sidebar .nav-link { width: calc(100% - 16px); }
