/**
 * Doggy Day Care Transport - Styles
 *
 * @package DoggyDaycareTransport
 */

.ddt-custom-fields {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.ddt-custom-fields h3 {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 1.3em;
    color: #333;
}

.ddt-field-group {
    margin-bottom: 20px;
}

.ddt-field-group label {
    display: block;
    font-weight: 600;
    margin-bottom: 5px;
    color: #333;
}

.ddt-field-group select,
.ddt-field-group input[type="text"],
.ddt-field-group textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    transition: border-color 0.3s ease;
}

.ddt-field-group select:focus,
.ddt-field-group input[type="text"]:focus,
.ddt-field-group textarea:focus {
    outline: none;
    border-color: #2c3e50;
}

.ddt-field-group input[type="checkbox"] {
    margin-right: 8px;
    width: auto;
}

/* Day checkboxes */
.ddt-day-checkbox,
.ddt-transport-day-checkbox {
    margin-right: 5px;
}

/* Disabled transport day styling */
.ddt-day-disabled {
    opacity: 0.5;
    color: #999;
    text-decoration: line-through;
    cursor: not-allowed;
    background-color: #f5f5f5;
    padding: 5px 10px;
    border-radius: 3px;
}

.ddt-day-disabled input[type="checkbox"] {
    cursor: not-allowed;
}

.ddt-day-disabled:hover {
    opacity: 0.5;
}

/* Price displays */
#ddt_base_price_display,
#ddt_transport_price_display,
#ddt_total_price_display {
    animation: fadeIn 0.3s ease-in;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#ddt_base_price_amount,
#ddt_transport_price_amount,
#ddt_total_price_amount {
    font-weight: bold;
}

/* Transport options */
#ddt_transport_options {
    border-left: 3px solid #2c3e50;
}

/* Warnings and errors */
#ddt_area_warning,
#ddt_transport_mismatch_warning {
    animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
    from {
        opacity: 0;
        max-height: 0;
    }
    to {
        opacity: 1;
        max-height: 500px;
    }
}

#ddt_validation_error {
    animation: shake 0.5s;
}

@keyframes shake {
    0%, 100% {
        transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-5px);
    }
    20%, 40%, 60%, 80% {
        transform: translateX(5px);
    }
}

#ddt_day_selection_error {
    font-size: 0.9em;
    margin-top: 5px;
}

/* Disabled add to cart button */
.single_add_to_cart_button.disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Responsive design */
@media (max-width: 768px) {
    .ddt-custom-fields {
        padding: 15px;
    }
    
    .ddt-field-group label[style*="inline-block"] {
        display: block !important;
        margin-bottom: 8px;
    }
    
    #ddt_total_price_amount {
        display: block;
        margin-top: 10px;
        margin-left: 0 !important;
    }
}

/* Print styles */
@media print {
    .ddt-custom-fields {
        border: none;
        padding: 0;
    }
    
    #ddt_validation_error,
    #ddt_area_warning,
    #ddt_transport_mismatch_warning {
        display: none !important;
    }
}

/* Accessibility improvements */
.ddt-field-group label span[style*="color: red"] {
    font-weight: bold;
}

.ddt-field-group input:focus,
.ddt-field-group select:focus,
.ddt-field-group textarea:focus {
    box-shadow: 0 0 0 3px rgba(44, 62, 80, 0.1);
}

/* Loading state */
.ddt-loading {
    position: relative;
    pointer-events: none;
    opacity: 0.6;
}

.ddt-loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    border: 2px solid #f3f3f3;
    border-top: 2px solid #2c3e50;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Smooth transitions */
.ddt-field-group,
#ddt_transport_options,
#ddt_transport_days_group,
#ddt_selected_days_group {
    transition: all 0.3s ease;
}

/* Better checkbox styling */
input[type="checkbox"] {
    cursor: pointer;
    width: 18px;
    height: 18px;
    vertical-align: middle;
}

/* Notice boxes */
.ddt-notice {
    padding: 12px 15px;
    border-radius: 4px;
    margin: 15px 0;
    border-left: 4px solid;
}

.ddt-notice.info {
    background-color: #e3f2fd;
    border-left-color: #2196f3;
    color: #0d47a1;
}

.ddt-notice.warning {
    background-color: #fff3cd;
    border-left-color: #ffc107;
    color: #856404;
}

.ddt-notice.error {
    background-color: #f8d7da;
    border-left-color: #dc3545;
    color: #721c24;
}

.ddt-notice.success {
    background-color: #d4edda;
    border-left-color: #28a745;
    color: #155724;
}
