/* =============================================================================
   V17.1 :: tanda-v171-fixes
   Fixes cosmeticos / responsive / cleanup POS:
     1. Ocultar g3-pos-shortcuts-hint permanente en POS (cartel naranja molesto)
     2. Compactar /menu (paddings, gaps, margins) - mejor uso del espacio
     3. Fix responsive Menu.razor cuando se achica la pantalla
     4. Reglas defensivas para evitar descompaginado en resize
   ============================================================================= */

/* ---------------------------------------------------------------------------
   1. CARTEL NARANJA "tip de atajos POS" - ocultar permanente
   --------------------------------------------------------------------------- */
/* En G3 lo reposicionaron a top-right pero aun molesta. Lauti pidio borrarlo. */
html body .g3-pos-shortcuts-hint,
html body.pos-active .g3-pos-shortcuts-hint,
html body .g3-pos-shortcuts-hint.visible {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* ---------------------------------------------------------------------------
   2. COMPACTAR HOME - aprovechar el espacio horizontal y vertical
   --------------------------------------------------------------------------- */
html body .home-shell {
    padding: 12px !important;        /* era 18px */
    max-width: 1320px !important;     /* +40px de ancho aprovechable */
}

html body .home-2col {
    gap: 16px !important;            /* era 22px */
    grid-template-columns: minmax(0, 1fr) 240px !important;  /* col derecha 260->240 */
}

html body .home-head {
    margin-bottom: 12px !important;   /* era ~18 */
}

html body .home-alertas {
    gap: 8px !important;              /* era 10 */
    margin-bottom: 12px !important;   /* era 18 */
}

html body .alert-pill {
    padding: 7px 11px !important;     /* era 10/14 */
    font-size: 12px !important;       /* era 13 */
}

html body .home-kpis {
    gap: 9px !important;              /* era 12 */
    margin-bottom: 12px !important;   /* era 18 */
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important; /* era 170 */
}

html body .kpi-card {
    padding: 10px 12px !important;    /* era 14/16 */
}
html body .kc-val {
    font-size: 21px !important;       /* era 24 */
    margin: 2px 0 !important;
}

html body .mi-dia-card {
    padding: 12px 14px !important;    /* era 16/18 */
    margin-bottom: 12px !important;   /* era 18 */
}

html body .hub-card {
    padding: 14px 16px !important;
}

/* Atajos sticky col derecha */
html body .home-side-sticky {
    padding: 10px !important;
}
html body .qa-side-list {
    gap: 5px !important;
}
html body .qa-side-item {
    padding: 7px 9px !important;
    font-size: 12px !important;
}

/* ---------------------------------------------------------------------------
   3. FIX RESPONSIVE - cuando se achica la pantalla no descompagina
   --------------------------------------------------------------------------- */
@@media (max-width: 1100px) {
    /* Si el viewport es chico, plegamos la columna derecha de atajos a una sola col */
    html body .home-2col {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    html body .home-side-col {
        position: static !important;     /* dejar de ser sticky cuando es 1 col */
    }
    html body .home-side-sticky {
        position: static !important;
        max-width: 100% !important;
    }
}

@@media (max-width: 768px) {
    html body .home-shell {
        padding: 8px !important;
    }
    html body .home-kpis {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    html body .home-alertas {
        flex-direction: column !important;
    }
    html body .alert-pill {
        width: 100% !important;
    }
}

/* Reglas defensivas globales para evitar overflow horizontal */
html body .home-shell,
html body .home-main-col,
html body .home-side-col,
html body .home-2col,
html body .home-kpis,
html body .home-alertas {
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* Hub cards: no se desbordan */
html body .hub-card {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* KPI badges no se descolocan */
html body .hub-badge,
html body .qsi-badge {
    flex-shrink: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}
