/**
 * WooCommerce Raffle Tickets - Frontend Styles
 */

/* Raffle information box */
.raffle-info {
    margin-bottom: 2em;
    padding: 15px;
    border: 1px solid #eee;
    background: #f8f8f8;
    border-radius: 3px;
}

.raffle-info h3 {
    margin-top: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
}

/* Raffle details table */
.raffle-details {
    width: 100%;
    margin-bottom: 15px;
    border-collapse: collapse;
}

.raffle-details th,
.raffle-details td {
    padding: 8px 10px;
    text-align: left;
    border-bottom: 1px solid #eee;
}

.raffle-details th {
    width: 30%;
    font-weight: 600;
}

/* Status indicators */
.raffle-status {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 3px;
    font-size: 0.9em;
    font-weight: bold;
}

.raffle-status.active {
    background: #e6ffed;
    color: #28a745;
}

.raffle-status.upcoming {
    background: #fff5e6;
    color: #ff9900;
}

.raffle-status.ended {
    background: #f2f2f2;
    color: #6c757d;
}

.raffle-status.sold-out {
    background: #ffe6e6;
    color: #dc3545;
}

/* Raffle notices */
.raffle-notice {
    margin: 15px 0;
    padding: 10px 15px;
    border-radius: 3px;
}

.raffle-notice.upcoming {
    background: #fff5e6;
    border: 1px solid #ffcc80;
}

.raffle-notice.ended {
    background: #f2f2f2;
    border: 1px solid #ced4da;
}

.raffle-notice.sold-out {
    background: #ffe6e6;
    border: 1px solid #ffb3b3;
}

/* Raffle description */
.raffle-description {
    margin-top: 15px;
    transition: max-height 0.3s ease-out;
}

.raffle-description-toggle {
    display: block;
    margin-top: 10px;
    text-align: right;
    font-size: 0.9em;
}

/* Style for raffle product pages */
.raffle-product .price {
    font-size: 1.2em;
}

.raffle-product .variations td.label label {
    font-weight: bold;
}

.raffle-product.raffle-upcoming .single_add_to_cart_button,
.raffle-product.raffle-ended .single_add_to_cart_button,
.raffle-product.raffle-sold-out .single_add_to_cart_button {
    display: none !important;
}

/* My Account tickets page */
.woocommerce-account .raffle_tickets {
    margin-bottom: 30px;
}

.woocommerce-account .raffle_tickets th {
    text-align: left;
}

.woocommerce-account .raffle_tickets th,
.woocommerce-account .raffle_tickets td {
    padding: 10px;
}

/* Cart and Checkout */
.woocommerce-cart .cart_item .variation dt.variation-Raffle,
.woocommerce-checkout .cart_item .variation dt.variation-Raffle,
.woocommerce-order-received .woocommerce-table--order-details .wc-item-meta .wc-item-meta-label {
    float: left;
    clear: both;
    margin-right: 5px;
    font-weight: 700;
}

.shop_table.raffle_tickets {
    margin-bottom: 30px;
}

.shop_table.raffle_tickets th,
.shop_table.raffle_tickets td {
    text-align: left;
    padding: 8px 10px;
}

/* Responsive styles */
@media (max-width: 768px) {
    .raffle-details th {
        width: 40%;
    }
}

@media (max-width: 576px) {
    .raffle-info {
        padding: 10px;
    }
    
    .raffle-details th,
    .raffle-details td {
        display: block;
        width: 100%;
    }
    
    .raffle-details th {
        padding-bottom: 0;
        border-bottom: 0;
    }
    
    .raffle-details td {
        padding-top: 0;
    }
}

/* Hide add to cart buttons for ended raffles */
body.raffle-ended .single_add_to_cart_button,
body.raffle-ended .add_to_cart_button {
    display: none !important;
}

/* Style for ended notice */
.raffle-ended-notice {
    margin-bottom: 20px;
    padding: 10px 15px;
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
    border-radius: 4px;
}

/* Raffle ended badge */
.raffle-ended-badge {
    position: absolute;
    top: 0;
    right: 0;
    background: #e2401c;
    color: #fff;
    padding: 5px 10px;
    font-size: 0.85em;
    font-weight: 600;
    text-transform: uppercase;
    z-index: 9;
}

/* Raffle ended message */
.raffle-ended-message {
    padding: 15px;
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
    border-radius: 3px;
    margin-bottom: 20px;
}

/* Raffle ended notice */
.raffle-ended-notice {
    background-color: #f8d7da;
    color: #721c24;
    padding: 10px 15px;
    border: 1px solid #f5c6cb;
    border-radius: 4px;
    margin: 10px 0;
    font-weight: bold;
}