/**
 * RTPC Grâce - Frontend Styles
 */

/* Quicksand font import */
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700;800&display=swap');

/* Base Container Styling */
.rtpc-grace-container {
    font-family: 'Quicksand', system-ui, -apple-system, sans-serif !important;
    width: 100% !important;
    max-width: 100% !important;
}

.rtpc-grace-container * {
    font-family: 'Quicksand', system-ui, -apple-system, sans-serif !important;
    transition: all 0.2s ease-in-out;
}

/* Custom Accordion animation */
.match-detail {
    max-height: 0;
    overflow: hidden;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.match-detail.active {
    max-height: 2000px; /* high limit */
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
    opacity: 1;
}

/* Rotate indicator icon on toggle */
.rotate-180 {
    transform: rotate(180deg);
}

/* Tab contents hidden by default */
.tab-content {
    display: none;
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.tab-content.active {
    display: block;
    opacity: 1;
    transform: translateY(0);
}

/* Custom rounded tab button styles */
.tab-btn.active {
    background-color: #f97316 !important; /* Accent orange */
    color: white !important;
    box-shadow: 0 4px 12px rgba(249, 115, 22, 0.3);
}

/* Tables styling */
table {
    border-spacing: 0;
    width: 100%;
}

th, td {
    border-bottom-width: 2px;
    border-color: #f1f5f9;
}

tr:last-child td {
    border-bottom-width: 0px;
}

/* custom scrollbar */
.overflow-x-auto::-webkit-scrollbar {
    height: 6px;
}

.overflow-x-auto::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 10px;
}

.overflow-x-auto::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 10px;
}

.overflow-x-auto::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Visually stunning PDF printing mode */
@media print {
    body {
        background: white !important;
        color: black !important;
    }
    
    .no-print,
    .no-print *,
    button,
    .tab-btn,
    .widget-admin-banner,
    .interactive-configurator,
    header,
    footer,
    form,
    .match-detail {
        display: none !important;
    }
    
    .rtpc-grace-container {
        margin: 0 !important;
        padding: 0 !important;
        box-shadow: none !important;
    }
    
    .tab-content {
        display: block !important;
        opacity: 1 !important;
        transform: none !important;
        box-shadow: none !important;
        border: none !important;
        padding: 0 !important;
    }
    
    /* Ensure cards stay intact and don't break mid-page */
    .print-card,
    .rtpc-grace-container .mb-4,
    tr {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }
}