/**
 * MODERN SHELL STYLES (Vanilla CSS - Ultra Scoped)
 * This file ONLY contains styles for the global layout (Header/Sidebar).
 * It MUST NOT contain any global resets or legacy component fixes
 * to avoid interference with legacy-only pages.
 */

/* Admin Header Modernization */
.main-header .navbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 15px !important;
    height: 50px !important;
    background-color: #373e4a !important;
}

/* Sidebar Toggle Alignment */
.main-header .sidebar-toggle {
    display: flex !important;
    align-items: center !important;
    height: 50px !important;
    padding: 0 15px !important;
    color: #fff !important;
}

.navbar-custom-menu {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    flex: 1 !important;
    justify-content: flex-end !important;
    gap: 25px !important;
}

.navbar-custom-menu .nav-actions-center {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.navbar-custom-menu .nav-actions-right {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    height: 100% !important;
}

/* Scoped Dropdowns (Only in Navbar) */
.navbar-nav .dropdown-menu > li > a {
    padding: 10px 20px !important;
    display: block !important;
    white-space: nowrap !important;
}

/* Emerald Button (Baked Tailwind style) */
.navbar-custom-menu .pdv-link {
    height: 36px !important;
    padding: 0 20px !important;
    border-radius: 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    background-color: #10b981 !important;
    color: white !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
}

.navbar-custom-menu .pdv-link:hover {
    background-color: #059669 !important;
}

/* Environment Label */
.ambiente-label {
    color: #e2e8f0;
    font-size: 12px;
    margin-right: auto !important;
    padding-left: 10px;
}

/* Sidebar Toggle Icon */
.main-header .sidebar-toggle::before {
    content: "\f0c9" !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
}

/* Sidebar Specific Isolation */
.main-sidebar {
    padding-top: 50px !important;
}

.sidebar-menu > li > a > i {
    width: 20px !important;
    text-align: center !important;
    margin-right: 10px !important;
}

.sidebar-menu > li.active > a {
    border-left-color: #10b981 !important;
}

.select2-container--default .select2-selection--multiple {
    background-color: white !important;
    border: 1px solid #d2d6de !important;
    border-radius: 0 !important;
    cursor: text !important;
    min-height: 34px !important;
    display: block !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #3c8dbc !important;
    border: 1px solid #367fa9 !important;
    border-radius: 3px !important;
    padding: 1px 10px !important;
    color: #fff !important;
    float: left !important;
    margin-right: 5px !important;
    margin-top: 5px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: rgba(255,255,255,0.7) !important;
    float: right !important;
    margin-left: 5px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    display: block !important;
    padding: 0 5px !important;
}

/* EMERGENCY LIST-GROUP & POS-TAB RESTORATION (Senior Bridge) */
.list-group-item {
    position: relative !important;
    display: block !important;
    padding: 10px 15px !important;
    margin-bottom: -1px !important;
    background-color: #fff !important;
    border: 1px solid #ddd !important;
    text-decoration: none !important;
}

.list-group-item:first-child {
    border-top-left-radius: 4px !important;
    border-top-right-radius: 4px !important;
}

.list-group-item:last-child {
    margin-bottom: 0 !important;
    border-bottom-right-radius: 4px !important;
    border-bottom-left-radius: 4px !important;
}

.list-group-item.active, 
.list-group-item.active:hover, 
.list-group-item.active:focus {
    z-index: 2 !important;
    color: #fff !important;
    background-color: #3c8dbc !important;
    border-color: #3c8dbc !important;
}

/* Vertical Tab Container Fixes */
.pos-tab-container {
    display: flex !important;
    background-color: #fff !important;
    padding: 0 !important;
    border: 1px solid #d2d6de !important;
    margin-top: 15px !important;
    min-height: 500px !important;
    border-radius: 4px !important;
    overflow: hidden !important;
}

.pos-tab-menu {
    padding: 0 !important;
    width: 200px !important;
    flex-shrink: 0 !important;
    border-right: 1px solid #d2d6de !important;
    background-color: #fff !important;
}

.pos-tab-menu .list-group {
    margin-bottom: 0 !important;
}

.pos-tab-menu .list-group-item {
    border-radius: 0 !important;
    border: none !important;
    border-bottom: 1px solid #f4f4f4 !important;
    margin-bottom: 0 !important;
    text-align: center !important;
    padding: 15px 10px !important;
}

.pos-tab {
    flex-grow: 1 !important;
    padding: 20px !important;
    background-color: #fff !important;
}

.pos-tab-content:not(.active) {
    display: none !important;
}

.pos-tab-content.active {
    display: block !important;
}