/* =============================================================
   MODERNIZACIÓN UI — 2025
   ============================================================= */

/* --- RadioButtonGroup: borde sutil y prolijo --- */
.my-radiobutton-group {
    gap: 4px !important;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 3px;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.04);
    display: inline-flex !important;
}
.my-radiobutton-group .btn {
    cursor: pointer;
    border-radius: 8px !important;
    border: 1px solid transparent !important;
    background: transparent !important;
    color: #64748b !important;
    box-shadow: none !important;
    padding: 5px 10px !important;
    transition: background .15s, color .15s, border-color .15s, box-shadow .15s;
    font-size: .8rem;
}
.my-radiobutton-group .btn:hover {
    background: #ffffff !important;
    color: #334155 !important;
    border-color: #e2e8f0 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.08) !important;
}
.my-radiobutton-group .btn.active {
    background: #ffffff !important;
    color: #1e40af !important;
    border-color: #dbeafe !important;
    box-shadow: 0 1px 4px rgba(30,64,175,.12) !important;
    font-weight: 600;
}

/* --- Cards: sombra suave, sin borde lateral azul AdminLTE --- */
.card {
    border: none !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.07), 0 4px 18px rgba(0,0,0,.06) !important;
    transition: box-shadow .2s;
}
.card:hover {
    box-shadow: 0 2px 6px rgba(0,0,0,.09), 0 6px 24px rgba(0,0,0,.08) !important;
}
.card.card-outline {
    border-top: none !important;
}
.card:not(.card-primary):not(.card-secondary):not(.card-success):not(.card-danger):not(.card-warning):not(.card-info):not(.card-dark):not(.abonado-ficha-card) > .card-header {
    border-radius: 12px 12px 0 0 !important;
    border-bottom: 1px solid rgba(0,0,0,.06) !important;
    background: #f8fafc !important;
    font-weight: 600;
    font-size: .88em;
    color: #374151;
    padding: .75rem 1.1rem;
}
.card-header[class*="bg-gradient-info"],    .card-header.bg-info    { background: linear-gradient(180deg,#17a2b8,#138496) !important; color:#fff !important; }
.card-header[class*="bg-gradient-primary"], .card-header.bg-primary { background: linear-gradient(180deg,#2563eb,#1d4ed8) !important; color:#fff !important; }
.card-header[class*="bg-gradient-success"], .card-header.bg-success { background: linear-gradient(180deg,#16a34a,#15803d) !important; color:#fff !important; }
.card-header[class*="bg-gradient-danger"],  .card-header.bg-danger  { background: linear-gradient(180deg,#dc2626,#b91c1c) !important; color:#fff !important; }
.card-header[class*="bg-gradient-warning"], .card-header.bg-warning { background: linear-gradient(180deg,#d97706,#b45309) !important; color:#fff !important; }
.card-header[class*="bg-gradient-dark"],    .card-header.bg-dark    { background: linear-gradient(180deg,#343a40,#1d2124) !important; color:#fff !important; }
.card-header[class*="bg-gradient-secondary"]                        { background: linear-gradient(180deg,#64748b,#475569) !important; color:#fff !important; }

/* --- Tabla / GridView --- */
.table { border-collapse: separate !important; border-spacing: 0 !important; }
.table thead th {
    background: #f1f5f9 !important; color: #334155 !important;
    font-size: .85em !important; font-weight: 700 !important;
    text-transform: uppercase !important; letter-spacing: .04em !important;
    border-bottom: 2px solid #e2e8f0 !important; border-top: none !important;
    padding: .55rem .85rem !important; white-space: nowrap;
}
.table tbody tr { transition: background .1s; }
.table tbody tr:hover > td { background: #f0f7ff !important; }
.table tbody td {
    vertical-align: middle !important; border-top: 1px solid #f1f5f9 !important;
    color: #374151; font-size: .9em;
}
.table tbody td:not(.p-0):not(.p-1):not(.p-2) { padding: .5rem .85rem !important; }
.table-striped tbody tr:nth-of-type(odd) { background-color: #fafbfc !important; }

/* --- Badges --- */
.badge { border-radius: 6px !important; font-weight: 500 !important; font-size: .72em !important; letter-spacing: .02em; padding: .28em .6em !important; }
.badge.badge-success, .badge.bg-success, .badge.bg-green  { background: rgba(34,197,94,.13)  !important; color: #15803d !important; }
.badge.badge-danger,  .badge.bg-danger,  .badge.bg-red    { background: rgba(239,68,68,.11)   !important; color: #b91c1c !important; }
.badge.badge-warning, .badge.bg-warning                   { background: rgba(245,158,11,.13)  !important; color: #92400e !important; }
.badge.badge-info,    .badge.bg-info                      { background: rgba(59,130,246,.12)  !important; color: #1d4ed8 !important; }
.badge.badge-primary, .badge.bg-primary                   { background: rgba(99,102,241,.12)  !important; color: #4338ca !important; }
.badge.badge-secondary,.badge.bg-secondary                 { background: rgba(100,116,139,.11) !important; color: #475569 !important; }
/* badge en div: mantener inline-block */
div.badge { display: inline-block !important; }

/* --- Botones --- */
.btn { border-radius: 8px !important; font-size: .82em !important; font-weight: 500; transition: all .15s !important; letter-spacing: .01em; }
.btn-primary  { background: #2563eb !important; border-color: #2563eb !important; }
.btn-primary:hover  { background: #1d4ed8 !important; border-color: #1d4ed8 !important; }
.btn-secondary { background: #64748b !important; border-color: #64748b !important; color: #fff !important; }
.btn-secondary:hover { background: #475569 !important; border-color: #475569 !important; color: #fff !important; }
.btn-info     { background: #0ea5e9 !important; border-color: #0ea5e9 !important; color: #fff !important; }
.btn-info:hover     { background: #0284c7 !important; border-color: #0284c7 !important; }
.btn-success  { background: #16a34a !important; border-color: #16a34a !important; }
.btn-success:hover  { background: #15803d !important; border-color: #15803d !important; }
.btn-danger   { background: #dc2626 !important; border-color: #dc2626 !important; }
.btn-danger:hover   { background: #b91c1c !important; border-color: #b91c1c !important; }
.btn-warning  { background: #d97706 !important; border-color: #d97706 !important; color: #fff !important; }
.btn-warning:hover  { background: #b45309 !important; border-color: #b45309 !important; }

/* --- Inputs --- */
.form-control, .custom-select {
    border-radius: 8px !important; border-color: #e2e8f0 !important;
    transition: border-color .15s, box-shadow .15s !important;
}
.form-control:focus, .custom-select:focus {
    border-color: #2563eb !important; box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important;
}
/* Input-group: alinear alturas y border-radius */
.input-group .form-control,
.input-group .custom-select { font-size: inherit !important; }
.input-group > .form-control:not(:last-child),
.input-group > .custom-select:not(:last-child) { border-radius: 8px 0 0 8px !important; }
.input-group > .input-group-append > .btn { border-radius: 0 8px 8px 0 !important; }
.input-group > .input-group-append > .btn,
.input-group > .form-control { height: auto !important; min-height: calc(1.5em + .75rem + 2px); }

/* --- Group header row (grillas anidadas) --- */
.ispboss-grid-group-header {
    padding: 6px 12px !important;
    background: #f1f5f9 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    font-size: .82rem;
    line-height: 1.5;
    overflow: hidden; /* clearfix for float-right children */
}
.ispboss-grid-group-header .text-muted { color: #64748b !important; }
/* Forzar la tabla interna (nested grid) a ocupar todo el ancho del td */
td.p-0 > table,
td.p-0 > .gridview-wrapper > table,
td.p-0 > div > table { width: 100% !important; }
/* El td que contiene el grupo puede expandirse libremente */
.table > tbody > tr > td.p-0 { width: auto !important; }

/* --- Empty state en grilla --- */
.table > thead + tbody tr:only-child td[colspan],
.table > thead ~ tbody tr:only-child td[colspan] {
    text-align: center; padding: 2.5rem 1rem !important; color: #94a3b8; font-size: .88em;
}

/* --- Sidebar de filtros --- */
.sidebar-panel-sidebar {
    overflow-y: auto !important; max-height: calc(100vh - 120px) !important;
    position: sticky !important; top: 10px !important;
}

/* --- Select2 --- */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border: 1.5px solid #e2e8f0 !important; border-radius: 8px !important;
    min-height: calc(1.5em + .65rem + 2px) !important;
    background: #fff !important; transition: border-color .15s, box-shadow .15s !important;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple {
    border-color: #2563eb !important; box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important; outline: none !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    color: #374151 !important; font-size: .84em !important; padding: 0 1.4rem 0 .75rem !important; line-height: 1.5 !important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder,
.select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #94a3b8 !important; }
.select2-dropdown {
    border: 1.5px solid #e2e8f0 !important; border-radius: 10px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,.1) !important; overflow: hidden !important; margin-top: 3px !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1.5px solid #e2e8f0 !important; border-radius: 6px !important;
    padding: 5px 10px !important; font-size: .82em !important; outline: none !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: #2563eb !important; box-shadow: 0 0 0 3px rgba(37,99,235,.1) !important;
}
.select2-results__option {
    font-size: .83em !important; padding: .42rem .75rem !important;
    color: #374151 !important; border-radius: 0 !important; transition: background .1s !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: #eff6ff !important; color: #1d4ed8 !important; }
.select2-container--default .select2-results__option[aria-selected=true] { background: #dbeafe !important; color: #1d4ed8 !important; }
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: #eff6ff !important; border: 1px solid #bfdbfe !important; border-radius: 6px !important;
    color: #1d4ed8 !important; font-size: .82em !important; padding: 3px 8px !important; margin: 3px 3px 0 0 !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #93c5fd !important; margin-right: 4px !important; }
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #1d4ed8 !important; }

/* ===== AbonadoFicha — tira lateral colapsada ===== */
.ficha-col-strip {
    flex: 0 0 60px !important; max-width: 60px !important; min-width: 0 !important;
    padding: 0 !important; position: relative;
    background: linear-gradient(180deg, #eef2ff 0%, #f0f7ff 60%, #f8faff 100%);
    border-radius: 0 0 0 12px;
    box-shadow: inset -1px 0 0 #c7d7f5, 2px 0 12px rgba(99,102,241,.08);
}
.ficha-col-strip .abonado-ficha-card { background: transparent !important; border: none !important; box-shadow: none !important; margin: 0 !important; }
.ficha-col-strip .abonado-ficha-card .card-header {
    padding: 10px 0 6px 0 !important; background: transparent !important;
    border: none !important; display: flex !important; justify-content: center !important;
}
.ficha-col-strip .abonado-ficha-toggle-btn,
.ficha-col-strip .abonado-ficha-card .card-header .col,
.ficha-col-strip .abonado-ficha-card .stretched-link { display: none !important; }
.ficha-col-strip .abonado-ficha-body { display: none !important; }
.ficha-col-strip .abonado-ficha-avatar-wrapper {
    cursor: pointer; display: inline-flex !important;
    flex-direction: column; align-items: center;
}
.ficha-col-strip .abonado-ficha-avatar-wrapper:hover .abonado-avatar {
    transform: scale(1.06); box-shadow: 0 4px 16px rgba(0,0,0,.22);
}
.ficha-col-strip .abonado-ficha-expand-badge { opacity: 1 !important; }
.ficha-strip-actions { display: none; flex-direction: column; align-items: center; padding: 10px 0 8px 0; gap: 7px; }
.ficha-col-strip .ficha-strip-actions { display: flex !important; }
.ficha-strip-btn {
    width: 36px; height: 36px; border-radius: 50%;
    border: 1.5px solid #e2e8f0; background: #ffffff;
    display: flex !important; align-items: center; justify-content: center;
    color: #64748b; font-size: 13px; text-decoration: none !important;
    transition: background .15s, border-color .15s, color .15s, transform .15s;
    position: relative; z-index: 3; box-shadow: 0 1px 3px rgba(0,0,0,.08);
}
.ficha-strip-btn:hover {
    background: #eff6ff; border-color: #2563eb; color: #2563eb;
    transform: scale(1.12); box-shadow: 0 3px 8px rgba(37,99,235,.2); text-decoration: none !important;
}
.ficha-strip-btn + .tooltip { margin-left: 4px; }

/* ===== AbonadoFicha — avatar con iniciales ===== */
.abonado-avatar {
    width: 48px; height: 48px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-weight: 700; font-size: 1.1rem;
    user-select: none; flex-shrink: 0; transition: transform .2s, box-shadow .2s;
}
.abonado-ficha-expand-badge {
    position: absolute; bottom: -3px; right: -3px;
    width: 20px; height: 20px; background: #fff; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 2px 5px rgba(0,0,0,.18); font-size: 9px; color: #374151;
    opacity: 0; transition: opacity .2s; pointer-events: none;
}
.ficha-collapsed .abonado-ficha-expand-badge { opacity: 1; }
.abonado-ficha-header-nombre { position: relative; }
.abonado-nombre-link-cover { position: absolute; inset: 0; z-index: 1; display: block !important; }
.abonado-ficha-header-nombre span { position: relative; z-index: 2; }
.abonado-nombre-link-cover:hover ~ span,
.abonado-ficha-header-nombre:hover span { text-decoration: underline; color: #93c5fd !important; }
.abonado-nombre-link { color: inherit !important; text-decoration: none !important; }
.abonado-nombre-link:hover { text-decoration: underline !important; color: inherit !important; }
.ficha-strip-nav {
    width: 30px; height: 30px; border-radius: 8px; border: 1.5px dashed #b4c6ef;
    background: transparent; display: flex !important; align-items: center; justify-content: center;
    color: #94a3b8; font-size: 11px; text-decoration: none !important;
    transition: background .15s, border-color .15s, color .15s;
    position: relative; z-index: 3; margin-top: 2px;
}
.ficha-strip-nav:hover { background: #eff6ff; border-color: #6366f1; border-style: solid; color: #6366f1 !important; text-decoration: none !important; }
.ficha-strip-sep { width: 32px; height: 1px; background: linear-gradient(to right, transparent, #c7d7f5, transparent); margin: 2px 0; }

/* ===== AbonadoFicha — header moderno ===== */
.abonado-ficha-card { border: none !important; box-shadow: 0 2px 12px rgba(0,0,0,.1) !important; border-radius: 12px !important; overflow: hidden; }
.abonado-ficha-card > .abonado-ficha-header,
.abonado-ficha-card .abonado-ficha-header {
    background: linear-gradient(135deg, #1e40af 0%, #4f46e5 100%) !important;
    border-bottom: none !important; padding: 14px 14px 12px 14px !important;
    box-shadow: 0 2px 8px rgba(79,70,229,.25);
}
.abonado-ficha-header-nombre { font-size: .82rem; font-weight: 600; color: #f1f5f9; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.abonado-ficha-header-nombre .abonado-nombre-link,
.abonado-ficha-header-nombre .abonado-nombre-link span { color: #f1f5f9 !important; text-decoration: none !important; }
.abonado-ficha-header-nombre .abonado-nombre-link:hover,
.abonado-ficha-header-nombre .abonado-nombre-link:hover span { color: #93c5fd !important; text-decoration: underline !important; }
.abonado-ficha-header-domicilio { font-size: .72rem; color: #94a3b8; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.abonado-ficha-header-domicilio i { font-size: .65rem; opacity: .7; }
.abonado-ficha-header .abonado-ficha-toggle-btn { color: #64748b !important; transition: color .15s; }
.abonado-ficha-header .abonado-ficha-toggle-btn:hover { color: #f1f5f9 !important; }
.ficha-col-strip .abonado-ficha-header { padding: 10px 0 6px 0 !important; }

/* ===================================================================
   ispboss — Navbar moderno
   =================================================================== */
.ispboss-navbar {
    background: #ffffff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.06) !important;
    min-height: 54px;
}
.ispboss-navbar-avatar {
    width: 32px; height: 32px; border-radius: 50%;
    background: linear-gradient(135deg, #1e40af 0%, #4f46e5 100%);
    color: #fff; font-size: .7rem; font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center;
    flex-shrink: 0; letter-spacing: .03em;
}
.ispboss-navbar-avatar-lg { width: 46px; height: 46px; font-size: 1rem; }
.ispboss-navbar-user { display: flex !important; align-items: center; gap: 8px; padding: 6px 10px !important; border-radius: 8px; transition: background .15s; }
.ispboss-navbar-user:hover { background: #f1f5f9; }
.ispboss-navbar-username { font-size: .8rem; font-weight: 500; color: #374151; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ispboss-user-dropdown { min-width: 230px !important; border: 1px solid #e2e8f0 !important; border-radius: 12px !important; box-shadow: 0 8px 24px rgba(0,0,0,.12) !important; padding: 0 !important; overflow: hidden; }
.ispboss-dropdown-user-header { display: flex; align-items: center; gap: 10px; padding: 14px 16px; background: #f8fafc; border-bottom: 1px solid #f1f5f9; }
.ispboss-user-dropdown .dropdown-item { padding: 9px 16px; font-size: .85rem; color: #374151; transition: background .12s; }
.ispboss-user-dropdown .dropdown-item:hover { background: #f1f5f9; color: #111827; }
.ispboss-navbar-empresa-logo { max-height: 28px; max-width: 100px; opacity: .65; object-fit: contain; }

/* ===================================================================
   ispboss — Sidebar moderno
   =================================================================== */
.ispboss-sidebar { background: #0f172a !important; }
.ispboss-sidebar .sidebar { background: transparent !important; overflow-x: hidden; }
.ispboss-brand-link { background: #0f172a !important; border-bottom: 1px solid #1e293b !important; padding: 13px 16px !important; display: flex !important; align-items: center; min-height: 54px; }
.ispboss-brand-link:hover { background: #1e293b !important; }
/* Brand mini (colapsado) */
.ispboss-logo-mini {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    width: 100%; gap: 4px;
}
.ispboss-mini-icon { font-size: 1.2rem; color: #818cf8; line-height: 1; }
.ispboss-mini-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: #6366f1;
    animation: ispboss-dot-pulse 2.4s ease-in-out infinite;
    box-shadow: 0 0 6px rgba(99,102,241,.8);
}
@keyframes ispboss-dot-pulse {
    0%, 100% { opacity: .4; transform: scale(.8); box-shadow: 0 0 4px rgba(99,102,241,.4); }
    50%       { opacity: 1;  transform: scale(1.2); box-shadow: 0 0 10px rgba(99,102,241,.9), 0 0 20px rgba(99,102,241,.4); }
}

/* Brand full (expandido) */
.ispboss-logo-full { display: flex; align-items: center; justify-content: center; width: 100%; }
.ispboss-brand-block {
    display: flex; flex-direction: row;
    align-items: baseline; justify-content: center;
    gap: 7px; width: 100%;
}
.ispboss-brand-name {
    font-size: 1.35rem; font-weight: 800; color: #f1f5f9;
    letter-spacing: .5px; line-height: 1;
    text-shadow: 0 0 20px rgba(129,140,248,.3);
    white-space: nowrap;
}
.ispboss-brand-ai {
    display: flex; align-items: center; gap: 0;
    font-size: .9rem; font-weight: 600;
    color: #818cf8; letter-spacing: .06em;
    line-height: 1; white-space: nowrap; padding-bottom: 1px;
}
.ispboss-ai-text { color: #818cf8; }
.ispboss-ai-cursor {
    color: #6366f1; font-weight: 300; margin-left: 1px;
    animation: ispboss-blink .85s step-end infinite;
}
@keyframes ispboss-blink {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0; }
}

/* Buscador de menú */
.ispboss-sidebar-search { position: relative; padding: 10px 12px 8px; background: #0f172a; }
.ispboss-search-icon { position: absolute; left: 22px; top: 50%; transform: translateY(-50%); color: #475569; font-size: .75rem; pointer-events: none; }
#sidebarMenuSearch { width: 100%; background: #1e293b; border: 1px solid #334155; border-radius: 20px; color: #cbd5e1; font-size: .78rem; padding: 6px 30px 6px 32px; outline: none; transition: border-color .15s, background .15s; }
#sidebarMenuSearch::placeholder { color: #475569; }
#sidebarMenuSearch:focus { border-color: #4f46e5; background: #1e2d40; color: #f1f5f9; }
.ispboss-search-clear { position: absolute; right: 22px; top: 50%; transform: translateY(-50%); color: #475569; font-size: .72rem; cursor: pointer; transition: color .12s; }
.ispboss-search-clear:hover { color: #94a3b8; }
.sidebar-no-results { display: none; text-align: center; color: #475569; font-size: .78rem; padding: 18px 0; }

/* Nav items */
.ispboss-sidebar .nav-sidebar > .nav-item { margin: 1px 8px; }
.ispboss-sidebar .nav-sidebar .nav-link { color: #cbd5e1 !important; border-radius: 8px !important; padding: 7px 12px !important; font-size: .825rem; transition: background .15s, color .15s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ispboss-sidebar .nav-sidebar .nav-link:hover { background: #1e293b !important; color: #e2e8f0 !important; }
.ispboss-sidebar .nav-sidebar .nav-link.active,
.ispboss-sidebar .nav-sidebar .nav-item.menu-open > .nav-link { background: linear-gradient(135deg, #1e40af 0%, #3730a3 100%) !important; color: #ffffff !important; box-shadow: 0 2px 6px rgba(79,70,229,.35); }
.ispboss-sidebar .nav-sidebar .nav-link .nav-icon { color: #64748b !important; transition: color .15s; width: 1.2rem; font-size: .9rem; }
.ispboss-sidebar .nav-sidebar .nav-link:hover .nav-icon,
.ispboss-sidebar .nav-sidebar .nav-link.active .nav-icon { color: #818cf8 !important; }
.ispboss-sidebar .nav-sidebar .nav-link p .right,
.ispboss-sidebar .nav-sidebar .nav-link p .float-right { color: #475569 !important; transition: transform .2s; }
.ispboss-sidebar .nav-treeview > .nav-item > .nav-link { padding-left: 2.2rem !important; font-size: .785rem; color: #94a3b8 !important; }
.ispboss-sidebar .nav-treeview > .nav-item > .nav-link:hover { background: #1e293b !important; color: #cbd5e1 !important; }
.ispboss-sidebar .nav-treeview > .nav-item > .nav-link.active { background: #1e3a5f !important; color: #93c5fd !important; box-shadow: none; }
/* Badges en el menú del sidebar */
.ispboss-sidebar .nav-sidebar .badge,
.ispboss-sidebar .nav-sidebar .right.badge {
    background: rgba(99,102,241,.18) !important;
    color: #e0e7ff !important;
    border: 1px solid rgba(99,102,241,.45) !important;
    font-size: .68rem !important;
    font-weight: 700 !important;
    padding: .2em .55em !important;
    border-radius: 20px !important;
    letter-spacing: .02em;
    min-width: 1.6em;
    text-align: center;
}
.ispboss-sidebar .nav-sidebar .nav-link.active .badge,
.ispboss-sidebar .nav-sidebar .nav-item.menu-open > .nav-link .badge {
    background: rgba(255,255,255,.22) !important;
    color: #fff !important;
    border-color: rgba(255,255,255,.4) !important;
}

.ispboss-sidebar .nav-header { color: #334155 !important; font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; padding: 10px 20px 4px; }
.ispboss-sidebar .sidebar::-webkit-scrollbar { width: 4px; }
.ispboss-sidebar .sidebar::-webkit-scrollbar-track { background: transparent; }
.ispboss-sidebar .sidebar::-webkit-scrollbar-thumb { background: #1e293b; border-radius: 4px; }
.ispboss-sidebar-empresa { padding: 10px 12px; border-top: 1px solid #1e293b; display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; }
.ispboss-sidebar-empresa-logo { max-height: 22px; max-width: 60px; opacity: .35; object-fit: contain; display: block; }
.ispboss-sidebar-empresa-logo-xl { max-height: 22px; max-width: 110px; opacity: .35; object-fit: contain; display: none; }
body:not(.sidebar-mini) .ispboss-sidebar-empresa-logo { display: none; }
body:not(.sidebar-mini) .ispboss-sidebar-empresa-logo-xl { display: block; }

/* ===== Buscador global del navbar ===== */
.ispboss-global-search { position: relative; width: 100%; }
.ispboss-gsearch-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: #94a3b8; font-size: .78rem; pointer-events: none; z-index: 2; }
.ispboss-gsearch-input {
    width: 100%; padding: 7px 14px 7px 34px; border: 1px solid #e2e8f0;
    border-radius: 20px; background: #f8fafc; font-size: .82rem; color: #334155;
    outline: none; transition: border-color .2s, box-shadow .2s, background .2s; line-height: 1.4;
}
.ispboss-gsearch-input:focus { border-color: #6366f1; background: #fff; box-shadow: 0 0 0 3px rgba(99,102,241,.12); }
.ispboss-gsearch-input::placeholder { color: #94a3b8; }
.ispboss-gsearch-results {
    position: absolute; top: calc(100% + 6px); left: 0; right: 0;
    background: #fff; border: 1px solid #e2e8f0; border-radius: 10px;
    box-shadow: 0 8px 24px rgba(15,23,42,.12); z-index: 9999;
    overflow: hidden; max-height: 320px; overflow-y: auto;
}
.ispboss-gsearch-item { display: flex; align-items: center; gap: 10px; padding: 9px 14px; text-decoration: none; color: #1e293b; border-bottom: 1px solid #f1f5f9; transition: background .15s; font-size: .82rem; }
.ispboss-gsearch-item:last-child { border-bottom: none; }
.ispboss-gsearch-item:hover { background: #f1f5f9; color: #1e293b; text-decoration: none; }
.ispboss-gsearch-item-icon { width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, #1e40af, #4f46e5); display: flex; align-items: center; justify-content: center; color: #fff; font-size: .7rem; flex-shrink: 0; }
.ispboss-gsearch-item-body { flex: 1; min-width: 0; }
.ispboss-gsearch-item-text { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ispboss-gsearch-item-sub { font-size: .73rem; color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ispboss-gsearch-empty { padding: 14px; text-align: center; font-size: .8rem; color: #94a3b8; }
.ispboss-gsearch-spinner { padding: 14px; text-align: center; font-size: .78rem; color: #94a3b8; }

/* ===== Content header (título de página) ===== */
.content-header {
    padding: 8px 15px 4px !important;
}
.content-header h1,
.content-header .h1 {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    margin-bottom: 0 !important;
    line-height: 1.3 !important;
    color: #1e293b !important;
}
.content-header h1 small,
.content-header .h1 small {
    font-size: .72rem !important;
    color: #94a3b8 !important;
    font-weight: 400 !important;
    margin-left: 6px !important;
}
.content-header .breadcrumb {
    margin-bottom: 0 !important;
    padding: 3px 0 !important;
    background: transparent !important;
    font-size: .75rem !important;
}

/* ── Abonados: tabs nav scrolleable ────────────────────────────── */
/* min-width:0 es clave: sin él el flex-item no puede achicarse por debajo
   de su contenido intrínseco y overflow-x:auto nunca recorta */
.abonado-tabs-nav {
    min-width: 0;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(99,102,241,.2) transparent;
}
.abonado-tabs-nav::-webkit-scrollbar { height: 3px; }
.abonado-tabs-nav::-webkit-scrollbar-track { background: transparent; }
.abonado-tabs-nav::-webkit-scrollbar-thumb { background: rgba(99,102,241,.3); border-radius: 3px; }
.abonado-tabs-nav .nav-item { flex-shrink: 0; }
.abonado-tabs-nav .nav-link {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: .35em .75em;
    font-size: .78rem;
    white-space: nowrap;
    line-height: 1.2;
}
/* Mobile (< sm): solo ícono — el texto queda fuera del <span> en el HTML,
   font-size:0 lo oculta sin afectar ícono ni badge que están dentro de <span> */
@media (max-width: 575px) {
    .abonado-tabs-nav .nav-link {
        font-size: 0 !important;
        padding: .45em .6em;
    }
    .abonado-tabs-nav .nav-link > span {
        font-size: 15px;
        display: inline-flex;
        align-items: center;
        gap: 3px;
    }
    .abonado-tabs-nav .nav-link > span > i { font-size: 15px; }
    .abonado-tabs-nav .nav-link .badge { font-size: .6rem !important; padding: .18em .45em !important; }
}

/* ── Abonados: ficha lateral — no colapsar en mobile (< lg) ─────── */
/* El colapso usa localStorage: si quedó colapsada en desktop y se abre
   en mobile, ficha-col-strip pondría la columna en 60px con el card
   transparente y sin body. Reseteamos todo a estado expandido normal. */
@media (max-width: 991px) {
    /* 1. Columna: vuelve a ancho completo */
    .ficha-col-strip {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        background: transparent !important;
        box-shadow: none !important;
    }
    /* 2. Card: restaurar apariencia normal */
    .ficha-col-strip .abonado-ficha-card {
        background: #fff !important;
        border: none !important;
        box-shadow: 0 2px 12px rgba(0,0,0,.1) !important;
        margin: 0 0 1rem !important;
    }
    /* 3. Header: restaurar padding y alineación */
    .ficha-col-strip .abonado-ficha-card .card-header,
    .ficha-col-strip .abonado-ficha-header {
        padding: 14px 14px 12px !important;
        justify-content: flex-start !important;
        display: block !important;
    }
    /* 4. Mostrar body y ocultar elementos de strip */
    .ficha-col-strip .abonado-ficha-body  { display: block !important; }
    .ficha-col-strip .ficha-strip-actions { display: none  !important; }
    /* 5. Ocultar el botón toggle (no tiene sentido en mobile) */
    .ficha-col-strip .abonado-ficha-toggle-btn { display: none !important; }
    /* 6. La columna hermana (tabs) también vuelve a full width */
    .ficha-col-strip ~ [class*="col-"] {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

/* ── Mobile: prevenir overflow horizontal global ─────────────────── */
/* En AdminLTE sidebar-mini el content-wrapper puede desbordar en mobile */
@media (max-width: 991px) {
    .wrapper, .content-wrapper, .content { overflow-x: hidden; }
}

/* ── Mobile: botones de acceso rápido de la ficha ───────────────── */
/* Los 5 btn con fa-2x en btn-group hacen overflow en pantallas chicas */
@media (max-width: 575px) {
    .abonado-ficha-card .btn-group.btn-block {
        display: flex !important;
        flex-wrap: wrap !important;
    }
    .abonado-ficha-card .btn-group.btn-block .btn {
        flex: 1 1 30% !important;   /* 3 por fila en el peor caso */
        min-width: 0 !important;
        padding: .45rem .3rem !important;
        font-size: .72rem;
    }
    .abonado-ficha-card .btn-group.btn-block .btn .fas,
    .abonado-ficha-card .btn-group.btn-block .btn .far,
    .abonado-ficha-card .btn-group.btn-block .btn .fab {
        font-size: 1.4em !important;  /* fa-2x → más chico */
    }
    /* Botón Ver Geolocalización: texto que no desborde */
    .abonado-ficha-card #divBotonGeolocalizacion .btn {
        font-size: .8rem;
        padding: .4rem .5rem !important;
    }
}