/**
 * Infobulles — Styles des infobulles et tooltips
 *
 * Classes génériques pour les infobulles avec variantes
 * info (bleu) et warning (orange), positionnement et animations.
 *
 * @file        cc-infobulles.css
 * @package     CaisseConnect
 * @subpackage  CSS\Components
 * @since       0.9
 * @version     1.1.0
 * @author      Microlibre <contact@microlibre.net>
 * @copyright   2026 Microlibre
 * @license     GPL-2.0+ https://www.gnu.org/licenses/gpl-2.0.html
 * @link        https://microlibre.net/caisse-connect
 */

/* === CLASSE DE BASE POUR LES ICÔNES AVEC INFOBULLE === */
.cc-icone-infobulle,
.cc-icone-info,
.cc-icone-warning {
    font-size: 16px;
    cursor: context-menu;
    position: relative;
    display: inline-block;
}

/* Variante info (bleu) */
.cc-icone-infobulle--info,
.cc-icone-info {
    color: var(--cc-secondary, #0073aa);
}

/* Variante warning (orange) */
.cc-icone-infobulle--warning,
.cc-icone-warning {
    color: var(--cc-warning-dark, #ff8c00);
}

/* === INFOBULLE (TOOLTIP) === */
.cc-infobulle {
    visibility: hidden;
    opacity: 0;
    width: 200px;
    background-color: #fffde7;
    color: #222;
    text-align: left;
    border-radius: 6px;
    padding: 10px;
    position: absolute;
    z-index: var(--cc-z-infobulle, 9991);
    bottom: 125%;
    left: 50%;
    margin-left: -100px;
    font-size: 13px;
    font-weight: normal;
    line-height: 1.5;
    white-space: normal;
    transition: opacity 0.3s;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* Triangle pointant vers le bas */
.cc-infobulle::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #fffde7 transparent transparent transparent;
}

/* Affichage au survol */
.cc-icone-infobulle:hover .cc-infobulle,
.cc-icone-info:hover .cc-infobulle,
.cc-icone-warning:hover .cc-infobulle,
.cc-sku-infobulle:hover .cc-infobulle {
    visibility: visible;
    opacity: 1;
}

/* Cellule de tableau contenant une infobulle (override overflow: hidden) */
.cc-cellule-avec-infobulle {
    overflow: visible !important;
}