/**
 * Advanced Shipping Display - Frontend Styles
 */

/* Shipping groups wrapper */
.asd-shipping-groups {
    width: 100%;
}

/* =============================================
   TABS NAVIGATION
   ============================================= */

.asd-tabs-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
}

.asd-tab-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    background: #fff;
    border: 1px solid #00a19a;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 500;
    color: #00a19a;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.asd-tab-btn:hover {
    background: #e6f7f6;
}

.asd-tab-btn--active {
    background: #00a19a;
    color: #fff;
}

.asd-tab-btn--active:hover {
    background: #008f89;
}

/* =============================================
   TABS CONTENT
   ============================================= */

.asd-tabs-content {
    position: relative;
}

/* Single group */
.asd-shipping-group {
    /* Hidden by default, shown via JS/inline style */
}

.asd-shipping-group--active {
    display: block;
}

/* =============================================
   SHIPPING METHODS
   ============================================= */

.asd-methods {
    margin: 0;
    padding: 0;
}

.asd-methods--hidden {
    margin-top: 0;
}

/* Single method */
.asd-method {
    margin-bottom: 0;
    border: 1px solid #e5e5e5;
    border-bottom: none;
}

.asd-method:first-child {
    border-radius: 8px 8px 0 0;
}

.asd-method:last-child {
    border-bottom: 1px solid #e5e5e5;
    border-radius: 0 0 8px 8px;
}

.asd-method:only-child {
    border-radius: 8px;
    border-bottom: 1px solid #e5e5e5;
}

/* When hidden methods are visible, fix border radius */
.asd-methods--visible .asd-method:last-child {
    border-radius: 0;
    border-bottom: none;
}

.asd-methods--visible:only-child .asd-method:last-child,
.asd-shipping-group:not(:has(.asd-methods--hidden)) .asd-methods--visible .asd-method:last-child {
    border-radius: 0 0 8px 8px;
    border-bottom: 1px solid #e5e5e5;
}

.asd-methods--hidden .asd-method:last-child {
    border-radius: 0 0 8px 8px;
    border-bottom: 1px solid #e5e5e5;
}

.asd-method label {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: #fff;
    cursor: pointer;
    transition: background-color 0.15s ease;
    margin: 0;
    font-weight: normal;
}

.asd-method:first-child label {
    border-radius: 8px 8px 0 0;
}

.asd-method:last-child label {
    border-radius: 0 0 8px 8px;
}

.asd-method:only-child label {
    border-radius: 8px;
}

.asd-method label:hover {
    background: #f8f8f8;
}

.asd-method input[type="radio"] {
    margin: 0;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    accent-color: #00a19a;
}

/* Method label */
.asd-method-label {
    flex: 1;
    font-size: 14px;
    color: #333;
    line-height: 1.4;
}

/* Method price */
.asd-method-price {
    font-size: 14px;
    font-weight: 600;
    color: #00a19a;
    white-space: nowrap;
}

.asd-method-price--free {
    color: #46b450;
}

/* Selected method - green border */
.asd-method:has(input:checked) {
    border-color: #00a19a;
    position: relative;
    z-index: 1;
}

.asd-method:has(input:checked) + .asd-method {
    border-top-color: #00a19a;
}

.asd-method:has(input:checked) label {
    background: #f0faf9;
}

/* =============================================
   SHOW MORE BUTTON
   ============================================= */

.asd-show-more {
    display: inline-block;
    margin-top: 15px;
    padding: 0;
    background: transparent;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #00a19a;
    cursor: pointer;
    text-decoration: none;
    transition: color 0.15s ease;
}

.asd-show-more:hover {
    color: #008f89;
    text-decoration: underline;
}

.asd-show-more.asd-expanded {
    color: #666;
}

.asd-hidden-count {
    font-weight: 400;
}

/* =============================================
   RESPONSIVE
   ============================================= */

@media screen and (max-width: 600px) {
    .asd-tabs-nav {
        gap: 6px;
    }

    .asd-tab-btn {
        padding: 8px 16px;
        font-size: 13px;
    }

    .asd-method label {
        padding: 14px 16px;
        gap: 10px;
    }

    .asd-method-label {
        font-size: 13px;
    }

    .asd-method-price {
        font-size: 13px;
    }
}

@media screen and (max-width: 400px) {
    .asd-tabs-nav {
        flex-direction: column;
    }

    .asd-tab-btn {
        width: 100%;
    }
}

/* =============================================
   THEME COMPATIBILITY
   ============================================= */

.asd-shipping-groups,
.asd-shipping-groups * {
    box-sizing: border-box;
}

.asd-shipping-groups .asd-method label {
    font-weight: normal;
    margin-bottom: 0;
}

.asd-shipping-groups .asd-method input[type="radio"] {
    width: 18px;
    height: 18px;
}

/* Hide default WooCommerce shipping methods if using our display */
.woocommerce-shipping-methods.asd-hidden {
    display: none !important;
}
