/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/


.loader {
    width: 48px;
    height: 48px;
    border: 5px solid #FFF;
    border-bottom-color: #FF3D00;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}


/* ----------------------------------------------------------------
	Campos de respuesta unificados: texto, desplegables y Select2

	Mismo aspecto en todos los formularios de 2026 para que se reconozca
	de un vistazo dónde se responde: gris muy suave en reposo, blanco con
	borde azul al escribir, y un gris más marcado para lo no editable.

	El prefijo "body" gana a style.css, a bootstrap.css y a select2.min.css
	(que se carga DESPUÉS de este archivo) sin usar !important. Los estados
	de error (.error / .is-invalid), las secciones .dark y las esquinas
	interiores de .input-group tienen reglas más específicas y siguen mandando.
-----------------------------------------------------------------*/

body .form-control {
    height: 44px;
    padding: 8px 14px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    color: #1d2733;
    background-color: #f4f6f8;
    border: 1.5px solid #b8c2cc;
    border-radius: 8px;
    box-shadow: none;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, background-color .15s ease-in-out;
}

body .form-control:hover {
    border-color: #8a96a3;
}

body .form-control:focus,
body .form-control:active {
    background-color: #ffffff;
    border-color: #2c9cc3;
    box-shadow: 0 0 0 3px rgba(44, 156, 195, .18);
    outline: 0;
}

body .form-control::placeholder {
    color: #8a94a0;
}

body textarea.form-control {
    height: auto;
    min-height: 88px;
}

/* Campo pequeño (p. ej. el cupón de descuento) */
body .form-control-sm {
    height: 36px;
    padding: 5px 10px;
    font-size: 14px;
}

/* No editable: gris más marcado, distinto del gris suave de los activos */
body .form-control:disabled,
body .form-control[readonly] {
    background-color: #e9ecef;
    color: #6c757d;
    border-color: #d5dbe1;
    box-shadow: none;
    cursor: not-allowed;
}

/* ── Select2: la misma caja que los campos de texto ── */
body .select2-container--default .select2-selection--single {
    height: 44px;
    background-color: #f4f6f8;
    border: 1.5px solid #b8c2cc;
    border-radius: 8px;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, background-color .15s ease-in-out;
}

body .select2-container--default .select2-selection--single:hover {
    border-color: #8a96a3;
}

body .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 41px;
    padding-left: 14px;
    padding-right: 34px;
    font-size: 16px;
    color: #1d2733;
}

body .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #8a94a0;
}

body .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 41px;
    right: 6px;
}

body .select2-container--default.select2-container--focus .select2-selection--single,
body .select2-container--default.select2-container--open .select2-selection--single {
    background-color: #ffffff;
    border-color: #2c9cc3;
    box-shadow: 0 0 0 3px rgba(44, 156, 195, .18);
}

body .select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: #e9ecef;
    border-color: #d5dbe1;
    cursor: not-allowed;
}

body .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered {
    color: #6c757d;
}

body .select2-dropdown {
    border-color: #b8c2cc;
}