/**
 * Bright Flower Theme - Custom Styles
 * Font families and responsive utilities for header navigation
 */

/* ========================================
   FONT FAMILIES
   ======================================== */
.font-helvetica {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Apply Helvetica to header elements */
.bf-header-nav,
.bf-header-nav *,
.bf-primary-menu,
.bf-primary-menu * {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* ========================================
   HEADER NAV CLEARFIX
   ======================================== */
.bf-header-nav::before,
.bf-header-nav::after,
.bf-container::before,
.bf-container::after,
.bf-row::before,
.bf-row::after {
    content: " ";
    display: table;
}

.bf-header-nav::after,
.bf-container::after,
.bf-row::after {
    clear: both;
}

/* ========================================
   PRIMARY MENU STYLES
   ======================================== */
.bf-primary-menu {
    touch-action: pan-y;
}

/* Menu item with dropdown indicator */
.bf-primary-menu > li > a::before {
    content: "";
    height: 100%;
    position: absolute;
    width: 0;
    right: 25px;
    top: 0;
}

/* Submenu initially hidden */
.bf-submenu {
    display: none;
}

/* Show submenu on hover */
.bf-primary-menu > li.group:hover > .bf-submenu {
    display: block;
}

/* ========================================
   MINI CART STYLES
   ======================================== */
.bf-mini-cart {
    display: none;
}

.bf-icon-cart:hover .bf-mini-cart {
    display: block;
}

/* Cart items list */
.bf-cart-items {
    max-height: 300px;
    overflow-y: auto;
}

/* ========================================
   RESPONSIVE BREAKPOINTS
   ======================================== */

/* Extra Large (1200px and above) */
@media (min-width: 1200px) {
    .bf-container {
        width: 1170px;
    }
    
    .bf-nav-container {
        width: 1170px;
    }
}

/* Large (992px to 1199px) */
@media (min-width: 992px) and (max-width: 1199px) {
    .bf-container {
        width: 970px;
        padding-left: 15px;
        padding-right: 15px;
    }
    
    .bf-nav-container {
        width: 970px;
        padding-left: 15px;
        padding-right: 15px;
    }
    
    .bf-logo-col {
        float: left;
        width: 16.6667%;
    }
    
    .bf-daily-col {
        float: left;
        width: 25%;
    }
    
    .bf-tools-col {
        float: left;
        width: 58.3333%;
    }
}

/* Medium (768px to 991px) */
@media (min-width: 768px) and (max-width: 991px) {
    .bf-container {
        width: 750px;
    }
    
    .bf-nav-container {
        width: 750px;
    }
    
    .bf-tools-wrap {
        margin-top: 15px;
    }
    
    .bf-phone,
    .bf-delivery-info {
        float: none;
        margin-right: 15px;
        margin-bottom: 8px;
    }
}

/* Small (below 768px) */
@media (max-width: 767px) {
    .bf-daily-wrap,
    .bf-contact-info {
        display: none;
    }
    
    .bf-nav-toggle {
        display: block;
        color: black;
        cursor: pointer;
        font-size: 1.5rem;
    }
    
    .bf-tools-wrap {
        margin-top: 35px;
    }
    
    .bf-icon-delivery,
    .bf-icon-cart {
        margin-right: 20px;
    }
}

/* Extra Small - max-xs (below 468px) */
@media (max-width: 467px) {
    .bf-container {
        line-height: 70px;
    }
    
    .bf-row,
    .bf-logo-col,
    .bf-daily-col,
    .bf-tools-col {
        line-height: 70px;
    }
    
    .bf-logo-img {
        height: 50px !important;
    }
    
    .bf-tools-wrap {
        margin-top: 10px;
    }
    
    .bf-mini-cart {
        left: -175px;
    }
    
    .bf-mini-cart-inner {
        width: 250px;
    }
    
    .bf-cart-arrow {
        margin-left: 0;
        margin-right: 12px;
        right: 42px;
    }
    
    .bf-cart-footer {
        font-size: 14px;
    }
    
    .bf-checkout-btn {
        font-size: 12px;
        padding: 5px 10px;
        border-width: 2px;
    }
}

/* ========================================
   MENU TOGGLE TEXT SIZES (with breakpoint ranges)
   ======================================== */

/* 992px - 1199px: Small text (9px) for tablet */
@media (min-width: 992px) and (max-width: 1199px) {
    .bf-menu-text {
        font-size: 9px !important;
    }
    .bf-menu-icon {
        font-size: 1.5rem;
    }
}

/* 768px - 991px: Large text (2.25rem/4xl) for mobile */
@media (min-width: 768px) and (max-width: 991px) {
    .bf-menu-text,
    .bf-menu-icon {
        font-size: 2.25rem;
    }
}

/* Below 768px: Medium text (1.5rem/2xl) for small mobile */
@media (max-width: 767px) {
    .bf-menu-text,
    .bf-menu-icon {
        font-size: 1.5rem;
    }
}

/* ========================================
   MOBILE MENU ANIMATION
   ======================================== */
.bf-main-nav {
    transition: all 0.3s ease;
}

@media (max-width: 767px) {
    .bf-main-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        z-index: 999;
    }
    
    .bf-main-nav.is-open {
        display: block;
    }
    
    .bf-primary-menu {
        height: auto;
    }
    
    .bf-primary-menu > li {
        display: block;
        float: none;
    }
    
    .bf-primary-menu > li > a {
        display: block;
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .bf-submenu {
        position: static;
        width: 100%;
    }
    
    .bf-right-menu {
        display: none;
    }
}

/* ========================================
   HOVER EFFECTS
   ======================================== */
.bf-primary-menu > li > a:hover::after,
.bf-primary-menu > li > a:focus::after {
    content: "";
    height: 100%;
    position: absolute;
    z-index: 1;
    border-right: 1px solid #81AB49;
    right: -1px;
    top: 0;
}

.bf-submenu li a:hover::after {
    content: "";
    position: absolute;
    width: 100%;
    z-index: 1;
    border-bottom: 1px solid #81ab49;
    left: 0;
    bottom: -1px;
}

/* ========================================
   FOCUS STYLES (Accessibility)
   ======================================== */
.bf-header-nav a:focus,
.bf-header-nav button:focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

/* ========================================
   UTILITY CLASSES
   ======================================== */
.line-clamp-1 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Touch action for mobile */
.touch-pan-y {
    touch-action: pan-y;
}

/* ========================================
   ICON SPRITE REPLACEMENT (SVG)
   ======================================== */
/* Since we replaced sprite images with inline SVGs, 
   these classes are kept for reference/fallback */
.bf-icon-sprite {
    background: transparent;
    display: inline-block;
}

/* ========================================
   RIGHT MENU POSITIONING
   ======================================== */
.bf-nav-container {
    position: relative;
}

.bf-right-menu {
    position: absolute;
    right: 15px;
    top: 0;
    height: 51px;
    display: flex;
    align-items: center;
}

@media (max-width: 991px) {
    .bf-right-menu {
        display: none;
    }
}

/* ========================================
   MOBILE SIDEBAR MENU
   ======================================== */

/* Overlay active state */
#bf-mobile-overlay.is-active {
    display: block;
    opacity: 1;
}

/* Mobile menu active state */
#bf-mobile-menu.is-active {
    transform: translateX(0);
}

/* Prevent body scroll when menu is open */
body.mobile-menu-open {
    overflow: hidden;
}

/* Mobile menu list */
.bf-mobile-menu-list {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Mobile menu item */
.bf-mobile-menu-item {
    position: relative;
}

/* Mobile link styles */
.bf-mobile-link,
.bf-mobile-sublink {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Submenu toggle icon rotation */
.bf-mobile-toggle[aria-expanded="true"] .bf-toggle-icon {
    transform: rotate(45deg);
}

.bf-toggle-icon {
    display: inline-block;
    transition: transform 0.3s ease;
    font-weight: 300;
    line-height: 1;
}

/* Submenu animation */
.bf-mobile-submenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
}

.bf-mobile-submenu.is-open {
    display: block;
    max-height: 1000px;
    transition: max-height 0.5s ease-in;
}

/* Mobile social links */
.bf-mobile-social a {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Mobile CTA button */
.bf-mobile-cta a {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Hide mobile menu toggle on desktop */
@media (min-width: 768px) {
    .bf-nav-toggle {
        display: none !important;
    }
    
    #bf-mobile-menu,
    #bf-mobile-overlay {
        display: none !important;
    }
    
    /* Logo size for desktop */
    .bf-logo-img {
        height: 90px !important;
        width: 90px !important;
        object-fit: contain;
    }
}

/* Show mobile menu toggle on mobile */
@media (max-width: 767px) {
    .bf-nav-toggle {
        display: flex !important;
    }
    
    .bf-main-nav {
        display: none !important;
    }
}

/* ========================================
   PRINT STYLES
   ======================================== */
@media print {
    .bf-header-nav {
        position: static;
        background: white;
    }
    
    .bf-main-nav {
        display: none;
    }
    
    #bf-mobile-menu,
    #bf-mobile-overlay {
        display: none !important;
    }
}

/* ========================================
   FOOTER STYLES
   ======================================== */

/* Footer base font */
#colophon,
#colophon * {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Footer container responsive widths */
.bf-footer-container {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

@media (min-width: 992px) {
    .bf-footer-container {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .bf-footer-container {
        width: 1170px;
    }
}

/* Footer clearfix */
.bf-footer-row::before,
.bf-footer-row::after {
    content: " ";
    display: table;
}

.bf-footer-row::after {
    clear: both;
}

/* Footer first column */
.bf-footer-col-first {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Footer link columns */
.bf-footer-col {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Footer aside inner */
.bf-footer-aside {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

@media (min-width: 390px) and (max-width: 767px) {
    .bf-footer-aside {
        padding-left: 15%;
    }
}

/* Footer menu list */
.bf-footer-menu {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    list-style: none;
    margin: 0;
    padding: 0;
}

.bf-footer-menu li {
    color: #525252;
    font-size: 13px;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 10px;
}

.bf-footer-menu a {
    background: transparent;
    color: #525252;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: normal;
    text-decoration: none;
}

.bf-footer-menu a:hover {
    outline: 0;
}

.bf-footer-menu a:active {
    outline: 0;
}

.bf-footer-menu a:focus {
    outline: 5px auto -webkit-focus-ring-color;
}

/* Footer links */
.bf-footer-link {
    font-family: Helvetica, Arial, sans-serif;
}

.bf-footer-link:active {
    outline: 0;
}

.bf-footer-link:hover {
    outline: 0;
}

.bf-footer-link:focus {
    outline: 5px auto -webkit-focus-ring-color;
}

/* Footer external links */
.bf-footer-external-link {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.bf-footer-external-link:active {
    outline: 0;
}

.bf-footer-external-link:hover {
    outline: 0;
}

.bf-footer-external-link:focus {
    outline: 5px auto -webkit-focus-ring-color;
}

/* Footer phone link */
.bf-footer-phone {
    font-family: Helvetica, Arial, sans-serif;
}

@media (max-width: 550px) {
    .bf-footer-phone {
        text-decoration: underline;
    }
}

.bf-footer-phone:active {
    outline: 0;
}

.bf-footer-phone:hover {
    outline: 0;
}

.bf-footer-phone:focus {
    outline: 5px auto -webkit-focus-ring-color;
}

/* Footer about section */
.bf-footer-about-col {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

@media (min-width: 992px) {
    .bf-footer-about-col {
        float: left;
        width: 66.6667%;
    }
}

/* Footer about aside */
.bf-footer-about-aside {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

@media (min-width: 390px) and (max-width: 767px) {
    .bf-footer-about-aside {
        padding-left: 0;
    }
}

.bf-footer-about-aside::before,
.bf-footer-about-aside::after {
    content: " ";
    display: table;
}

.bf-footer-about-aside::after {
    clear: both;
}

/* Footer logo image */
.bf-footer-logo {
    border-style: initial;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    height: 80px !important;
}

/* Footer SVG icons */
.bf-footer-svg {
    font-family: Helvetica, Arial, sans-serif;
}

.bf-footer-svg:not(:root) {
    overflow: hidden;
}

/* Footer image styles */
.bf-footer-img {
    border-style: initial;
    font-family: Helvetica, Arial, sans-serif;
}

/* Responsive text center for mobile */
@media (max-width: 991px) {
    .bf-footer-text-center-mobile {
        text-align: center;
    }
}

/* WordPress menu integration for footer */
#footer-quick-links-menu,
#footer-more-links-menu,
#footer-company-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

#footer-quick-links-menu li,
#footer-more-links-menu li,
#footer-company-menu li {
    color: #525252;
    font-size: 13px;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 10px;
}

#footer-quick-links-menu a,
#footer-more-links-menu a,
#footer-company-menu a {
    background: transparent;
    color: #525252;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: normal;
    text-decoration: none;
}

#footer-quick-links-menu a:focus,
#footer-more-links-menu a:focus,
#footer-company-menu a:focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

/* ========================================
   PAGE CONTENT STYLES
   ======================================== */

.page-content {
    background-color: #fff;
    min-height: 50vh;
}

.page-content .pad {
    padding: 30px 15px 50px 15px;
}

.page-content h1 {
    color: #525252;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.2;
    margin: 0 0 20px 0;
}

.page-content .entry-content {
    color: #525252;
    font-size: 15px;
    line-height: 1.7;
}

.page-content .entry-content p {
    margin-bottom: 1rem;
}

.page-content .entry-content h2,
.page-content .entry-content h3,
.page-content .entry-content h4 {
    color: #404040;
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
}

.page-content .entry-content ul,
.page-content .entry-content ol {
    margin-bottom: 1rem;
    padding-left: 1.5rem;
}

.page-content .entry-content li {
    margin-bottom: 0.5rem;
}

.page-content .entry-content a {
    color: #81AB49;
    text-decoration: underline;
}

.page-content .entry-content a:hover {
    color: #6E913F;
}

.page-content .entry-thumbnail {
    margin-bottom: 1.5rem;
}

.page-content .entry-thumbnail img {
    width: 100%;
    height: auto;
    border-radius: 8px;
}

/* Page content container responsive widths */
.page-content .container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

@media (min-width: 768px) {
    .page-content .container {
        width: 750px;
    }
}

@media (min-width: 992px) {
    .page-content .container {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .page-content .container {
        width: 1170px;
    }
}

/* ========================================
   CONTACT PAGE STYLES
   ======================================== */

/* Contact page inherited styles */
.inherited-styles-for-exported-element,
.contact-us h3 {
    color: #525252;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.inherited-styles-for-exported-element {
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
}

.contact-us h3 {
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.1;
    text-transform: uppercase;
    margin: 0 0 20px 0;
}

/* Contact page padding */
.contact-us .pad {
    padding: 30px 15px 50px 15px;
}

/* Contact page phone number */
.contact-us .phone-number {
    font-size: 1.5rem;
    font-weight: 700;
}

/* Contact page line divider */
.contact-us .line {
    margin: 50px 0;
}

hr.line {
    background-color: #e5e5e5;
    height: 1px;
    width: 100%;
    border: 0;
    border-style: initial;
}

/* Contact page info details */
.contact-us .info-details {
    padding-left: 80px;
}

/* Contact form styles */
.form-contact input[type=email],
.form-contact input[type=text],
.form-contact textarea {
    border: 1px solid #e5e5e5;
    font-style: italic;
    height: 40px;
    width: 100%;
    padding: 0 10px;
    border-style: solid;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    transition: border-color 0.2s ease;
}

.form-contact input[type=email]:focus,
.form-contact input[type=text]:focus,
.form-contact textarea:focus {
    outline: none;
    border-color: #81AB49;
}

.form-contact textarea {
    height: 220px;
    padding: 20px;
    resize: vertical;
}

/* Contact form send button */
.form-contact .btn-send {
    background-color: #fb923c;
    color: white;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 10px 100px;
    border-radius: 0;
    border: none;
    transition: background-color 0.2s ease, transform 0.1s ease;
}

.form-contact .btn-send:hover {
    background-color: #ea580c;
}

.form-contact .btn-send:active {
    transform: translateY(1px);
}

.form-contact .btn-send .fa-icon {
    margin-right: 15px;
}

.form-contact .btn-send svg {
    display: inline-block;
    vertical-align: middle;
    margin-top: -2px;
}

/* Form group and labels */
.form-contact .form-group {
    margin-bottom: 15px;
}

.form-contact .form-group label {
    font-size: 18px;
    font-weight: 400;
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
}

/* Form feedback positioning */
.has-feedback {
    position: relative;
}

.has-feedback label ~ .form-control-feedback {
    top: 45px;
}

.form-control-feedback {
    display: block;
    height: 34px;
    line-height: 34px;
    pointer-events: none;
    position: absolute;
    text-align: center;
    width: 34px;
    z-index: 2;
    right: 0;
}

/* Help block for messages */
.help-block {
    color: #737373;
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
}

.help-block.success {
    color: #16a34a;
    background-color: #f0fdf4;
    padding: 12px 16px;
    border-radius: 4px;
    border: 1px solid #bbf7d0;
}

.help-block.error {
    color: #dc2626;
    background-color: #fef2f2;
    padding: 12px 16px;
    border-radius: 4px;
    border: 1px solid #fecaca;
}

/* Global Breadcrumb Section */
.bf-breadcrumb-section {
    background-color: #fff;
}

.bf-breadcrumb-section .container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

@media (min-width: 768px) {
    .bf-breadcrumb-section .container {
        width: 750px;
    }
}

@media (min-width: 992px) {
    .bf-breadcrumb-section .container {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .bf-breadcrumb-section .container {
        width: 1170px;
    }
}

/* Breadcrumbs styles */
.breadcrumb {
    background-color: white;
    padding-right: 15px;
    border-radius: 0;
}

.breadcrumbs {
    margin: 0;
    padding: 10px 0;
    font-family: Helvetica, Arial, sans-serif;
    list-style: none;
}

.breadcrumbs li {
    display: inline;
    font-size: 14px;
    margin-right: 10px;
}

.breadcrumbs li::after {
    content: "›";
    margin-left: 10px;
    color: #a3a3a3;
}

.breadcrumbs li:last-child::after {
    content: "";
}

.breadcrumbs li a {
    text-decoration: underline;
    color: #525252;
}

.breadcrumbs li a:hover {
    color: #0369a1;
}

/* Button default styles */
.btn {
    border: 1px solid;
    cursor: pointer;
    line-height: 1.42857;
    touch-action: manipulation;
    user-select: none;
    vertical-align: middle;
    display: inline-block;
    text-align: center;
    margin-bottom: 0;
    border-style: solid;
    white-space: nowrap;
}

.btn:focus,
.btn:hover {
    text-decoration: none;
}

.btn:active {
    outline: 0;
}

.btn:active:focus,
.btn:focus,
a:focus {
    outline-offset: -2px;
    outline: 5px auto -webkit-focus-ring-color;
}

.btn-default {
    border-color: #d4d4d4;
}

.btn-default:focus {
    background-color: #e5e5e5;
    color: #333;
    border-color: #8c8c8c;
}

.btn-default:active,
.btn-default:hover {
    background-color: #e5e5e5;
    border-color: #a3a3a3;
    color: #333;
}

.btn-default:active:focus,
.btn-default:active:hover {
    background-color: #d4d4d4;
    color: #333;
    border-color: #8c8c8c;
}

/* reCAPTCHA spacing */
.g-recaptcha {
    margin-bottom: 20px;
}

/* Phone link styles */
#contactUs .phone-number a,
#contactUs .phone-number a:hover,
.phoneLink,
.phoneLink:hover {
    color: #737373;
    text-decoration: none;
}

/* Contact hours table */
#contactUs .contactHours td {
    width: 150px;
}

.contactHours {
    border-collapse: collapse;
}

.contactHours tr {
    border-bottom: 1px solid #f5f5f5;
}

.contactHours td {
    padding: 8px 0;
}

/* Map container */
.map-container {
    width: 100%;
    height: auto;
}

.map-container iframe {
    width: 100%;
    height: 400px;
    border: 0;
}

/* Contact item styling */
.contact-item {
    margin-bottom: 24px;
}

.contact-item strong {
    display: block;
    margin-bottom: 8px;
    color: #525252;
}

.contact-item svg {
    vertical-align: middle;
}

/* Grid columns for contact page */
.col-sm-12,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6 {
    min-height: 1px;
    position: relative;
    padding-left: 15px;
    padding-right: 15px;
}

/* Row clearfix */
.row {
    margin-left: -15px;
    margin-right: -15px;
}

.row::after,
.row::before {
    content: " ";
    display: table;
}

.row::after {
    clear: both;
}

/* Medium and up breakpoints */
@media (min-width: 768px) {
    .col-sm-12,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6 {
        float: left;
    }

    .col-sm-12 {
        width: 100%;
    }

    .col-sm-3 {
        width: 25%;
    }

    .col-sm-4 {
        width: 33.3333%;
    }

    .col-sm-5 {
        width: 41.6667%;
    }

    .col-sm-6 {
        width: 50%;
    }
}

/* Container responsive widths */
.contact-us .container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

@media (min-width: 768px) {
    .contact-us .container {
        width: 750px;
    }
}

@media (min-width: 992px) {
    .contact-us .container {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .contact-us .container {
        width: 1170px;
    }
}

/* Contact page responsive styles */
@media (max-width: 767px) {
    .contact-us .info-details {
        margin-top: 30px;
        padding: 0;
    }

    .mtom {
        margin-bottom: 30px;
    }

    .text {
        padding: 0;
    }

    #contactUs .phone-number {
        text-decoration: underline;
    }

    .col-sm-6 {
        width: 100%;
        float: none;
    }
}

@media (max-width: 550px) {
    .phoneLink {
        color: #737373;
        text-decoration: underline;
    }
}

@media (max-width: 467px) {
    .form-contact .btn-send {
        padding: 10px 20px;
        width: 100%;
    }

    .contact-us h3 {
        font-size: 1.25rem;
    }
}

/* Quick help section */
.quick-help {
    margin-top: 24px;
}

.quick-help p {
    margin: 15px 0;
}

/* Inline utility */
.inline {
    display: inline;
}

/* Table styles for contact */
table {
    background-color: transparent;
    border-collapse: collapse;
    -webkit-border-vertical-spacing: 0;
    -webkit-border-horizontal-spacing: 0;
}

td {
    padding: 0;
}

/* Strong/bold text */
strong {
    font-weight: 700;
}

/* Small text */
small {
    font-size: 85%;
}

/* Paragraph spacing */
.contact-us p {
    margin: 25px 0;
}

/* Link styles for contact page */
.contact-us a {
    background-color: transparent;
    color: #000;
    text-decoration: none;
}

.contact-us a:active,
.contact-us a:hover {
    outline: 0;
}

.contact-us a:focus,
.contact-us a:hover {
    color: #0369a1;
    text-decoration: underline;
}

/* Address styling */
address {
    font-style: normal;
    line-height: 1.75;
}

/* ========================================
   FAQ PAGE STYLES
   ======================================== */

/* FAQ Page Base */
.faq-page {
    background-color: #fff;
    min-height: 50vh;
}

.faq-page .pad {
    padding: 30px 15px 50px 15px;
}

/* FAQ Page Typography */
.faq-page h2 {
    color: #525252;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 300;
    line-height: 1.1;
    font-size: 2.25rem;
    margin: 0 0 30px 0;
}

.faq-page h3 {
    color: #525252;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 300;
    font-size: 1.5rem;
    line-height: 1.1;
    /* margin-top: 20px; */
    margin-bottom: 10px;
}

.faq-page p {
    margin: 25px 0;
}

.faq-page strong {
    font-weight: 700;
}

/* FAQ Page Links */
.faq-page a {
    background-color: transparent;
    color: #000;
    text-decoration: none;
}

.faq-page a:active,
.faq-page a:hover {
    outline: 0;
}

.faq-page a:focus,
.faq-page a:hover {
    color: #0369a1;
    text-decoration: underline;
}

.faq-page a:focus {
    outline: 5px auto -webkit-focus-ring-color;
}

/* FAQ Page Article Links */
.faq-page article.page ol li {
    margin: 0 0 10px 0;
}

.faq-page article.page h3 a,
.faq-page article.page ol li a {
    text-decoration: underline;
}

.faq-page article.page h3 a {
    font-size: 1.125rem;
}

/* FAQ Ordered List */
.faq-page ol {
    margin-top: 0;
    margin-bottom: 10px;
}

/* FAQ Sidebar Widget */
.faq-page .widget {
    margin-bottom: 20px;
}

.faq-page .widget a {
    font-family: Helvetica, Arial, sans-serif;
    color: #525252;
    letter-spacing: 1px;
}

.faq-page .widget ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.faq-page .widget .widget-title {
    font-family: Helvetica, Arial, sans-serif;
    font-weight: 700;
    margin: 0 0 20px 0;
}

/* FAQ Navigation Widget */
.faq-page .widget_nav .widget-title {
    border-bottom: 1px solid #e5e5e5;
    font-size: 1.5rem;
    letter-spacing: 0;
    text-transform: none;
    padding-bottom: 10px;
}

.faq-page .widget_nav ul li {
    margin: 0 0 15px 0;
    padding: 0;
}

.faq-page .widget_nav ul li a {
    padding: 5px 15px;
    display: block;
    transition: color 0.2s ease;
}

.faq-page .widget_nav ul li a:hover {
    color: #a3a3a3;
    text-decoration: none;
}

/* Active FAQ Tab */
.faq-page .widget_nav ul li.active a {
    background-color: #fb923c;
    color: #fff;
    display: block;
    font-size: 1.125rem;
    position: relative;
    border-radius: 2px;
}

/* .faq-page .widget_nav ul li.active a::after {
    content: "";
    height: 0;
    position: absolute;
    width: 0;
    border-left: 20px solid #fb923c;
    border-top: 13px solid transparent;
    border-bottom: 18px solid transparent;
    right: -20px;
    top: 0;
} */

.faq-page .widget_nav ul li a .fa-icon {
    margin-right: 5px;
    vertical-align: middle;
}

.faq-page .widget_nav ul li a .fa-icon svg {
    vertical-align: middle;
}

/* FAQ Tab Content */
.faq-page .tab-content {
    min-height: 800px;
}

.faq-page .tab-content > .tab-pane {
    display: none;
}

.faq-page .tab-content > .active {
    display: block;
}

/* FAQ Fade Animation */
.faq-page .fade {
    opacity: 0;
    transition: opacity 0.15s linear;
}

.faq-page .fade.in {
    opacity: 1;
}

/* FAQ Pull Right */
.faq-page .pull-right {
    float: right;
}

/* FAQ Icon */
.faq-page .fa-icon {
    color: inherit;
    display: inline-block;
    font-weight: normal;
    line-height: 1;
    font-variant: normal;
    -webkit-font-smoothing: antialiased;
    text-rendering: auto;
}

/* FAQ Answers Section */
.faq-page .faq-answers {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid #e5e5e5;
}

.faq-page .faq-answer-item {
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f5f5f5;
}

.faq-page .faq-answer-item:last-child {
    border-bottom: none;
}

.faq-page .faq-answer-content {
    color: #525252;
    font-size: 14px;
    line-height: 1.6;
}

.faq-page .faq-answer-content p {
    margin: 15px 0;
}

.faq-page .faq-answer-content ul,
.faq-page .faq-answer-content ol {
    margin: 15px 0;
    padding-left: 20px;
}

.faq-page .faq-answer-content li {
    margin-bottom: 8px;
}

/* FAQ Back to Top */
.faq-page .faq-back-top {
    margin-top: 15px;
    margin-bottom: 0;
    text-align: right;
}

.faq-page .back-to-top-link {
    color: #525252;
    font-size: 13px;
    text-decoration: none;
}

.faq-page .back-to-top-link:hover {
    color: #0369a1;
    text-decoration: underline;
}

.faq-page .back-to-top-link .fa-icon {
    margin-right: 5px;
}

.faq-page .back-to-top-link svg {
    vertical-align: middle;
}

/* FAQ No Content */
.faq-page .no-faqs {
    text-align: center;
    padding: 50px 20px;
    background-color: #f5f5f5;
    border-radius: 4px;
}

.faq-page .no-faqs p {
    color: #737373;
    font-size: 16px;
}

/* FAQ Container Responsive Widths */
.faq-page .container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

@media (min-width: 768px) {
    .faq-page .container {
        width: 750px;
    }
    
    .faq-page .col-sm-3 {
        float: left;
        width: 25%;
    }
    
    .faq-page .col-sm-9 {
        float: left;
        width: 75%;
    }
}

@media (min-width: 992px) {
    .faq-page .container {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .faq-page .container {
        width: 1170px;
    }
}

/* FAQ Mobile Responsive */
@media (max-width: 767px) {
    .faq-page .widget_nav ul li.active a::after {
        display: none;
    }
    
    .faq-page .widget_nav {
        margin-bottom: 30px;
    }
    
    .faq-page .tab-content {
        min-height: auto;
    }
    
    .faq-page h2 {
        font-size: 1.75rem;
    }
    
    .faq-page .widget_nav .widget-title {
        font-size: 1.25rem;
    }
}

/* ========================================
   WOOCOMMERCE SHOP ARCHIVE (archive-product)
   Version: 2025-02-shop - nếu thấy dòng này = CSS mới đã load
   ======================================== */

/* Container: same width as theme */
.bf-shop-archive {
    max-width: 1170px;
    margin-left: auto;
    margin-right: auto;
    padding: 30px 15px 50px;
}

@media (min-width: 768px) {
    .bf-shop-archive {
        width: 750px;
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media (min-width: 992px) {
    .bf-shop-archive {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .bf-shop-archive {
        width: 1170px;
    }
}

/* Shop header row */
.bf-shop-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e5e7eb;
}

.bf-shop-header-left {
    flex: 1 1 auto;
}

.bf-shop-result-count {
    font-size: 1rem;
    font-weight: 500;
    color: #4b5563;
    margin-top: 6px;
}

.bf-shop-archive .woocommerce-products-header {
    margin-bottom: 0;
}

/* Title category / Shop - vừa phải, không quá to */
.bf-shop-archive .woocommerce-products-header__title,
.bf-shop-archive .page-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0;
    letter-spacing: 0.02em;
    line-height: 1.3;
}

@media (min-width: 768px) {
    .bf-shop-archive .woocommerce-products-header__title,
    .bf-shop-archive .page-title {
        font-size: 1.75rem;
    }
}

.bf-shop-ordering .orderby {
    padding: 8px 36px 8px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
    color: #374151;
    background-color: #fff;
    cursor: pointer;
    min-height: 42px;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 20px;
}

.bf-shop-ordering .orderby:hover,
.bf-shop-ordering .orderby:focus {
    border-color: #81AB49;
    outline: none;
}

/* Price range filter - horizontal buttons */
.bf-price-filter {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
    padding: 16px 20px;
    margin-bottom: 24px;
    background-color: #f5f5f5;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
}

.bf-price-filter-label {
    font-size: 14px;
    font-weight: 500;
    color: #525252;
    flex-shrink: 0;
}

.bf-price-filter-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.bf-price-filter-btn {
    display: inline-block;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 500;
    color: #525252;
    background-color: #fff;
    border: 1px solid #d4d4d4;
    border-radius: 4px;
    text-decoration: none;
    transition: background-color 0.2s, border-color 0.2s, color 0.2s;
}

.bf-price-filter-btn:hover {
    border-color: #81AB49;
    color: #404040;
}

.bf-price-filter-btn.is-active {
    background-color: #404040;
    border-color: #404040;
    color: #fff;
}

.bf-price-filter-btn.is-active:hover {
    background-color: #525252;
    border-color: #525252;
    color: #fff;
}

@media (max-width: 767px) {
    .bf-price-filter {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* No products found - back link */
.bf-no-products-back {
    margin-top: 12px;
    margin-bottom: 0;
}

.bf-no-products-back .bf-back-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 500;
    color: #81AB49;
    text-decoration: none;
}

.bf-no-products-back .bf-back-link:hover {
    color: #6e913f;
    text-decoration: underline;
}

.bf-no-products-back .bf-back-link::before {
    content: "←";
    font-size: 1em;
}

/* Products grid - cố định layout, tránh rớt */
.bf-shop-archive ul.products.bf-products-grid,
body.woocommerce-page ul.products,
body.tax-product_cat ul.products {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 28px;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    box-sizing: border-box;
}

/* ::before và ::after trên ul.products (từ Tailwind/clearfix) đang bị tính là grid item
   và chiếm ô → product thứ 3 bị đẩy xuống dòng. Tắt để chỉ còn <li> tham gia grid. */
.bf-shop-archive ul.products.bf-products-grid::before,
.bf-shop-archive ul.products.bf-products-grid::after,
body.woocommerce-page ul.products::before,
body.woocommerce-page ul.products::after,
body.tax-product_cat ul.products::before,
body.tax-product_cat ul.products::after {
    content: none !important;
    display: none !important;
}

.bf-shop-archive ul.products.bf-products-grid li,
body.woocommerce-page ul.products li,
body.tax-product_cat ul.products li {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    clear: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .bf-shop-archive ul.products.bf-products-grid,
    body.woocommerce-page ul.products,
    body.tax-product_cat ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 992px) {
    .bf-shop-archive ul.products.bf-products-grid,
    body.woocommerce-page ul.products,
    body.tax-product_cat ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Product card - không cắt nội dung */
.bf-product-card {
    background: #fff;
    border: 1px solid #f3f4f6;
    border-radius: 12px;
    overflow: visible;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.25s ease, border-color 0.25s ease;
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    height: auto;
    min-height: 0;
}

.bf-product-card:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    border-color: rgba(129, 171, 73, 0.3);
}

.bf-product-card > a {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    min-height: 0;
    min-width: 0;
}

/* Image area - bo góc trên để đẹp khi card overflow visible */
.bf-product-card__image {
    position: relative;
    overflow: hidden;
    background: #f3f4f6;
    width: 100%;
    aspect-ratio: 1 / 1;
    min-height: 200px;
    flex-shrink: 0;
    border-radius: 12px 12px 0 0;
}

.bf-product-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.bf-product-card:hover .bf-product-card__image img {
    transform: scale(1.03);
}

/* WooCommerce sometimes adds .columns-3 and widths on li - override */
.bf-shop-archive .woocommerce ul.products li {
    width: 100% !important;
}

.bf-product-card__body {
    padding: 16px 20px 20px;
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    overflow: visible;
    min-height: 0;
    border-radius: 0 0 12px 12px;
    background: #fff;
}

.bf-product-card__action {
    /* padding-top: 12px; */
}

/* Tên sản phẩm - không bị che, luôn thấy */
.bf-product-card .woocommerce-loop-product__title,
.bf-product-card h2.woocommerce-loop-product__title {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 1.125rem;
    font-weight: 600;
    color: #1f2937 !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    line-height: 1.35;
    min-height: 2.6em;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}

.bf-product-card .woocommerce-loop-product__title a {
    color: inherit;
    text-decoration: none;
}

.bf-product-card .woocommerce-loop-product__title a:hover {
    color: #81AB49;
}

/* Giá - to, nổi bật */
.bf-product-card .price {
    font-size: 1.75rem;
    font-weight: 800;
    color: #15803d;
    margin-bottom: 0;
    letter-spacing: 0.02em;
}

@media (min-width: 768px) {
    .bf-product-card .price {
        font-size: 1.875rem;
    }
}

.bf-product-card .price del {
    color: #9ca3af;
    font-weight: 500;
    font-size: 1.125rem;
}

.bf-product-card .price ins {
    text-decoration: none;
    font-weight: 800;
}

.bf-product-card .button,
.bf-product-card a.button {
    display: block;
    text-align: center;
    padding: 10px 16px;
    border-radius: 8px;
    font-weight: 600;
    text-decoration: none;
    background: #db2777;
    color: #fff;
    border: none;
    transition: background 0.2s ease;
}

.bf-product-card .button:hover,
.bf-product-card a.button:hover {
    background: #be185d;
    color: #fff;
}

/* Fallback: trang shop + trang category (body.tax-product_cat) dù không có .bf-shop-archive */
body.woocommerce-page .woocommerce-products-header__title,
body.woocommerce-page .page-title,
body.tax-product_cat .woocommerce-products-header__title,
body.tax-product_cat .page-title,
body.tax-product_cat h1.page-title {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: #1f2937 !important;
}
@media (min-width: 768px) {
    body.woocommerce-page .woocommerce-products-header__title,
    body.woocommerce-page .page-title,
    body.tax-product_cat .woocommerce-products-header__title,
    body.tax-product_cat .page-title,
    body.tax-product_cat h1.page-title {
        font-size: 1.75rem !important;
    }
}
body.woocommerce-page ul.products li .woocommerce-loop-product__title,
body.woocommerce-page ul.products li h2.woocommerce-loop-product__title,
body.tax-product_cat ul.products li .woocommerce-loop-product__title,
body.tax-product_cat ul.products li h2.woocommerce-loop-product__title {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 1.125rem !important;
    font-weight: 600 !important;
    min-height: 2.6em;
    position: relative;
    z-index: 2;
}
body.woocommerce-page ul.products li .price,
body.tax-product_cat ul.products li .price {
    font-size: 1.75rem !important;
    font-weight: 400 !important;
    color: #15803d !important;
    margin-bottom: 0 !important;
}
@media (min-width: 768px) {
    body.woocommerce-page ul.products li .price,
    body.tax-product_cat ul.products li .price {
        font-size: 1.875rem !important;
    }
}
body.woocommerce-page ul.products li,
body.tax-product_cat ul.products li {
    width: 100% !important;
    max-width: 100% !important;
}

body.woocommerce-cart .entry-content h2{
    margin: 0 !important;
}
body.woocommerce-checkout .wc-block-components-sidebar-layout .wc-block-components-main {
    width: 35% !important;
  }
body.woocommerce-checkout .wc-block-components-sidebar {
    width: 65% !important;
}

@media (max-width: 768px) {
    body.woocommerce-checkout .wc-block-components-sidebar-layout .wc-block-components-main {
        width: 100% !important;
    }
    body.woocommerce-checkout .wc-block-components-sidebar {
        width: 100% !important;
    }
    body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block.checkout-order-summary-block-fill-wrapper {
        display: none !important;
    }
}
/** style for contact page */