input, button {
    border-radius: 6px !important;
}

    input:focus {
        border-color: #007bff !important;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
        outline: none;
    }

/*ESTILOS GLOBALES PARA LOS FILTROS*/
.select2-container--default .select2-selection--single {
    border: 1px solid #ddd !important;
    border-radius: 6px !important;
    height: 34px !important;
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: #007bff !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
    outline: none !important;
}

/* Smooth dropdown opening animation */
.select2-container--open .select2-dropdown {
    animation: fadeInDown 0.2s ease-out !important;
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Smooth option hover animation */
.select2-container--default .select2-results__option {
    transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out !important;
}

/* ===== BASE DROPDOWN STYLING - SMALLER ===== */
.select2-container--default .select2-selection--single {
    border: 1px solid #ced4da !important;
    border-radius: 5px !important;
    height: 34px !important;
    background-color: white !important;
    transition: all 0.15s ease-in-out !important;
    display: flex !important; /* Added */
    align-items: center !important; /* Added - vertically centers content */
}

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        color: #495057 !important;
        line-height: normal !important; /* Changed from 32px to normal */
        padding-left: 0px !important; /* Restored padding */
        padding-right: 28px !important;
        padding-top: 3px !important; /* Add this to push text down */
        font-size: 14px !important;
        flex: 1 !important; /* Added - takes available space */
    }

    /* ===== DROPDOWN ARROW ===== */
    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 34px !important;
        right: 6px !important;
        width: 18px !important;
        display: flex !important; /* Added */
        align-items: center !important; /* Added - centers arrow vertically */
    }

        .select2-container--default .select2-selection--single .select2-selection__arrow b {
            border-color: #6c757d transparent transparent transparent !important;
            border-width: 5px 4px 0 4px !important; /* Smaller arrow */
            margin-left: -4px !important;
            margin-top: -2px !important;
            transition: border-color 0.15s ease !important;
        }

/* ===== FOCUS/OPEN STATES ===== */
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: #4dabf7 !important; /* Original blue color */
    box-shadow: 0 0 0 2px rgba(77, 171, 247, 0.15) !important; /* Original blue shadow */
    outline: none !important;
}

    .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
        border-color: transparent transparent #4dabf7 transparent !important; /* Original blue arrow */
        border-width: 0 4px 5px 4px !important; /* Smaller arrow */
        margin-top: -2px !important;
    }

/* ===== DROPDOWN CONTAINER ===== */
.select2-container--default .select2-dropdown {
    border: 1px solid #dee2e6 !important;
    border-radius: 5px !important; /* Slightly smaller radius */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08) !important; /* Smaller shadow */
    margin-top: 3px !important; /* Reduced from 4px */
    overflow: hidden !important;
}

/* ===== DROPDOWN OPTIONS CONTAINER ===== */
.select2-container--default .select2-results > .select2-results__options {
    max-height: 240px !important; /* Reduced from 280px */
    padding: 6px 0 !important; /* Reduced from 8px */
}

/* ===== SEARCH BOX (FIXED) ===== */
.select2-container--default .select2-search--dropdown {
    padding: 6px !important; /* Reduced from 8px */
    background-color: #f8f9fa !important;
    border-bottom: 1px solid #e9ecef !important;
}

    .select2-container--default .select2-search--dropdown .select2-search__field {
        border: 1px solid #ced4da !important;
        border-radius: 3px !important; /* Smaller radius */
        padding: 6px 10px !important; /* Reduced from 8px 12px */
        font-size: 13px !important; /* Smaller font */
        height: 32px !important; /* Fixed height */
        width: 100% !important;
        box-sizing: border-box !important;
        outline: none !important;
        transition: border-color 0.15s ease !important;
    }

        .select2-container--default .select2-search--dropdown .select2-search__field:focus {
            border-color: #4dabf7 !important; /* Original blue focus color */
            box-shadow: 0 0 0 2px rgba(77, 171, 247, 0.15) !important; /* Original blue shadow */
        }

/* ===== OPTION STYLING - SMALLER ===== */
.select2-container--default .select2-results__option {
    padding: 8px 12px !important; /* Reduced from 10px 16px */
    font-size: 14px !important; /* Smaller font */
    line-height: 1.4 !important; /* Tighter line height */
    color: #495057 !important;
    transition: all 0.12s ease !important; /* Faster transition */
    border-left: 2px solid transparent !important; /* Thinner border */
    margin: 1px 6px !important; /* Reduced from 2px 8px */
    border-radius: 3px !important; /* Smaller radius */
}

/* Hover option */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #e7f5ff !important;
    color: #1c7ed6 !important;
    border-left-color: #1c7ed6 !important;
    font-weight: 500 !important;
    padding: 8px 12px !important; /* Consistent padding */
}

/* Selected option in dropdown (when open) - KEPT DARKER */
.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: #1b4876 !important; /* Darker: kept #1a5fba */
    color: white !important;
    font-weight: 500 !important;
    border-left-color: #15529e !important; /* Darker border to match */
    padding: 8px 12px !important; /* Consistent padding */
}

    /* Selected option hover state - KEPT DARKER */
    .select2-container--default .select2-results__option[aria-selected="true"]:hover {
        background-color: #08233e !important; /* Darker: kept #08233e */
        color: white !important;
    }

/* Disabled option */
.select2-container--default .select2-results__option[aria-disabled="true"] {
    color: #adb5bd !important;
    background-color: transparent !important;
}

/* ===== NO RESULTS MESSAGE ===== */
.select2-container--default .select2-results__message {
    color: #6c757d !important;
    font-style: italic !important;
    padding: 12px !important; /* Reduced from 16px */
    font-size: 13px !important; /* Smaller font */
    text-align: center !important;
    background-color: #f8f9fa !important;
}

/* ===== LOADING STATE ===== */
.select2-container--default .select2-results__option--loading {
    color: #6c757d !important;
    text-align: center !important;
    padding: 12px !important; /* Reduced from 16px */
    font-size: 13px !important; /* Smaller font */
}

/* ===== SCROLLBAR STYLING (Optional) ===== */
.select2-container--default .select2-results__options::-webkit-scrollbar {
    width: 6px !important; /* Thinner scrollbar */
}

.select2-container--default .select2-results__options::-webkit-scrollbar-track {
    background: #f1f3f5 !important;
    border-radius: 3px !important; /* Smaller radius */
}

.select2-container--default .select2-results__options::-webkit-scrollbar-thumb {
    background: #ced4da !important;
    border-radius: 3px !important; /* Smaller radius */
}

    .select2-container--default .select2-results__options::-webkit-scrollbar-thumb:hover {
        background: #adb5bd !important;
    }

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}


/* Prevent flash before Angular compiles */
[ng-cloak], .ng-cloak {
    display: none !important;
}

.appm-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.appm-container {
    position: relative;
    background: #fff;
    border-radius: 14px;
    width: 100%;
    max-width: 420px;
    padding: 28px 26px 22px;
    text-align: center;
    box-shadow: 0 20px 40px rgba(0,0,0,.2);
    animation: appmFade .25s ease;
}

.appm-close {
    position: absolute;
    top: 10px;
    right: 10px;
    border: none;
    background: transparent;
    cursor: pointer;
    padding: 6px;
    color: #6b7280;
    font-size: 18px;
}

    .appm-close:hover {
        color: #111827;
    }

    .appm-close[disabled] {
        opacity: .4;
        cursor: not-allowed;
    }

.appm-title {
    font-size: 20px;
    margin: 12px 0 8px;
    color: #111827;
    font-weight: 700;
}

.appm-message {
    font-size: 14px;
    color: #6b7280;
    margin: 0 0 18px;
}

/* Spinner */
.appm-spinner {
    width: 56px;
    height: 56px;
    border: 6px solid #e5e7eb;
    border-top-color: #2563eb;
    border-radius: 50%;
    margin: 8px auto 14px;
    animation: appmSpin .9s linear infinite;
}

/* Icon bubble */
.appm-icon {
    width: 70px;
    height: 70px;
    margin: 6px auto 10px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 34px;
    color: #fff;
}

    .appm-icon.success {
        background: #28a745;
    }

    .appm-icon.error {
        background: #dc3545;
    }

    .appm-icon.warning {
        background: #f59e0b;
    }

/* Footer button */
.appm-footer {
    display: flex;
    justify-content: center;
    margin-top: 6px;
}

.appm-btn {
    border: none;
    border-radius: 8px;
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    color: #fff;
}

    .appm-btn.success {
        background: #28a745;
    }

        .appm-btn.success:hover {
            background: #218838;
        }

    .appm-btn.error {
        background: #dc3545;
    }

        .appm-btn.error:hover {
            background: #c82333;
        }

    .appm-btn.warning {
        background: #f59e0b;
    }

        .appm-btn.warning:hover {
            background: #d97706;
        }

@keyframes appmSpin {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes appmFade {
    from {
        opacity: 0;
        transform: scale(.96)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}