/**
 * Teeshirt Minute PDV - Frontend CSS
 * Compatible Flatsome - ULTRA SPECIFIC SELECTORS
 */

/* ========================================
   SECTIONS PRINCIPALES
   ======================================== */

.woocommerce .tm-pdv-retrait-section,
.woocommerce .tm-pdv-bags-section,
body.woocommerce-cart .tm-pdv-retrait-section,
body.woocommerce-cart .tm-pdv-bags-section,
body.woocommerce-checkout .tm-pdv-retrait-section,
body.woocommerce-checkout .tm-pdv-bags-section {
    margin: 25px 0 !important;
    padding: 25px !important;
    background: #fafafa !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05) !important;
}

.tm-pdv-hidden {
    display: none !important;
}

body .tm-pdv-section-title,
.woocommerce .tm-pdv-section-title {
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    color: #2c3e50 !important;
    border: none !important;
}

/* ========================================
   INFO BOX
   ======================================== */

body .tm-pdv-info-box {
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%) !important;
    border: 2px solid #4caf50 !important;
    border-radius: 8px !important;
    padding: 15px !important;
    margin-bottom: 20px !important;
}

body .tm-pdv-info-box .tm-pdv-store-hours strong {
    color: #1b5e20 !important;
}

body .tm-pdv-info-box .tm-pdv-store-hours p {
    margin: 5px 0 !important;
    color: #2e7d32 !important;
}

body .tm-pdv-info-box .tm-pdv-notes {
    margin: 10px 0 !important;
    padding-left: 20px !important;
}

body .tm-pdv-info-box .tm-pdv-notes li {
    margin: 5px 0 !important;
    color: #2e7d32 !important;
    font-size: 14px !important;
}

body .tm-pdv-whatsapp-link {
    color: #25D366 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border: 1px solid #25D366 !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    display: inline-block !important;
}

body .tm-pdv-whatsapp-link:hover {
    background: #25D366 !important;
    color: white !important;
}

/* ========================================
   TYPE SELECTOR - GRILLE
   ======================================== */

body .tm-pdv-type-selector,
.woocommerce .tm-pdv-type-selector {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 20px !important;
    margin: 25px 0 !important;
}

@media (max-width: 768px) {
    body .tm-pdv-type-selector,
    .woocommerce .tm-pdv-type-selector {
        grid-template-columns: 1fr !important;
    }
}

/* ========================================
   OPTIONS EXPRESS / PROGRAMME - FLATSOME FIX
   ======================================== */

body .tm-pdv-option,
.woocommerce .tm-pdv-option,
body .tm-pdv-type-selector .tm-pdv-option {
    position: relative !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

/* INPUT RADIO - COMPLÈTEMENT INVISIBLE */
body .tm-pdv-option input[type="radio"],
body .tm-pdv-option input[type=radio],
.woocommerce .tm-pdv-option input[type="radio"],
body .tm-pdv-type-selector .tm-pdv-option input[type="radio"] {
    position: absolute !important;
    left: -99999px !important;
    top: -99999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* LABEL - CONTRER input[type=radio]+label { display: inline } de Flatsome */
body .tm-pdv-option label,
body .tm-pdv-option > label,
body .tm-pdv-type-selector .tm-pdv-option label,
body .tm-pdv-type-selector .tm-pdv-option > label,
.woocommerce .tm-pdv-option label,
.woocommerce .tm-pdv-option > label,
body .tm-pdv-option input[type="radio"] + label,
body .tm-pdv-option input[type=radio] + label,
.woocommerce .tm-pdv-option input[type="radio"] + label,
.woocommerce .tm-pdv-option input[type=radio] + label {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 25px 20px !important;
    margin: 0 !important;
    border: 3px solid #e0e0e0 !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
    min-height: 140px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    font-size: 1em !important;
    font-weight: normal !important;
}

/* Supprimer pseudo-elements */
body .tm-pdv-option label::before,
body .tm-pdv-option label::after,
.woocommerce .tm-pdv-option label::before,
.woocommerce .tm-pdv-option label::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    border: none !important;
    background: none !important;
}

/* Hover */
body .tm-pdv-option label:hover,
body .tm-pdv-option > label:hover,
.woocommerce .tm-pdv-option label:hover {
    border-color: #90caf9 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;
}

/* SÉLECTIONNÉ */
body .tm-pdv-option.selected label,
body .tm-pdv-option.selected > label,
body .tm-pdv-option input[type="radio"]:checked + label,
body .tm-pdv-option input[type=radio]:checked + label,
.woocommerce .tm-pdv-option.selected label,
.woocommerce .tm-pdv-option input[type="radio"]:checked + label,
.woocommerce .tm-pdv-option input[type=radio]:checked + label,
body .tm-pdv-type-selector .tm-pdv-option.selected label,
body .tm-pdv-type-selector .tm-pdv-option input[type="radio"]:checked + label {
    display: flex !important;
    flex-direction: column !important;
    border: 3px solid #4caf50 !important;
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 20px rgba(76, 175, 80, 0.2) !important;
}

body .tm-pdv-option-title,
.woocommerce .tm-pdv-option-title {
    display: block !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    margin-bottom: 8px !important;
    color: #2c3e50 !important;
    border: none !important;
}

body .tm-pdv-option-date,
.woocommerce .tm-pdv-option-date {
    display: block !important;
    color: #4caf50 !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    margin: 5px 0 !important;
    border: none !important;
}

body .tm-pdv-option-desc,
.woocommerce .tm-pdv-option-desc {
    display: block !important;
    color: #7f8c8d !important;
    font-size: 14px !important;
    margin-top: 8px !important;
    border: none !important;
}

body .tm-pdv-badge,
.woocommerce .tm-pdv-badge {
    display: inline-block !important;
    background: #4caf50 !important;
    color: white !important;
    padding: 4px 10px !important;
    border-radius: 12px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    margin-top: 10px !important;
    text-transform: uppercase !important;
    border: none !important;
}

/* ========================================
   DATES PROGRAMMÉES
   ======================================== */

body .tm-pdv-programme-fields {
    margin-top: 25px !important;
    padding-top: 25px !important;
    border-top: 1px solid #e0e0e0 !important;
}

body .tm-pdv-date-selector h4,
body .tm-pdv-time-selector h4 {
    color: #2c3e50 !important;
    margin: 0 0 15px 0 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border: none !important;
}

body #tm-pdv-dates-container,
body .tm-pdv-dates-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)) !important;
    gap: 10px !important;
    margin-bottom: 25px !important;
}

body .tm-pdv-date-item {
    position: relative !important;
    display: block !important;
    border: none !important;
}

body .tm-pdv-date-item input[type="radio"],
body .tm-pdv-date-item input[type=radio] {
    position: absolute !important;
    left: -99999px !important;
    top: -99999px !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* LABEL DATE - CONTRER Flatsome */
body .tm-pdv-date-item label,
body .tm-pdv-date-item > label,
body .tm-pdv-date-item input[type="radio"] + label,
body .tm-pdv-date-item input[type=radio] + label {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px 5px !important;
    margin: 0 !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    cursor: pointer !important;
    min-height: 70px !important;
    box-sizing: border-box !important;
    font-size: 1em !important;
    font-weight: normal !important;
}

body .tm-pdv-date-item label::before,
body .tm-pdv-date-item label::after {
    display: none !important;
    content: none !important;
}

body .tm-pdv-date-item label:hover {
    border-color: #90caf9 !important;
}

body .tm-pdv-date-item.selected label,
body .tm-pdv-date-item input[type="radio"]:checked + label,
body .tm-pdv-date-item input[type=radio]:checked + label {
    display: flex !important;
    border: 2px solid #4caf50 !important;
    background: #e8f5e9 !important;
}

body .tm-pdv-date-day-name {
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #7f8c8d !important;
    text-transform: uppercase !important;
    border: none !important;
    margin: 0 !important;
}

body .tm-pdv-date-day {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #2c3e50 !important;
    line-height: 1.2 !important;
    margin: 3px 0 !important;
    border: none !important;
}

body .tm-pdv-date-month {
    font-size: 10px !important;
    color: #7f8c8d !important;
    text-transform: uppercase !important;
    border: none !important;
    margin: 0 !important;
}

/* ========================================
   CRÉNEAUX HORAIRES
   ======================================== */

body .tm-pdv-time-selector {
    margin-top: 20px !important;
}

body .tm-pdv-time-slots {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
}

@media (max-width: 600px) {
    body .tm-pdv-time-slots {
        grid-template-columns: 1fr !important;
    }
}

body .tm-pdv-time-option {
    position: relative !important;
    display: block !important;
    border: none !important;
}

body .tm-pdv-time-option input[type="radio"],
body .tm-pdv-time-option input[type=radio] {
    position: absolute !important;
    left: -99999px !important;
    top: -99999px !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* LABEL CRÉNEAU - CONTRER Flatsome */
body .tm-pdv-time-option label,
body .tm-pdv-time-option > label,
body .tm-pdv-time-option input[type="radio"] + label,
body .tm-pdv-time-option input[type=radio] + label {
    display: block !important;
    padding: 12px 10px !important;
    margin: 0 !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    cursor: pointer !important;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: normal !important;
    box-sizing: border-box !important;
}

body .tm-pdv-time-option label::before,
body .tm-pdv-time-option label::after {
    display: none !important;
    content: none !important;
}

body .tm-pdv-time-option label:hover {
    border-color: #90caf9 !important;
}

body .tm-pdv-time-option.selected label,
body .tm-pdv-time-option input[type="radio"]:checked + label,
body .tm-pdv-time-option input[type=radio]:checked + label {
    border: 2px solid #4caf50 !important;
    background: #e8f5e9 !important;
}

/* ========================================
   MESSAGE ORGANISATION
   ======================================== */

body .tm-pdv-org-message {
    background: linear-gradient(135deg, #fff8e1 0%, #ffecb3 100%) !important;
    border: 2px solid #ffc107 !important;
    border-radius: 8px !important;
    padding: 15px !important;
    margin-top: 20px !important;
}

body .tm-pdv-org-message p {
    margin: 5px 0 !important;
    color: #5d4037 !important;
    font-size: 14px !important;
    border: none !important;
}

/* ========================================
   LOADING & ERREURS
   ======================================== */

body .tm-pdv-loading {
    text-align: center !important;
    padding: 30px 20px !important;
    color: #7f8c8d !important;
    font-style: italic !important;
    grid-column: 1 / -1 !important;
    border: none !important;
}

body .tm-pdv-loading::after {
    content: "" !important;
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    border: 2px solid #e0e0e0 !important;
    border-top-color: #4caf50 !important;
    border-radius: 50% !important;
    animation: tm-pdv-spin 1s linear infinite !important;
    margin-left: 10px !important;
    vertical-align: middle !important;
}

@keyframes tm-pdv-spin {
    to { transform: rotate(360deg); }
}

body .tm-pdv-error,
body .tm-pdv-no-dates {
    text-align: center !important;
    padding: 20px !important;
    color: #7f8c8d !important;
    grid-column: 1 / -1 !important;
    border: none !important;
}

/* ========================================
   SECTION SACS
   ======================================== */

body .tm-pdv-bag-checkbox {
    margin-bottom: 15px !important;
    border: none !important;
}

body .tm-pdv-bag-checkbox > label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    cursor: pointer !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #2c3e50 !important;
    border: none !important;
}

body .tm-pdv-bag-checkbox input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
    cursor: pointer !important;
    margin: 0 !important;
}

body .tm-pdv-bag-options {
    margin-top: 20px !important;
    padding-top: 20px !important;
    border-top: 1px solid #e0e0e0 !important;
}

body .tm-pdv-bag-intro {
    margin-bottom: 15px !important;
    color: #7f8c8d !important;
    font-size: 14px !important;
    border: none !important;
}

body .tm-pdv-bag-option {
    position: relative !important;
    display: block !important;
    margin-bottom: 12px !important;
    border: none !important;
}

body .tm-pdv-bag-option input[type="radio"],
body .tm-pdv-bag-option input[type=radio] {
    position: absolute !important;
    left: -99999px !important;
    top: -99999px !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* LABEL SAC - CONTRER Flatsome */
body .tm-pdv-bag-option label,
body .tm-pdv-bag-option > label,
body .tm-pdv-bag-option input[type="radio"] + label,
body .tm-pdv-bag-option input[type=radio] + label {
    display: block !important;
    padding: 15px 20px !important;
    margin: 0 !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    font-size: 1em !important;
    font-weight: normal !important;
}

body .tm-pdv-bag-option label::before,
body .tm-pdv-bag-option label::after {
    display: none !important;
    content: none !important;
}

body .tm-pdv-bag-option label:hover {
    border-color: #90caf9 !important;
    background: #f8f8f8 !important;
}

body .tm-pdv-bag-option.selected label,
body .tm-pdv-bag-option input[type="radio"]:checked + label,
body .tm-pdv-bag-option input[type=radio]:checked + label {
    border: 2px solid #4caf50 !important;
    background: #e8f5e9 !important;
}

body .tm-pdv-bag-title {
    display: block !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    color: #2c3e50 !important;
    margin-bottom: 5px !important;
    border: none !important;
}

body .tm-pdv-bag-price {
    display: block !important;
    color: #4caf50 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    border: none !important;
}

body .tm-pdv-bag-desc {
    display: block !important;
    color: #7f8c8d !important;
    font-size: 13px !important;
    margin-top: 5px !important;
    border: none !important;
}

/* ========================================
   THANK YOU PAGE
   ======================================== */

body .tm-pdv-thankyou {
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%) !important;
    border: 3px solid #4caf50 !important;
    border-radius: 12px !important;
    padding: 25px !important;
    margin: 25px 0 !important;
}

body .tm-pdv-thankyou h3 {
    color: #2e7d32 !important;
    margin: 0 0 20px 0 !important;
    font-size: 20px !important;
    border: none !important;
}

body .tm-pdv-thankyou-details {
    background: white !important;
    padding: 20px !important;
    border-radius: 8px !important;
    margin-bottom: 20px !important;
    border: none !important;
}

body .tm-pdv-thankyou-details p {
    margin: 10px 0 !important;
    font-size: 15px !important;
    border: none !important;
}

body .tm-pdv-thankyou-reminder {
    background: #fff8e1 !important;
    border: 2px solid #ffc107 !important;
    border-radius: 8px !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
}

body .tm-pdv-thankyou-reminder p {
    margin: 5px 0 !important;
    color: #5d4037 !important;
    border: none !important;
}

/* ========================================
   ALERTES
   ======================================== */

body .tm-pdv-alert {
    padding: 15px !important;
    border-radius: 8px !important;
    margin-bottom: 20px !important;
}

body .tm-pdv-alert-warning {
    background: linear-gradient(135deg, #ffebee 0%, #ffcdd2 100%) !important;
    border: 2px solid #f44336 !important;
}

body .tm-pdv-alert-warning strong {
    color: #c62828 !important;
}

body .tm-pdv-alert-warning p {
    margin: 8px 0 !important;
    color: #b71c1c !important;
    border: none !important;
}

/* ========================================
   STORE PICKUP NOTICE
   ======================================== */

body .tm-pdv-store-pickup-notice {
    margin: 25px 0 !important;
    padding: 20px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    background: #fafafa !important;
}

body .tm-pdv-store-pickup-notice h2 {
    margin: 0 0 15px 0 !important;
    font-size: 18px !important;
    color: #2c3e50 !important;
    border: none !important;
}