/**
 * Membership Price Table Styles
 *
 * Uses --cmc-theme-* CSS variables from CM Core Library for theme style inheritance.
 *
 * @package CodemoyUserKit
 * @since 2.0.0
 * @updated 2.1.0 - Migrated to --cmc-theme-* variables
 */

/* Price Table Container */
.cmuk-price-table {
    display: grid;
    gap: var(--cmuk-space-lg);
    padding: 20px 0;
}

.cmuk-price-table-cols-1 {
    grid-template-columns: 1fr;
    max-width: 400px;
    margin: 0 auto;
}

.cmuk-price-table-cols-2 {
    grid-template-columns: repeat(2, 1fr);
}

.cmuk-price-table-cols-3 {
    grid-template-columns: repeat(3, 1fr);
}

.cmuk-price-table-cols-4 {
    grid-template-columns: repeat(4, 1fr);
}

/* Price Card */
.cmuk-price-card {
    background: var(--cmc-theme-background-color);
    border: 1px solid var(--cmuk-border);
    border-radius: var(--cmuk-radius-lg);
    padding: 32px 24px;
    display: flex;
    flex-direction: column;
    transition: transform var(--cmuk-transition-base),
                box-shadow var(--cmuk-transition-base);
}

.cmuk-price-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--cmuk-shadow-lg);
}

/* Highlighted Card */
.cmuk-price-card-highlighted {
    border-color: var(--cmc-plugin-primary);
    border-width: 2px;
    position: relative;
    transform: scale(1.02);
}

.cmuk-price-card-highlighted:hover {
    transform: scale(1.02) translateY(-4px);
}

/* Current Plan Card */
.cmuk-price-card-current {
    background: var(--cmuk-bg-page);
    border-color: var(--cmuk-success);
}

/* Price Badge */
.cmuk-price-badge {
    display: inline-block;
    background: var(--cmc-plugin-primary);
    color: var(--cmuk-text-on-primary);
    font-size: var(--cmuk-text-xs);
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
}

.cmuk-price-badge-current {
    background: var(--cmuk-success);
}

/* Card Header */
.cmuk-price-card-header {
    text-align: center;
    margin-bottom: var(--cmuk-space-lg);
    padding-bottom: var(--cmuk-space-lg);
    border-bottom: 1px solid var(--cmuk-border-light);
}

.cmuk-price-title {
    margin: 0 0 var(--cmuk-space-md) 0;
    font-size: 24px;
    font-weight: 600;
    color: var(--cmc-theme-text-color);
}

/* Price Amount */
.cmuk-price-amount {
    font-size: 48px;
    font-weight: 700;
    color: var(--cmc-theme-text-color);
    line-height: 1;
    margin-bottom: var(--cmuk-space-sm);
}

.cmuk-price-amount .woocommerce-Price-amount {
    font-size: inherit;
}

.cmuk-price-amount .woocommerce-Price-currencySymbol {
    font-size: 24px;
    vertical-align: super;
}

.cmuk-price-free {
    color: var(--cmuk-success);
    font-size: 36px;
}

/* Duration */
.cmuk-price-duration {
    font-size: var(--cmuk-text-sm);
    color: var(--cmuk-text-muted);
}

/* Description */
.cmuk-price-description {
    font-size: var(--cmuk-text-sm);
    color: var(--cmuk-text-muted);
    line-height: 1.6;
    margin-bottom: var(--cmuk-space-lg);
    text-align: center;
}

/* Features List */
.cmuk-price-features {
    list-style: none;
    margin: 0 0 var(--cmuk-space-lg) 0;
    padding: 0;
    flex: 1;
}

.cmuk-price-features li {
    padding: 10px 0;
    border-bottom: 1px solid var(--cmuk-border-light);
    font-size: var(--cmuk-text-sm);
    color: var(--cmc-theme-text-color);
    display: flex;
    align-items: center;
    gap: 10px;
}

.cmuk-price-features li:last-child {
    border-bottom: none;
}

.cmuk-price-features li::before {
    content: '\2713';
    color: var(--cmuk-success);
    font-weight: bold;
    font-size: 16px;
    flex-shrink: 0;
}

/* Action Button */
.cmuk-price-action {
    margin-top: auto;
    padding-top: var(--cmuk-space-lg);
}

.cmuk-price-action .cmuk-btn {
    display: block;
    width: 100%;
    padding: 14px 24px;
    text-align: center;
    font-size: var(--cmuk-text-base);
    font-weight: 600;
    border-radius: var(--cmuk-radius-lg);
    text-decoration: none;
    transition: all var(--cmuk-transition-base);
    box-sizing: border-box;
}

.cmuk-price-action .cmuk-btn-primary {
    background: var(--cmc-plugin-primary);
    color: var(--cmuk-text-on-primary);
    border: none;
}

.cmuk-price-action .cmuk-btn-primary:hover {
    background: var(--cmc-theme-secondary-color);
}

.cmuk-price-action .cmuk-btn-disabled {
    background: var(--cmuk-border);
    color: var(--cmuk-text-muted);
    cursor: not-allowed;
}

/* Highlighted Card Button */
.cmuk-price-card-highlighted .cmuk-btn-primary {
    background: var(--cmc-theme-secondary-color);
}

.cmuk-price-card-highlighted .cmuk-btn-primary:hover {
    background: var(--cmc-theme-secondary-color);
}

/* Notice */
.cmuk-notice {
    text-align: center;
    padding: 20px;
    background: var(--cmuk-bg-page);
    border: 1px solid var(--cmuk-border);
    border-radius: var(--cmuk-radius-lg);
    color: var(--cmuk-text-muted);
}

/* Responsive */
@media (max-width: 1024px) {
    .cmuk-price-table-cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .cmuk-price-table-cols-2,
    .cmuk-price-table-cols-3,
    .cmuk-price-table-cols-4 {
        grid-template-columns: 1fr;
    }

    .cmuk-price-card-highlighted {
        transform: none;
    }

    .cmuk-price-card-highlighted:hover {
        transform: translateY(-4px);
    }

    .cmuk-price-card {
        padding: 24px 20px;
    }

    .cmuk-price-amount {
        font-size: 36px;
    }

    .cmuk-price-title {
        font-size: 20px;
    }
}