/* ============================================================
   SHAIYA BLUR - ESCALAS COMPACTAS
   white-pages2.css
   ============================================================ */

/* ------------------------------------------------------------
   CONTENEDOR GENERAL
   ------------------------------------------------------------ */

.scale-page,
.scale-page *,
#spend-scales-page,
#spend-scales-page * {
    box-sizing: border-box;
}

/* El contenido de la página no necesita una altura enorme */
.scale-page,
#spend-scales-page {
    height: auto !important;
    min-height: 0 !important;
}


/* ------------------------------------------------------------
   ESCALA
   ------------------------------------------------------------ */

.scale-reward {
    height: auto !important;
    min-height: 0 !important;

    margin: 0 0 18px !important;
    padding: 0 !important;

    overflow: visible !important;
}


/* ------------------------------------------------------------
   CABECERA DE CADA ESCALA
   ------------------------------------------------------------ */

.scale-reward > header,
.scale-reward-header,
.scale-drawer-heading {
    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 8px 12px !important;

    overflow: visible !important;
}


/* Evita que el header herede alturas gigantes */
.scale-reward > header *,
.scale-reward-header *,
.scale-drawer-heading * {
    max-height: none !important;
}


/* ------------------------------------------------------------
   ZONA INTERIOR DE LA ESCALA
   ------------------------------------------------------------ */

.scale-reward-body,
.scale-drawer-body,
.scale-reward-content,
.scale-reward-inner {
    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 8px 12px 12px !important;

    overflow: visible !important;
}


/* ------------------------------------------------------------
   TRACK / LÍNEA DE PROGRESO
   ------------------------------------------------------------ */

.scale-track,
.scale-reward-track {
    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
}


/* ------------------------------------------------------------
   ZONA DE PREMIOS
   ------------------------------------------------------------ */

.scale-rewards,
.scale-reward-list,
.scale-reward-items,
.scale-reward-grid {
    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
}


/* ------------------------------------------------------------
   PREMIOS INDIVIDUALES
   ------------------------------------------------------------ */

.scale-reward-item,
.scale-reward-card,
.scale-item {
    height: auto !important;
    min-height: 0 !important;
}


/* ------------------------------------------------------------
   DESACTIVAR ALTURAS FIJAS HEREDADAS
   ------------------------------------------------------------ */

.scale-reward [style*="height"],
.scale-reward [style*="min-height"] {
    max-height: none;
}


/* ------------------------------------------------------------
   PROGRESO
   ------------------------------------------------------------ */

.scale-progress,
.scale-progress-bar,
.scale-track-progress {
    height: auto !important;
    min-height: 0 !important;
}


/* ------------------------------------------------------------
   TEXTO INFERIOR / INFORMACIÓN
   ------------------------------------------------------------ */

.scale-reward-footer,
.scale-reward-info,
.scale-reward-description {
    height: auto !important;
    min-height: 0 !important;

    margin: 8px 0 0 !important;
    padding: 0 !important;
}


/* ------------------------------------------------------------
   CONTENEDORES GENÉRICOS INTERNOS
   ------------------------------------------------------------ */

.scale-reward .drawer,
.scale-reward .drawer-body,
.scale-reward .drawer-content,
.scale-reward .content,
.scale-reward .inner {
    height: auto !important;
    min-height: 0 !important;
}


/* ------------------------------------------------------------
   MUY IMPORTANTE:
   ELIMINAR ESPACIOS VACÍOS PROVOCADOS POR FLEX
   ------------------------------------------------------------ */

.scale-reward {
    align-content: start !important;
    align-items: start !important;
}

.scale-reward > div {
    align-content: start !important;
}


/* ------------------------------------------------------------
   TRACK DE PREMIOS
   ------------------------------------------------------------ */

.scale-track-scroll,
.scale-reward-scroll {
    height: auto !important;
    min-height: 0 !important;

    max-height: none !important;

    overflow-x: auto !important;
    overflow-y: visible !important;
}


/* ------------------------------------------------------------
   REDUCCIÓN GENERAL DE ESPACIADO
   ------------------------------------------------------------ */

.scale-reward h1,
.scale-reward h2,
.scale-reward h3,
.scale-reward h4,
.scale-reward p {
    margin-top: 0;
}

.scale-reward h3 {
    margin-bottom: 3px !important;
}


/* ------------------------------------------------------------
   BLOQUES DE INFORMACIÓN
   ------------------------------------------------------------ */

.scale-reward-meta,
.scale-reward-status,
.scale-reward-progress,
.scale-reward-summary {
    height: auto !important;
    min-height: 0 !important;

    margin-top: 5px !important;
    margin-bottom: 5px !important;
}


/* ------------------------------------------------------------
   RECOMPENSAS
   ------------------------------------------------------------ */

.scale-reward-list > *,
.scale-reward-grid > *,
.scale-rewards > * {
    min-height: 0 !important;
}


/* ------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------ */

@media (max-width: 900px) {

    .scale-reward {
        margin-bottom: 14px !important;
    }

    .scale-reward > header,
    .scale-reward-header,
    .scale-drawer-heading {
        padding: 7px 10px !important;
    }

    .scale-reward-body,
    .scale-drawer-body,
    .scale-reward-content,
    .scale-reward-inner {
        padding: 7px 10px 10px !important;
    }
}