/* =====================================================
   Consulta pública de RFC (includes/consulta-rfc.php)
   ===================================================== */
.crfc {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-xl);
    padding: 28px;
    width: 100%;
    max-width: 460px;
    text-align: left;
    box-shadow: var(--shadow-lg);
}
.crfc--pagina {
    max-width: 720px;
    margin-top: 28px;
}
.crfc-head {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 18px;
}
.crfc-icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(220, 38, 38, 0.15);
    color: var(--primary-light);
    font-size: 1.1rem;
}
.crfc-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--text-white);
    line-height: 1.3;
    margin: 0 0 4px;
}
.crfc-sub {
    color: var(--text-muted);
    font-size: 0.92rem;
    line-height: 1.45;
    margin: 0;
}
.crfc-form {
    display: flex;
    gap: 10px;
}
.crfc-input {
    flex: 1;
    min-width: 0;
    background: var(--bg-darker);
    border: 1px solid var(--border-color-hover);
    border-radius: var(--radius-md);
    color: var(--text-white);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 1.05rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 13px 14px;
    outline: none;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.crfc-input::placeholder {
    color: var(--text-dark);
    text-transform: none;
    letter-spacing: 0;
    font-family: var(--font-family);
}
.crfc-input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.25);
}
.crfc-btn {
    flex-shrink: 0;
    white-space: nowrap;
}
.crfc-btn[disabled] {
    opacity: 0.65;
    cursor: wait;
}
.crfc-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}
.crfc-corte {
    margin: 14px 0 0;
    color: var(--text-dark);
    font-size: 0.8rem;
}
.crfc-corte i {
    margin-right: 4px;
}

/* Resultado */
.crfc-result:not(:empty) {
    margin-top: 16px;
}
.crfc-msg {
    border-radius: var(--radius-md);
    padding: 12px 14px;
    font-size: 0.92rem;
    line-height: 1.5;
    color: var(--text-light);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--border-color);
}
.crfc-msg--warning {
    background: rgba(245, 158, 11, 0.1);
    border-color: rgba(245, 158, 11, 0.35);
}
.crfc-msg--muted {
    color: var(--text-muted);
}
.crfc-card {
    border-radius: var(--radius-lg);
    padding: 18px;
    border: 1px solid var(--border-color);
    background: rgba(255, 255, 255, 0.03);
}
.crfc-card--danger  { border-color: rgba(220, 38, 38, 0.55);  background: rgba(220, 38, 38, 0.08); }
.crfc-card--warning { border-color: rgba(245, 158, 11, 0.5);  background: rgba(245, 158, 11, 0.07); }
.crfc-card--info    { border-color: rgba(59, 130, 246, 0.45); background: rgba(59, 130, 246, 0.07); }
.crfc-card--ok      { border-color: rgba(16, 185, 129, 0.45); background: rgba(16, 185, 129, 0.07); }
.crfc-card-top {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-bottom: 10px;
}
.crfc-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    padding: 4px 12px;
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.4;
}
.crfc-badge--danger  { background: rgba(220, 38, 38, 0.2);  color: #FCA5A5; }
.crfc-badge--warning { background: rgba(245, 158, 11, 0.2); color: #FCD34D; }
.crfc-badge--info    { background: rgba(59, 130, 246, 0.2); color: #93C5FD; }
.crfc-badge--ok      { background: rgba(16, 185, 129, 0.2); color: #6EE7B7; }
.crfc-badge--muted   { background: rgba(255, 255, 255, 0.08); color: var(--text-muted); }
.crfc-fuente {
    color: var(--text-muted);
    font-size: 0.8rem;
}
.crfc-rfc {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-white);
    letter-spacing: 0.04em;
}
.crfc-nombre {
    color: var(--text-light);
    font-weight: 600;
    margin-top: 2px;
    overflow-wrap: anywhere;
}
.crfc-nota {
    color: var(--text-dark);
    font-size: 0.8rem;
    line-height: 1.45;
    margin: 8px 0 0;
}
.crfc-etapas {
    list-style: none;
    margin: 12px 0 4px;
    padding: 0;
    border-left: 2px solid var(--border-color-hover);
}
.crfc-etapas li {
    padding: 4px 0 4px 12px;
    font-size: 0.86rem;
    display: flex;
    flex-wrap: wrap;
    gap: 2px 10px;
}
.crfc-etapa {
    color: var(--text-light);
    font-weight: 600;
    min-width: 128px;
}
.crfc-etapa-fecha {
    color: var(--text-muted);
}
.crfc-etapa-oficio {
    flex-basis: 100%;
    color: var(--text-dark);
    font-size: 0.78rem;
    overflow-wrap: anywhere;
}
.crfc-txt {
    color: var(--text-light);
    font-size: 0.9rem;
    line-height: 1.55;
    margin: 10px 0 0;
}
.crfc-historial {
    margin-top: 12px;
    font-size: 0.86rem;
    color: var(--text-muted);
}
.crfc-historial summary {
    cursor: pointer;
}
.crfc-hist-item {
    margin-top: 10px;
}
.crfc-cta {
    margin-top: 16px;
    width: 100%;
    justify-content: center;
    text-align: center;
    white-space: normal; /* .btn no parte línea y en móvil la frase no cabe */
}
.crfc-cta-sub {
    color: var(--text-muted);
    font-size: 0.8rem;
    text-align: center;
    margin: 6px 0 0;
}

/* En la portada ocupa el lugar de la tarjeta de ejemplo; en móvil va después del texto. */
.hero-visual--consulta {
    align-items: center;
    min-width: 0; /* que el resultado no ensanche la columna del hero */
}
.crfc {
    min-width: 0;
}
@media (max-width: 1024px) {
    .hero-visual--consulta {
        order: 0;
        justify-content: center;
    }
    .crfc--hero {
        margin: 8px auto 0;
    }
}
@media (max-width: 480px) {
    .crfc {
        padding: 20px 16px;
    }
    .crfc-form {
        flex-direction: column;
    }
    .crfc-btn {
        width: 100%;
        justify-content: center;
    }
    .crfc-etapa {
        min-width: 0;
    }
}

/* Lista de espera de la vigilancia por lista (prueba de demanda) */
.crfc-espera {
    margin-top: 14px;
    border-top: 1px solid var(--border-color);
    padding-top: 12px;
}
.crfc-espera-abrir {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    width: 100%;
    background: none;
    border: none;
    padding: 0;
    color: var(--text-muted);
    font: inherit;
    font-size: 0.86rem;
    line-height: 1.45;
    text-align: left;
    cursor: pointer;
}
.crfc-espera-abrir i {
    color: var(--accent);
    margin-top: 3px;
}
.crfc-espera-abrir strong {
    color: var(--accent-light);
}
.crfc-espera-abrir:hover span {
    color: var(--text-light);
}
.crfc-espera-form {
    margin-top: 12px;
}
.crfc-espera-txt {
    color: var(--text-light);
    font-size: 0.88rem;
    line-height: 1.5;
    margin: 0 0 10px;
}
.crfc-espera-campos {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.crfc-espera-campos .crfc-input {
    flex: 1 1 200px;
    font-family: var(--font-family);
    font-size: 0.95rem;
    letter-spacing: 0;
    text-transform: none;
    padding: 11px 12px;
}
.crfc-select {
    flex: 1 1 200px;
    background: var(--bg-darker);
    border: 1px solid var(--border-color-hover);
    border-radius: var(--radius-md);
    color: var(--text-white);
    font: inherit;
    font-size: 0.92rem;
    padding: 11px 10px;
}
.crfc-espera-btn {
    flex: 0 0 auto;
}
.crfc-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
}
.crfc-espera-legal {
    color: var(--text-dark);
    font-size: 0.76rem;
    line-height: 1.45;
    margin: 8px 0 0;
}
.crfc-espera-legal a {
    color: var(--text-muted);
    text-decoration: underline;
}
.crfc-espera-msg:not(:empty) {
    margin-top: 8px;
    font-size: 0.86rem;
    color: #FCD34D;
}
.crfc-espera-msg--ok:not(:empty) {
    color: #6EE7B7;
    font-weight: 600;
}
@media (max-width: 480px) {
    .crfc-espera-btn {
        width: 100%;
        justify-content: center;
    }
}
