/* ============================================================================
 * generaltools.redesign.css — Superset tokenizado de generaltools.css
 *
 * Origen: /tools/components/generaltools/assets/css/generaltools.css (351 líneas, 59 vistas).
 *
 * MODO: SUPERSET REEMPLAZO (regla del plan §"CSS globales compartidos").
 *   Copia íntegra del original + tokenizations en VALORES de propiedades existentes.
 *   Reemplaza al original en la carga; el original NO se carga.
 *
 * REGLA ESTRICTA (rev 2026-05-06):
 *   No se agregan propiedades nuevas. Solo se cambian valores de propiedades
 *   ya declaradas en el original.
 *
 * Tokenizations aplicadas (mapeo hex → token):
 *   #e7e7e7  → var(--color-border-default)   (bordes finos del template)
 *   #ffffff  → var(--neutral-white)
 *   #67757c  → var(--neutral-700)            (gris medio del template)
 *   #dddddd  → var(--neutral-300)
 *   #000000  → var(--neutral-900)            (no es negro puro real)
 *   #EDF5FA  → var(--neutral-200)            (azul claro template, tokenizado 2026-05-06)
 *   #14477e  → var(--brand-deep)
 *   border-radius: 100px → var(--radius-full)
 *   border-radius: 10px  → var(--radius-lg)  (+2px de ajuste a la escala)
 *
 * Preservado (no tokenizado por ser genérico/legacy específico):
 *   rgba(0, 0, 0, .15) en .nice-select (border genérico Bootstrap)
 *   rgba(0, 0, 0, .3)  en #htOptions (handle drag indicator)
 *   rgb(133 133 133 / 40%) en overlay menuOptionsActive
 * ============================================================================ */

.bottom-menu {
    border-top: .5px solid var(--color-border-default);
    bottom: 0;
    width: inherit;
    background-color: var(--neutral-white);
    overflow: hidden;
    z-index: 100;
    position: fixed;
    padding-top: var(--space-3);
    padding-bottom: var(--space-3);
}

#contentResumeBuyCredits {
    background-color: var(--neutral-300);
    z-index: 1000;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

.bottom-menu .list-options {
    list-style: none;
    display: flex;
    margin-bottom: 0px;
    padding-left: 0px;
}

.bottom-menu .list-options .option {
    width: 100%;
    text-align: center;
    cursor: pointer;
}

.bottom-menu .list-options .option a {
    display: inline-block;
    width: 100%;
    text-align: center;
}

.bottom-menu .list-options .option a i {
    font-size: var(--font-h3);
    color: var(--neutral-700);
}

.bottom-menu .list-options .option a label,
#contentOptions .col-3 label,
#contentOptions .col-4 label,
#contentOptions .col-6 label {
    font-size: 8px;
    display: block;
    margin: 0px;
    color: var(--neutral-700);
    font-weight: var(--font-weight-bold);
}

.content-capture-sale {
    border-top: .5px solid var(--color-border-default);
    bottom: 0;
    width: inherit;
    background-color: var(--neutral-white);
    overflow: hidden;
    z-index: 100;
    position: fixed;
}

#lblConfigurationBottomMenu {
    position: absolute;
    margin: auto;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 200;
    font-size: 6px;
    color: var(--neutral-700);
    font-weight: var(--font-weight-bold);
    text-align: center;
    margin-bottom: 12px;
}

#btnBuySMS, #btnMoreInformationPackages {
    font-size: 8px !important;
    color: var(--neutral-700) !important;
    padding: 3px 8px !important;
}

#btnBuySMS.text-white, #btnMoreInformationPackages.text-white {
    color: var(--neutral-white) !important;
}

#contentOptions {
    background-color: var(--neutral-white);
    margin-bottom: 10px;
}

#contentOptions > .row {
    padding-left: 20px;
    padding-right: 20px;
}

#lblCountMessagesAvailables {
    margin-top: -2px;
}

#lblMessagesAvailables {
    font-size: 8px;
    line-height: 1.4;
}

.nice-select {
    border: 1px solid rgba(0, 0, 0, .15) !important;
}

.powered-by-sms {
    font-size: var(--font-caption);
}

#htOptions {
    border-top: 4px solid rgba(0,0,0,.3) !important;
    width: 15% !important;
    border-radius: var(--radius-full);
    cursor: pointer;
}

.text-color-default {
    color: var(--neutral-700) !important;
}

.input-group {
    z-index: 1;
}

#div_background.menuOptionsActive {
    overflow-y: unset;
}

#div_background.menuOptionsActive::after,
#div_background.menuOptionsActive::after {
    content: "";
    background: rgb(133 133 133 / 40%);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

#txt_birthdate.form-control:disabled, #txt_birthdate.form-control[readonly] {
    background-color: var(--neutral-white);
}

.titleModalConvertBox {
    color: var(--brand-deep);
    font-family: sans-serif;
}

.labelModalConvertBox {
    color: var(--neutral-700);
    font-family: sans-serif;
}

.fs-16 {
    font-size: var(--font-body);
}

.bg-black {
    background-color: var(--neutral-900);
}

@media screen and (min-width: 768px) {
    #lblConfigurationBottomMenu {
        margin-bottom: 21px;
    }
}

/*====================BOTTOM MENU HIDE====================*/
#contentOptions label {
    font-size: var(--font-body);
    color: var(--neutral-700);
    margin-bottom: 0px !important;
    cursor: pointer;
}

#contentOptions i {
    font-size: var(--font-h4);
    color: var(--neutral-700);
}

.content-card-options {
    cursor: pointer;
    padding-top: 10px;
    padding-bottom: 10px;
}

.content-card-options:focus {
    background-color: var(--neutral-300);
    border-radius: var(--radius-lg);
}

#divErrorRegisterClient {
    display: none;
}

.ws-preline {
    white-space: pre-line;
}

.nice-select .list {
    max-height: 300px;
    overflow: auto !important;
}

.c-p {
    cursor: pointer;
}

#contentReaderQr video {
    width: 100% !important;
}

.no-button {
    background: transparent;
    border: 0px transparent;
    font-size: var(--font-caption);
    font-weight: var(--font-weight-regular);
    color: var(--neutral-700);;
}

.content-input-search-datatable {
    background-color: var(--neutral-200) !important;
    border-radius: var(--radius-lg);
}

.content-input-search-datatable input {
    background-color: transparent !important;
    border-color: transparent !important;
}

.content-input-search-datatable button {
    background-color: transparent !important;
}

.dataTable {
    font-size: var(--font-caption);
}

/*===============MENU===============*/
.topbar {
    border-bottom: .5px solid var(--color-border-default);
    position: fixed;
    width: -webkit-fill-available;
    width: -moz-available;
    background: var(--neutral-white);
}

#contentAppName {
    max-width: fit-content;
    margin-inline: auto;
}

.mini-sidebar #contentAppName {
    display: block;
}

.mini-sidebar .navbar-collapse {
    display: flex;
}

.menu-space {
    height: 50px;
    vertical-align: baseline;
}

.mini-sidebar > #main-wrapper > .topbar > .navbar .navbar-header {
    display: none;
}

.left-sidebar {
    border-right: .5px solid var(--color-border-default);
    padding-top: 50px;
}

.page-wrapper {
    padding-bottom: 0px !important;
    padding-top: 50px;
}

.sidebar-footer a {
    width: 25%;
}

#contentMenuCards {
    padding: 0px 20px;
}

.mini-sidebar .sidebartoggler {
    margin-left: 12px;
}

.mini-sidebar .menu-cards {
    display: none;
}

#lblPackageTitle {
    white-space: pre-line;
}

@media (min-width: 768px) {
    #contentMenuCards i {
        font-size: var(--font-h3);
    }

    #contentMenuCards label {
        margin-top: 5px;
        font-size: var(--font-body-s);
    }

    #contentMenuCards .card {
        margin-bottom: 20px;
    }
}

@media (max-width: 767px) {
    .page-wrapper {
        min-height: unset !important;
    }

    #contentAppName {
        display: none;
    }

    #main-wrapper .navbar-collapse {
        display: contents;
    }

    .mini-sidebar .left-sidebar, .mini-sidebar .sidebar-footer {
        left: -5000px;
    }

    .left-sidebar {
        z-index: 1000;
    }

    .topbar {
        z-index: 1001;
    }

    .left-sidebar, .sidebar-footer {
        width: 100%;
    }
}