/**
 * Styles personnalisés pour les tooltips Tippy.js
 * Améliore l'apparence et l'accessibilité des tooltips
 */

/* Thème principal pour les tooltips d'action */
.tippy-box[data-theme~='action-tooltip'] {
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: white;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    padding: 9px 13px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
}

.tippy-box[data-theme~='action-tooltip'] .tippy-content {
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    letter-spacing: 0.3px;
}

/* Flèches pour le thème action-tooltip */
.tippy-box[data-theme~='action-tooltip'][data-placement^='top'] > .tippy-arrow::before {
    border-top-color: #2c3e50;
}

.tippy-box[data-theme~='action-tooltip'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #2c3e50;
}

.tippy-box[data-theme~='action-tooltip'][data-placement^='left'] > .tippy-arrow::before {
    border-left-color: #2c3e50;
}

.tippy-box[data-theme~='action-tooltip'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #2c3e50;
}

/* Thème de succès */
.tippy-box[data-theme~='success'] {
    background: linear-gradient(135deg, #27ae60 0%, #2ecc71 100%);
    color: white;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    padding: 9px 13px;
    box-shadow: 0 8px 25px rgba(39, 174, 96, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.tippy-box[data-theme~='success'][data-placement^='top'] > .tippy-arrow::before {
    border-top-color: #27ae60;
}

.tippy-box[data-theme~='success'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #27ae60;
}

.tippy-box[data-theme~='success'][data-placement^='left'] > .tippy-arrow::before {
    border-left-color: #27ae60;
}

.tippy-box[data-theme~='success'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #27ae60;
}

/* Thème de danger */
.tippy-box[data-theme~='danger'] {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
    color: white;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    padding: 9px 13px;
    box-shadow: 0 8px 25px rgba(231, 76, 60, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.tippy-box[data-theme~='danger'][data-placement^='top'] > .tippy-arrow::before {
    border-top-color: #e74c3c;
}

.tippy-box[data-theme~='danger'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #e74c3c;
}

.tippy-box[data-theme~='danger'][data-placement^='left'] > .tippy-arrow::before {
    border-left-color: #e74c3c;
}

.tippy-box[data-theme~='danger'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #e74c3c;
}

/* Thème d'avertissement */
.tippy-box[data-theme~='warning'] {
    background: linear-gradient(135deg, #f39c12 0%, #e67e22 100%);
    color: white;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    padding: 9px 13px;
    box-shadow: 0 8px 25px rgba(243, 156, 18, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.tippy-box[data-theme~='warning'][data-placement^='top'] > .tippy-arrow::before {
    border-top-color: #f39c12;
}

.tippy-box[data-theme~='warning'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #f39c12;
}

.tippy-box[data-theme~='warning'][data-placement^='left'] > .tippy-arrow::before {
    border-left-color: #f39c12;
}

.tippy-box[data-theme~='warning'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #f39c12;
}

/* Thème info */
.tippy-box[data-theme~='info'] {
    background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
    color: white;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    padding: 9px 13px;
    box-shadow: 0 8px 25px rgba(13, 202, 240, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.tippy-box[data-theme~='info'][data-placement^='top'] > .tippy-arrow::before {
    border-top-color: #0dcaf0;
}

.tippy-box[data-theme~='info'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #0dcaf0;
}

.tippy-box[data-theme~='info'][data-placement^='left'] > .tippy-arrow::before {
    border-left-color: #0dcaf0;
}

.tippy-box[data-theme~='info'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #0dcaf0;
}

/* Thème primary (Bootstrap bleu) */
.tippy-box[data-theme~='primary'] {
    background: linear-gradient(135deg, #0d6efd 0%, #0a58ca 100%);
    color: white;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    padding: 9px 13px;
    box-shadow: 0 8px 25px rgba(13, 110, 253, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.tippy-box[data-theme~='primary'][data-placement^='top'] > .tippy-arrow::before {
    border-top-color: #0d6efd;
}

.tippy-box[data-theme~='primary'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #0d6efd;
}

.tippy-box[data-theme~='primary'][data-placement^='left'] > .tippy-arrow::before {
    border-left-color: #0d6efd;
}

.tippy-box[data-theme~='primary'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #0d6efd;
}

/* Thème secondary (Bootstrap gris) */
.tippy-box[data-theme~='secondary'] {
    background: linear-gradient(135deg, #6c757d 0%, #5a6268 100%);
    color: white;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    padding: 9px 13px;
    box-shadow: 0 8px 25px rgba(108, 117, 125, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.tippy-box[data-theme~='secondary'][data-placement^='top'] > .tippy-arrow::before {
    border-top-color: #6c757d;
}

.tippy-box[data-theme~='secondary'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #6c757d;
}

.tippy-box[data-theme~='secondary'][data-placement^='left'] > .tippy-arrow::before {
    border-left-color: #6c757d;
}

.tippy-box[data-theme~='secondary'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #6c757d;
}

/* Animations personnalisées */
.tippy-box[data-animation='fade'][data-state='hidden'] {
    opacity: 0;
    transform: scale(0.8);
}

.tippy-box[data-animation='fade'][data-state='visible'] {
    opacity: 1;
    transform: scale(1);
}

/* Amélioration de l'accessibilité */
.tippy-box {
    font-family: inherit;
    line-height: 1.4;
}

.tippy-box .tippy-content {
    text-align: center;
    word-wrap: break-word;
}

/* Responsive design */
@media (max-width: 768px) {
    .tippy-box {
        font-size: 11px;
        padding: 6px 10px;
        max-width: 200px;
    }
}

/* Thème pour les tooltips d'aide */
.tippy-box[data-theme~='help'] {
    background: linear-gradient(135deg, #9b59b6 0%, #8e44ad 100%);
    color: white;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 400;
    padding: 10px 14px;
    box-shadow: 0 8px 25px rgba(155, 89, 182, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
    max-width: 250px;
}

.tippy-box[data-theme~='help'] .tippy-content {
    text-align: left;
    line-height: 1.5;
}

.tippy-box[data-theme~='help'][data-placement^='top'] > .tippy-arrow::before {
    border-top-color: #9b59b6;
}

.tippy-box[data-theme~='help'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #9b59b6;
}

.tippy-box[data-theme~='help'][data-placement^='left'] > .tippy-arrow::before {
    border-left-color: #9b59b6;
}

.tippy-box[data-theme~='help'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #9b59b6;
}

/* États de hover pour les boutons avec tooltips */
.btn[data-action-tooltip]:hover {
    transform: translateY(-1px);
    transition: transform 0.2s ease;
}

.btn[data-action-tooltip]:active {
    transform: translateY(0);
}

/* Amélioration pour les petits écrans */
@media (max-width: 480px) {
    .tippy-box {
        font-size: 10px;
        padding: 5px 8px;
        max-width: 150px;
    }
    
    .tippy-box .tippy-arrow {
        transform: scale(0.8);
    }
}
