/* public/assets/css/style.css */

body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Que las cards no sean gigantes en pantallas grandes */
@media (min-width: 992px) {
    main .card {
        border-radius: 0.75rem;
    }
}

pre {
    max-height: 400px;
}

.bg-orange { background-color: #fd7e14!important; }

.mw_900 { max-width: 900px !important; margin:auto;}
.mw_1200 { max-width: 1200px !important; margin:auto;}
.mw_1600 { max-width: 1600px !important; margin:auto;}
/*| ***************************************************************** */

/* Wizard de pasos */
.step-pane {
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 0.25s ease-out, transform 0.25s ease-out;
}

.step-pane.step-active {
    opacity: 1;
    transform: translateY(0);
}

/* Loader de lupa animada */
.search-loader {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
}

.search-loader-icon {
    width: 100%;
    height: 100%;
    stroke: #fff;
}

/* círculo gira */
.search-loader-circle {
    stroke: rgba(255, 255, 255, 0.6);
    stroke-dasharray: 60;
    stroke-dashoffset: 0;
    transform-origin: 28px 28px;
    animation: loader-spin 1s linear infinite;
}

/* lupa entra/sale ligeramente */
.search-loader-glass {
    stroke: #fff;
    transform-origin: 28px 28px;
    animation: loader-pulse 1.2s ease-in-out infinite;
}

/* barras de “datos” */
.search-loader-bar {
    fill: rgba(255, 255, 255, 0.8);
    animation: loader-bars 1.1s ease-in-out infinite;
}

.search-loader-bar:nth-child(3) {
    animation-delay: 0.1s;
}
.search-loader-bar:nth-child(4) {
    animation-delay: 0.2s;
}

@keyframes loader-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

@keyframes loader-pulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.05); }
}

@keyframes loader-bars {
    0%, 100% { transform: translateX(0); opacity: 0.3; }
    50%      { transform: translateX(4px); opacity: 1; }
}

/* ***************************************************** */
/* Loader entre pasos: tres puntitos */
.step-loader {
    min-height: 1.5rem;
}

.step-dot {
    display: inline-block;
    width: 0.35rem;
    height: 0.35rem;
    margin: 0 0.12rem;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.35);
    animation: step-dots 0.8s infinite ease-in-out;
}

.step-dot:nth-child(2) {
    animation-delay: 0.15s;
}

.step-dot:nth-child(3) {
    animation-delay: 0.3s;
}

@keyframes step-dots {
    0%, 80%, 100% {
        transform: translateY(0);
        opacity: 0.4;
    }
    40% {
        transform: translateY(-4px);
        opacity: 1;
    }
}

.fade-in {
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.35s ease, transform 0.35s ease;
}

.fade-in.show {
    opacity: 1;
    transform: translateY(0);
}