/* ===== Paleta base (constante) ===== */
:root{
    --mc-rojo: #b32e2e;
    --mc-rojo-600:#9d2828;
    --mc-azul: #0D47A1;
    --mc-primario: var(--mc-rojo);
    --mc-texto: #111827;
    --mc-muted: #6b7280;
    --mc-borde: #e5e7eb;
    --mc-card: #ffffff;
    --mc-focus: #3b82f6; /* anillo accesible */
    --mc-shadow: 0 6px 18px rgba(17,24,39,.08);
    --mc-radius: 12px;
    --mc-space-1: .5rem;
    --mc-space-2: .75rem;
    --mc-space-3: 1rem;
    --mc-space-4: 1.25rem;

    /* Alturas */
    --captcha-h: 78px;

    /*Info box*/
    --info-box-bg: #fff8f8;
    --info-box-border: #efcaca;
    --info-box-border-left: #b71c1c;

    --info-box-badge-bg: #c62828;
    --info-box-badge-color: #ffffff;

    --info-box-item-bg: #ffffff;
    --info-box-item-border: #f1e1e1;
    --info-box-item-color: #2f3542;

    --info-box-num-bg: #fdeaea;
    --info-box-num-color: #b71c1c;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);

    /* superficie */
    --mc-surface: #ffffff;
    --mc-surface-soft: #fcfcfd;
    --mc-surface-hover: #fff6f6;

    /* bordes */
    --mc-border-soft: #d9dee7;
    --mc-border-light: #e7ebf1;

    /* texto */
    --mc-text: #2f3542;
}

/* ===== Tema claro ===== */
:root[data-bs-theme="light"] {
    --mc-body-bg: #f8f9fa;
    --mc-card: #ffffff;
    --mc-borde: #e5e7eb;
    --mc-texto: #111827;
    --mc-muted: #6b7280;

    --mc-header-bg: var(--mc-rojo, #a3212d);
    --mc-header-color: #ffffff;

    --mc-info-bg: #fff5f5;
    --mc-info-border: #e03131;

    --mc-sticky-bg: rgba(255,255,255,.95);

    --mc-modal-bg: #ffffff;
    --mc-modal-border-top: rgba(0, 0, 0, .06);

    /*Info box*/
    --info-box-bg: #fff8f8;
    --info-box-border: #efcaca;
    --info-box-border-left: #b71c1c;

    --info-box-badge-bg: #c62828;
    --info-box-badge-color: #ffffff;

    --info-box-item-bg: #ffffff;
    --info-box-item-border: #f1e1e1;
    --info-box-item-color: #2f3542;

    --info-box-num-bg: #fdeaea;
    --info-box-num-color: #b71c1c;

    /* superficie */
    --mc-surface: #ffffff;
    --mc-surface-soft: #fcfcfd;
    --mc-surface-hover: #fff6f6;

    /* bordes */
    --mc-border-soft: #d9dee7;
    --mc-border-light: #e7ebf1;

    /* texto */
    --mc-text: #2f3542;
}

/* ===== Tema oscuro ===== */
:root[data-bs-theme="dark"] {
    --mc-body-bg: #020617;      /* casi negro azulado */
    --mc-card: #020617;
    --mc-borde: #1f2937;
    --mc-texto: #e5e7eb;
    --mc-muted: #9ca3af;

    --mc-header-bg: #111827;
    --mc-header-color: #f9fafb;

    --mc-info-bg: #111827;
    --mc-info-border: #b91c1c;

    --mc-sticky-bg: rgba(15,23,42,.98);

    --mc-modal-bg: #020617;
    --mc-modal-border-top: rgba(148,163,184,.4);

    /*Info box*/
    --info-box-bg: #1f1616;
    --info-box-border: #4a2525;
    --info-box-border-left: #ef5350;

    --info-box-badge-bg: #d84343;
    --info-box-badge-color: #ffffff;

    --info-box-item-bg: #2a1d1d;
    --info-box-item-border: #4a2c2c;
    --info-box-item-color: #f3eeee;

    --info-box-num-bg: #4a2525;
    --info-box-num-color: #ffb4b4;

    --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.35);

    --mc-surface: #222834;
    --mc-surface-soft: #1b1f27;
    --mc-surface-hover: #2a3140;

    --mc-border-soft: #38404d;
    --mc-border-light: #394252;

    --mc-text: #e8edf5;

    --mc-rojo-soft: #ffb3b6;
}

html {
    font-size: 100%;
}
/* ===== Body ===== */
body{
    font-family: Roboto, system-ui, -apple-system, Segoe UI, Helvetica, Arial, sans-serif;
    background-color: var(--mc-body-bg);
    color: var(--mc-texto);
}

/* ===== Contenedores y tarjetas ===== */
.section-card{
    background: var(--mc-card);
    border: 1px solid var(--mc-borde);
    border-radius: var(--mc-radius);
    box-shadow: var(--mc-shadow);
    padding: var(--mc-space-4);
    margin-bottom: var(--mc-space-3);
}

.section-title{
    display:flex;
    align-items:center;
    gap:.5rem;
    font-weight:600;
    font-size:1.1rem;
    color:var(--mc-texto);
    margin: 0 0 var(--mc-space-2);
}
.list-group-item{
    color:var(--mc-texto) !important;
}
/* Header institucional */
.mc-header{
    background: var(--mc-header-bg);
    color: var(--mc-header-color);
    border-radius: 14px;
}
.mc-header h5,
.mc-header h6{
    font-weight:600;
}

/* Badge de pasos u otros */
.badge-step {
    background: #e9ecef;
    color: #111827;
    font-weight: 600;
}

/* Caja informativa (texto importante) */
.info-box {
    background: var(--info-box-bg);
    border: 1px solid var(--info-box-border);
    /*border-left: 5px solid var(--info-box-border-left);*/
    border-radius: 12px;
    padding: .8rem .95rem;
    transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}

.info-box-header {
    margin-bottom: .45rem;
}

.info-box-badge {
    background: var(--info-box-badge-bg);
    color: var(--info-box-badge-color);
    font-weight: 600;
    font-size: .75rem;
    padding: .25rem .6rem;
    border-radius: 999px;
    letter-spacing: .03em;
    transition: background-color .25s ease, color .25s ease;
}

.info-box-list {
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.info-box-item {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    background: var(--info-box-item-bg);
    border: 1px solid var(--info-box-item-border);
    border-radius: 8px;
    padding: .55rem .7rem;
    font-size: .92rem;
    line-height: 1.35;
    color: var(--info-box-item-color);
    transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}
.info-box-item:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

.info-num {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--info-box-num-bg);
    color: var(--info-box-num-color);
    font-weight: 700;
    font-size: .8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background-color .25s ease, color .25s ease;
}


/* ===== Inputs: look moderno + focus accesible ===== */
.form-control,
.form-select{
    border-radius: 10px;
    border-color: var(--mc-borde);
    transition: box-shadow .18s ease, border-color .18s ease, background-color .18s ease, color .18s ease;
}

.form-control:focus,
.form-select:focus{
    border-color: var(--mc-focus);
    box-shadow: 0 0 0 .2rem rgba(59,130,246,.25);
}

.is-invalid.form-control,
.is-invalid.form-select{
    border-color:#dc3545;
    box-shadow: 0 0 0 .2rem rgba(220,53,69,.15);
}

.help,
.form-text {
    font-size: .85rem;
    color: var(--mc-muted);
}

/* Labels requeridos */
.required::after{
    content:" *";
    color:#dc3545;
    font-weight:700;
}

/* ===== Botones ===== */
.btn-primary{
    background: var(--mc-primario);
    border-color: var(--mc-primario);
    border-radius: 10px;
    box-shadow: 0 6px 16px rgba(179,46,46,.25);
    transition: transform .08s ease, box-shadow .2s ease, background .2s ease;
}
.btn-primary:hover{
    background: var(--mc-rojo-600);
}
.btn-primary:active{
    transform: translateY(1px);
    box-shadow: 0 4px 10px rgba(179,46,46,.25);
}

.btn-outline-primary{
    border-color: var(--mc-primario);
    color: var(--mc-primario);
    border-radius: 10px;
}
.btn-outline-primary:hover{
    background: var(--mc-primario);
    color:#fff;
}

/* ===== Checkbox/Radio (si aún usas custom-control) ===== */
.custom-control-label{
    padding-left:.25rem;
    cursor:pointer;
}
.custom-control-input:focus ~ .custom-control-label::before{
    box-shadow: 0 0 0 .2rem rgba(59,130,246,.25);
}

/* ===== Barra de acciones fija (botón + captcha) ===== */
.sticky-actions{
    position: sticky;
    bottom: 0;
    z-index: 30;
    background: var(--mc-sticky-bg);
    backdrop-filter: saturate(180%) blur(6px);
    border-top: 1px solid var(--mc-borde);
}

/* ===== Dropzone para adjuntos (si se usa) ===== */
.dropzone{
    border: 2px dashed var(--mc-borde);
    border-radius: 12px;
    padding: var(--mc-space-3);
    text-align: center;
    color: var(--mc-muted);
    transition: border-color .2s ease, background .2s ease;
}
.dropzone:hover{
    border-color: var(--mc-primario);
    background:#fafafa;
}
.dropzone input[type=file]{
    opacity:0;
    position:absolute;
    inset:0;
    cursor:pointer;
}

/* ===== reCAPTCHA + botón misma altura ===== */
.same-height{
    height: var(--captcha-h);
}
.g-recaptcha{
    min-height: var(--captcha-h);
}

/* ===== Modal look (se adapta al tema) ===== */
.mc-modal {
    border: 0;
    border-radius: 16px;
    box-shadow: 0 18px 40px rgba(16, 24, 40, .18);
    overflow: hidden;
    background-color: var(--mc-modal-bg);
}

.mc-modal-header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .9rem 1.25rem;
    background: linear-gradient(180deg, rgba(163, 33, 45, .10), rgba(163, 33, 45, 0));
    border-bottom: 1px solid rgba(0, 0, 0, .06);
}

.mc-modal-icon {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(163, 33, 45, .12);
    color: #a3212d;
}

.mc-modal-footer {
    background: var(--mc-modal-bg);
    border-top: 1px solid var(--mc-modal-border-top);
}

.mc-list {
    list-style: none;
    padding-left: 0;
    margin: .75rem 0 0 0;
}

.mc-list li {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    padding: .4rem 0;
    border: 0;
}

.mc-li-icon {
    color: #198754;
    margin-top: .1rem;
}

/* ===== Ajustes responsive ===== */
@media (max-width: 767.98px){
    .section-card{
        padding: var(--mc-space-3);
    }

    .sticky-actions .col-md-6{
        flex-direction: column;
        align-items: stretch !important;
    }

    .g-recaptcha{
        margin-bottom: .75rem;
        align-self:center;
    }

    .same-height{
        height: 56px;
    }
}

@media (max-width: 576px) {
    .modal-dialog {
        margin: 0 !important;
        max-width: 100% !important;
        height: 100%;
    }

    .modal-content {
        height: 100%;
        border-radius: 0;
    }

    .mc-modal-footer .btn {
        width: 100%;
    }
}

.logo-mc { max-height:64px; }
.lang-select { width:100px; }
.text-justify { text-align: justify; }

/* ===============================
   BLOQUE MOTIVOS
================================*/

.mc-motivos{
    margin:0;
    padding:1rem 1rem .9rem;
    /*border:1px solid var(--mc-border-soft);*/
    border-radius:12px;
    background:var(--mc-surface-soft);
}

/* titulo */
.mc-motivos__legend{
    /*margin:0 0 .75rem;*/
    margin-left: -12px;
    padding:0 .35rem;
    font-size:1rem;
    /*font-weight:700;*/
    /*color:var(--mc-rojo);*/
    border:0;
}

/* ===============================
   CHECK ITEM
================================*/

.mc-check{
    display:flex;
    align-items:flex-start;
    gap:.65rem;
    padding:.6rem .7rem;
    border:1px solid var(--mc-border-light);
    border-radius:10px;
    background:var(--mc-surface);
    transition:all .18s ease;
    width:96%;
}

.mc-check:hover{

    background:var(--mc-surface-hover);
    border-color:var(--mc-rojo-soft);

}

/* checkbox */
.mc-check-input{

    margin-top:.15rem;
    cursor:pointer;

}

/* label */
.mc-check-label{

    font-size:.95rem;
    line-height:1.4;

    color:var(--mc-text);

    cursor:pointer;
}

/* foco accesible */

.mc-check-input:focus{

    border-color:var(--mc-rojo);
    box-shadow:0 0 0 .2rem rgba(163,30,34,.18);

}

/* seleccionado */

.mc-check-input:checked{

    background-color:var(--mc-rojo);
    border-color:var(--mc-rojo);

}

/* highlight cuando está checked */

.mc-check:has(.mc-check-input:checked){

    border-color:rgba(163,30,34,.28);
    background:var(--mc-surface-hover);

}


/* ===============================
   OTRO MOTIVO
================================*/

.mc-otro-motivo{

    border-radius:10px;

}

/*UPLOAD*/
/* ===== Upload list PRO ===== */
.mc-upload-row{
    padding: 18px 20px;
    border: 1px solid var(--mc-borde);
    border-radius: var(--mc-radius);
    background: var(--mc-card);
    transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}

.mc-upload-row + .mc-upload-row{
    margin-top: 14px; /* aire entre filas */
}

.mc-upload-row:hover{
    border-color: rgba(0,0,0,.15);
    box-shadow: var(--mc-shadow);
    transform: translateY(-1px);
}

.mc-upload-title{
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 700;
    font-size: .98rem;
    line-height: 1.2;
}

.mc-upload-desc{
    margin-top: .25rem;
    color: var(--bs-secondary-color);
    font-size: .85rem;
}

.mc-upload-meta{
    margin-top: .35rem;
    color: var(--bs-secondary-color);
    font-size: .8rem;
}

.mc-upload-meta strong{ font-weight: 600; }

.mc-upload-badge{
    margin-left: auto;
    font-size: .72rem;
    padding: .35rem .5rem;
    border-radius: 999px;
}

.mc-upload-fileinfo{
    margin-top: .5rem;
    font-size: .85rem;
    display: none;
}

.mc-upload-fileinfo.is-visible{ display: flex; gap: .5rem; align-items: center; }

.mc-upload-filepill{
    display: inline-flex;
    gap: .5rem;
    align-items: center;
    padding: .35rem .6rem;
    border-radius: 999px;
    background: rgba(13,110,253,.08); /* azul suave */
    color: #0b5ed7;
    max-width: 100%;
}

.mc-upload-filepill span{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 520px;
}

@media (max-width: 576px){
    .mc-upload-row{ padding: 16px 14px; }
    .mc-upload-filepill span{ max-width: 220px; }
}

/*Configuración de accesibilidad*/
.mc-fab{
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 1056;
    width: 48px;
    height: 48px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,.12);
    background: var(--bs-body-bg);
    box-shadow: 0 8px 20px rgba(0,0,0,.15);
    display: grid;
    place-items: center;
}

.mc-access-panel{
    position: fixed;
    right: 16px;
    bottom: 72px;
    z-index: 1056;
    width: 260px;
    max-width: calc(100vw - 24px);
    background: var(--bs-body-bg);
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 16px;
    padding: 12px;
}

@media (max-width: 576px){
    .mc-access-panel{
        left: 12px;
        right: 12px;
        width: auto;
    }
}

/*Footer*/
.sticky-actions{
    position: sticky;
    bottom: 0;
    z-index: 1030;
    background: var(--bs-body-bg, #fff);
    border-top: 1px solid var(--bs-border-color, #dee2e6);
}

.sticky-actions__inner{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    flex-wrap: wrap;
}

.submit-status{
    flex: 1 1 320px;
    min-width: 260px;
    margin: 0;
}

.sticky-actions__controls{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
    flex-wrap: wrap;
}

#btn-enviar{
    min-width: 180px;
    min-height: 76px;
    white-space: nowrap;
}

@media (max-width: 767.98px){
    .sticky-actions{
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }

    .sticky-actions__inner{
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 1rem;
    }

    .submit-status{
        flex: 1 1 auto;
        min-width: 100%;
        text-align: center;
    }

    .sticky-actions__controls{
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 1rem;
    }

    .sticky-actions__controls .g-recaptcha{
        transform: scale(0.92);
        transform-origin: center top;
    }

    #btn-enviar{
        width: 100%;
        max-width: 320px;
        min-height: 54px;
    }
}