/**
 * Frontend CSS for WC Child Subscription Manager
 */

.wc-child-subscription-manager {
    margin: 20px 0;
    padding: 15px;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 3px;
}

.wc-child-subscription-manager h2,
.wc-child-subscription-manager h3 {
    margin-top: 0;
}

.wc-child-subscription-manager table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}

.wc-child-subscription-manager th,
.wc-child-subscription-manager td {
    padding: 10px;
    border: 1px solid #dee2e6;
    text-align: left;
}

.wc-child-subscription-manager th {
    background-color: #f1f3f5;
}

.wc-child-subscription-manager .children-list {
    margin-bottom: 20px;
}

.wc-child-subscription-manager .add-child-form {
    margin-top: 20px;
}

.wc-child-subscription-manager .add-child-form h3 {
    margin-bottom: 15px;
}

.wc-child-subscription-manager .add-child-form form p {
    margin-bottom: 15px;
}

.wc-child-subscription-manager .add-child-form input,
.wc-child-subscription-manager .add-child-form select {
    width: 100%;
    max-width: 400px;
    padding: 8px;
    margin-top: 5px;
}

.wc-child-subscription-notice {
    background: #fff3cd;
    color: #856404;
    padding: 1px 12px;
    margin-bottom: 20px;
    border: 1px solid #ffeeba;
    border-left: 4px solid #ffc107;
}

.wc-child-subscription-notice a {
    color: #006395;
    text-decoration: none;
    font-weight: bold;
}

.wc-child-subscription-notice a:hover {
    text-decoration: underline;
}

/* Checkout page specific styles */
.checkout-dropdown {
    margin: 20px 0;
    padding: 15px;
    background: #ffffff;
    border: 1px solid #ddd;
}

.checkout-dropdown label {
    display: block;
    margin-bottom: 8px;
    font-weight: bold;
}

.checkout-dropdown select {
    width: 100%;
    max-width: 400px;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid #ddd;
    border-radius: 3px;
}

@media (max-width: 768px) {
    .checkout-dropdown select {
        width: 100%;
    }
}