/* Custom styles for NAS (Nested Adoption Solutions) */
/* Custom base fonts and spacing for Child Theme */
html {
    font-size: 62.5%; /* This sets 1rem to 10px for easier calculations */
}

body {
    font-size: clamp(1.4rem, calc(1.4rem + ((1vw - 0.32rem) * 0.4167)), 1.8rem); /* Responsive font size */
    font-weight: 400;
    line-height: 1.6;
    text-transform: none;
    font-style: normal;
    text-decoration: none;
    letter-spacing: normal;
    word-spacing: normal;
    font-family: 'Heebo', sans-serif; /* Ensure Heebo is set as the font-family */
}

h1, .elementor-widget-heading .elementor-heading-title {
    font-size: clamp(3.2rem, calc(3.2rem + ((1vw - 0.32rem) * 1.6667)), 4.8rem); /* Responsive font size */
    font-weight: 700; /* Bold */
    line-height: 1.2; /* Adjust line height for better readability */
    letter-spacing: 1px; /* Adjust letter spacing */
    margin-top: 40px; /* Add top margin for spacing */
    margin-bottom: 20px; /* Add bottom margin for spacing */
}

h2 {
    font-size: clamp(2.8rem, calc(2.8rem + ((1vw - 0.32rem) * 1.0417)), 3.8rem); /* Responsive font size */
    font-weight: 600; /* Semi-Bold */
    line-height: 1.3; /* Adjust line height for better readability */
    letter-spacing: 1px; /* Adjust letter spacing */
    margin-top: 35px; /* Add top margin for spacing */
    margin-bottom: 18px; /* Add bottom margin for spacing */
}

h3 {
    font-size: clamp(2.4rem, calc(2.4rem + ((1vw - 0.32rem) * 0.8333)), 3.2rem); /* Responsive font size */
    font-weight: 600; /* Semi-Bold */
    line-height: 1.4; /* Adjust line height for better readability */
    letter-spacing: 1px; /* Adjust letter spacing */
    margin-top: 30px; /* Add top margin for spacing */
    margin-bottom: 15px; /* Add bottom margin for spacing */
}

h4 {
    font-size: clamp(2.2rem, calc(2.2rem + ((1vw - 0.32rem) * 0.625)), 2.8rem); /* Responsive font size */
    font-weight: 600; /* Semi-Bold */
    line-height: 1.4; /* Adjust line height for better readability */
    letter-spacing: 1px; /* Adjust letter spacing */
    margin-top: 25px; /* Add top margin for spacing */
    margin-bottom: 12px; /* Add bottom margin for spacing */
}

h5 {
    font-size: clamp(2rem, calc(2rem + ((1vw - 0.32rem) * 0.4167)), 2.4rem); /* Responsive font size */
    font-weight: 600; /* Semi-Bold */
    line-height: 1.5; /* Adjust line height for better readability */
    letter-spacing: 1px; /* Adjust letter spacing */
    margin-top: 20px; /* Add top margin for spacing */
    margin-bottom: 10px; /* Add bottom margin for spacing */
}

h6 {
    font-size: clamp(1.4rem, calc(1.4rem + ((1vw - 0.32rem) * 0.4167)), 1.8rem); /* Responsive font size */
    font-weight: 600; /* Semi-Bold */
    line-height: 1.5; /* Adjust line height for better readability */
    letter-spacing: 1px; /* Adjust letter spacing */
    margin-top: 18px; /* Add top margin for spacing */
    margin-bottom: 8px; /* Add bottom margin for spacing */
}

p {
    margin-bottom: 1.6em; /* Margin for paragraphs */
}

/* Single product content wrapper */
.nas-single-product-content {
    background-color: #ffffff;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 5px;
    margin-bottom: 20px;
}

/* Breadcrumb styling */
.nas-breadcrumb {
    background-color: #f9f9f9;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 20px;
}

/* Sidebar styling */
.nas-sidebar {
    background-color: #f0f0f0;
    padding: 20px;
    border-radius: 5px;
}

/* Main content wrapper */
.nas-main-content {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

/* Footer styling */
.nas-footer {
    background-color: #333;
    color: #fff;
    padding: 20px;
    text-align: center;
    border-top: 1px solid #444;
}

/* Cart form */
.nas-woocommerce-cart-form {
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 5px;
}

/* Cart table */
.nas-shop_table {
    width: 100%;
    margin-bottom: 20px;
}

/* Table headers */
.nas-shop_table thead th {
    background-color: #f0f0f0;
    padding: 10px;
    border-bottom: 1px solid #ddd;
}

/* Cart items */
.nas-woocommerce-cart-form__cart-item {
    border-bottom: 1px solid #ddd;
}

.nas-woocommerce-cart-form__cart-item td {
    padding: 10px;
}

/* Product remove button */
.nas-product-remove .nas-remove {
    color: #ff0000;
    font-size: 1.2em;
}

/* Product thumbnail */
.nas-product-thumbnail a {
    display: block;
    width: 150px;
    height: 150px;
}

.nas-product-thumbnail a img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* This ensures the image covers the entire space without distortion */
}

/* Product name */
.nas-product-name a {
    color: #333;
    text-decoration: none;
    font-weight: bold;
}

/* Backorder notification */
.nas-backorder_notification {
    color: #ff0000;
}

/* Product price */
.nas-product-price {
    text-align: right;
}

/* Product quantity */
.nas-product-quantity {
    text-align: center;
}

/* Product subtotal */
.nas-product-subtotal {
    text-align: right;
}

/* Coupon section */
.nas-coupon {
    margin-bottom: 20px;
}

.nas-coupon .nas-input-text {
    width: auto;
    margin-right: 10px;
}

.nas-coupon .nas-button {
    background-color: #4d9fa8;
    color: #ffffff;
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
}

/* Update cart button */
.nas-actions .nas-button {
    background-color: #4d9fa8;
    color: #ffffff;
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
}

/* Cart collaterals */
.nas-cart-collaterals {
    margin-top: 20px;
}

/* Proceed to checkout button */
.nas-checkout-button {
    background-color: #4d9fa8;
    color: #ffffff;
    padding: 15px 30px;
    border: none;
    border-radius: 5px;
    text-transform: uppercase;
    font-size: 1.2em;
    text-align: center;
    display: inline-block;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.nas-checkout-button:hover {
    background-color: #005f8d;
}

/* Add to cart button */
.nas-add-to-cart-button {
    background-color: #0073aa;
    color: #ffffff;
    padding: 15px 30px;
    border: none;
    border-radius: 5px;
    text-transform: uppercase;
    font-size: 1.2em;
    text-align: center;
    display: inline-block;
    cursor: pointer;
    transition: background-color 0.3s ease;
    margin: 10px 0;
}

.nas-add-to-cart-button:hover {
    background-color: #005f8d;
}

/* Custom styles for My Account */
.woocommerce-Button.button.nas-subscription-button {
    color: #fff !important; /* Set text color to white */
}

/* Custom styles for My Account Membership Products */
.nas-custom-products-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.nas-custom-product-box {
    border: 1px solid #ddd;
    padding: 20px;
    margin-bottom: 20px;
    width: 100%;
    max-width: 300px;
}

.nas-custom-product-box h2 {
    font-size: 24px;
    text-align: center;
    margin-bottom: 10px;
}

.nas-custom-product-box .nas-product-price {
    font-size: 20px;
    color: #333;
    margin-bottom: 10px;
}

.nas-custom-product-box .nas-package-price {
    font-size: 18px;
    color: #000;
    margin-top: 5px;
}

.nas-custom-product-box .nas-product-description {
    margin-bottom: 10px;
}

.nas-custom-product-box a {
    display: inline-block;
    margin-right: 10px;
    text-decoration: none;
    color: #0073aa;
}

.nas-custom-product-box a:hover {
    text-decoration: underline;
}

/* Pagination Styles of My Membership Products */
.nas-pagination {
    text-align: center;
    margin: 20px 0;
}

.nas-pagination ul {
    list-style: none;
    padding: 0;
    display: inline-block;
}

.nas-pagination li {
    display: inline;
    margin: 0 5px;
}

.nas-pagination a,
.nas-pagination span {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    text-decoration: none;
    color: #333;
    transition: background-color 0.3s;
}

.nas-pagination a:hover {
    background-color: #f1f1f1;
}

.nas-pagination .current {
    background-color: #0073aa;
    color: #fff;
    border-color: #0073aa;
}

/* WC Information Bar with login or register */
.nas-notice {
    background-color: #f9f9f9;
    border-left: 5px solid #0073aa;
    padding: 15px;
    display: flex;
    align-items: center;
}

.nas-notice img {
    margin-right: 10px;
    width: 40px;
    height: 40px;
}

.elementor-widget-container .yith-wcwl-add-button {
    background-color: #34b9a1; /* Replace with your desired background color */
    color: #fff; /* Text color */
    border: none; /* Remove border */
    padding: 10px 20px; /* Adjust padding */
    font-size: 1.5rem; /* Font size */
    border-radius: 5px; /* Rounded corners */
    display: inline-block; /* Inline block display */
    text-align: center; /* Center text */
    cursor: pointer; /* Pointer cursor */
    transition: background-color 0.3s ease; /* Transition for background color */
}

.elementor-widget-container .yith-wcwl-add-button:hover {
    background-color: #2c9b85; /* Hover background color */
}

.elementor-widget-container .yith-wcwl-add-button:active {
    background-color: #288b75; /* Active background color */
}

.elementor-widget-container .yith-wcwl-add-button.added {
    background-color: #6c757d; /* Change to your desired color for the added state */
    cursor: default; /* Default cursor */
}

.elementor-widget-container .yith-wcwl-add-button a {
    color: #fff; /* Text color */
    text-decoration: none; /* Remove underline */
}

.elementor-widget-container .yith-wcwl-add-button a:hover {
    color: #fff; /* Hover text color */
}

.elementor-widget-container .yith-wcwl-add-button a:active {
    color: #fff; /* Active text color */
}

.facetwp-type-fselect .fs-option .fs-option-label {
    white-space: wrap !important;
}

/* Random Services PHP */
.nas-random-services {
    display: flex;
    justify-content: space-around;
    margin-top: 20px;
    flex-wrap: wrap; /* Allow items to wrap */
}

.nas-service-link {
    text-decoration: none; /* Remove underline from links */
    color: inherit; /* Inherit text color */
    display: block;
    margin: 10px; /* Add margin for spacing */
    max-width: 300px; /* Adjust to fit your design */
}

.nas-service {
    text-align: center;
    background: rgba(255, 255, 255, 0.1); /* Transparent background */
    padding: 20px;
    border-radius: 10px;
    position: relative;
}

.nas-service-thumbnail img {
    max-width: 100px;
    height: auto;
    margin-bottom: 15px;
}

.nas-service-title {
    color: #fff; /* Theme color 7 - white */
    margin-bottom: 10px;
}

.nas-service-lede {
    color: #fff; /* Theme color 7 - white */
}

/* Random Services PHP Media Query for Mobile Devices */
@media (max-width: 768px) {
    .nas-random-services {
        flex-direction: column;
        align-items: center;
    }

    .nas-service-link {
        max-width: 100%;
    }
}
