/* 
   ========================================
   BUTTONS COMPONENT
   Single Source of Truth for all Button Styles
   ======================================== 
*/

.button {
    display: inline-block;
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    text-align: center;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all var(--transition-base);
    border-radius: var(--radius-sm);
    user-select: none;
    line-height: 1.2;
}

/* Global Button Styles (Replacing MU-Plugin) */
.wp-block-button__link,
.wp-element-button,
button, 
input[type='submit'],
input[type='button'],
.button,
.btn,
a.button {
    background-color: #e60000 !important;
    color: #ffffff !important;
    border: 2px solid #e60000 !important;
    transition: all 0.3s ease !important;
    
    /* Larger Size & Text */
    padding: 15px 40px !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    display: inline-block !important;
    cursor: pointer !important;
    line-height: 1.2 !important;
}

/* Hover State: White Background, Red Text, Lift Effect */
.wp-block-button__link:hover,
.wp-element-button:hover,
button:hover, 
input[type='submit']:hover,
input[type='button']:hover,
.button:hover,
.btn:hover,
a.button:hover {
    background-color: #ffffff !important;
    color: #e60000 !important;
    border-color: #ffffff !important;
    
    /* Lift Up Effect */
    transform: translateY(-5px) !important;
    box-shadow: 0 10px 20px rgba(0,0,0,0.2) !important;
}

/* Variants */
.button--primary {
    /* Styles are handled by the global override above, but keeping class for semantic use */
}

.button--ghost {
    background-color: transparent !important;
    color: var(--color-text-primary) !important;
    border: 2px solid var(--color-black) !important;
}

.button--ghost:hover {
    background-color: var(--color-brand-red) !important;
    border-color: var(--color-brand-red) !important;
    color: var(--color-text-inverse) !important;
}

/* Black Button Variant (Like Header CTA) */
.button--black {
    background-color: #353535 !important;
    color: #ffffff !important;
    border: 2px solid #353535 !important;
}

.button--black:hover {
    background-color: #e60000 !important;
    color: #ffffff !important;
    border-color: #e60000 !important;
    
    /* Slight lift and shadow */
    transform: translateY(-5px) !important;
    box-shadow: 0 10px 20px rgba(230, 0, 0, 0.3) !important;
}

/* Sizes */
.button--small {
    padding: var(--spacing-xs) var(--spacing-md) !important;
    font-size: var(--font-size-sm) !important;
}

.button--medium {
    padding: var(--spacing-sm) var(--spacing-lg) !important;
    font-size: var(--font-size-base) !important;
}

.button--large {
    padding: var(--spacing-md) var(--spacing-xl) !important;
    font-size: var(--font-size-lg) !important;
}

/* Disabled State */
.button:disabled,
button:disabled,
input[type='submit']:disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
    transform: none !important;
    box-shadow: none !important;
}

/* NAVIGATION SPECIFIC BUTTON OVERRIDES (Book Online) */
.navigation__cta .button,
.navigation__mobile-menu .button {
    background-color: #353535 !important;
    color: #ffffff !important;
    border: 1px solid #3b3b3b !important; /* 0.8px rgb(59,59,59) */
    
    /* Match reference dimensions */
    padding: 16px 32px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: 3px !important;
    box-shadow: 0 1px 1px rgba(0,0,0,0.02) !important;
}

.navigation__cta .button:hover,
.navigation__mobile-menu .button:hover {
    background-color: #e60000 !important;
    color: #ffffff !important;
    border-color: #e60000 !important;
    
    /* Size increase and slight lift */
    transform: scale(1.1) translateY(-2px) !important; 
    box-shadow: 0 10px 20px rgba(230, 0, 0, 0.3) !important;
}

/* Homepage Hero CTA Button */
/* Target the link inside the block wrapper to avoid double layers */
.hero-cta-btn .wp-block-button__link {
    background-color: rgb(230, 0, 0) !important;
    color: rgb(255, 255, 255) !important;
    padding: 15px 40px !important;
    border-radius: 6px !important;
    font-weight: 700 !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 22px !important;
    border: none !important;
}

.hero-cta-btn .wp-block-button__link:hover {
    background-color: rgb(255, 255, 255) !important;
    color: rgb(230, 0, 0) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 20px rgba(0,0,0,0.2) !important;
}

/* Exclude Mobile Toggle */
.navigation__mobile-toggle,
.navigation__mobile-dropdown-toggle {
    background: transparent !important;
    border: none !important;
    padding: 5px !important;
    box-shadow: none !important;
    transform: none !important;
    color: inherit !important;
    width: auto !important;
}