/* MOW standard menu image sizing */
#vue-merchant-menu .item-image-preview > .el-image {
    width: 100% !important;
    height: 120px !important;
}

#vue-merchant-menu .item-image-preview .el-image__inner {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* MOW4U - Fixed menu thumbnail dimensions */
#vue-merchant-menu .borderx > .el-image {
    width: 120px !important;
    min-width: 120px !important;
    height: 120px !important;
}

#vue-merchant-menu .borderx > .el-image .el-image__inner {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* MOW4U - Rounded menu thumbnails */
#vue-merchant-menu .borderx > .el-image {
    border-radius: 6px !important;
    overflow: hidden;
}

/* MOW4U branded primary buttons */
.el-button.mow-primary,
.el-button.mow-primary:hover,
.el-button.mow-primary:focus {
    background-color: #FF5A1F !important;
    border-color: #FF5A1F !important;
    color: #FFFFFF !important;
}

.el-button.mow-primary.is-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* MOW4U - Homepage search button */
#main-search-banner button.btn-green {
    background-color: #FF5A1F !important;
    border-color: #FF5A1F !important;
    color: #FFFFFF !important;
    border-radius: 8px;
}

#main-search-banner button.btn-green:hover {
    background-color: #E84D14 !important;
    border-color: #E84D14 !important;
}

/* MOW4U - Orange Checkout and Place Order buttons */
.section-cart .btn-green:not(:disabled):not(.disabled) {
    background-color: #FF5A1F !important;
    border-color: #FF5A1F !important;
    color: #FFFFFF !important;
    border-radius: 8px;
}

.section-cart .btn-green:not(:disabled):not(.disabled):hover {
    background-color: #E84D14 !important;
    border-color: #E84D14 !important;
}

/* Preserve disabled state */
.section-cart .btn-green:disabled,
.section-cart .btn-green.disabled,
.section-cart .btn-green[disabled] {
    background-color: #B2B2B2 !important;
    border-color: #B2B2B2 !important;
    color: #FFFFFF !important;
    cursor: not-allowed;
}

/* MOW4U - Restaurant header promotion link */
.merchant-top-header a.text-green,
.merchant-top-header a.text-green:hover,
.merchant-top-header a.text-green:focus {
    color: #FF5A1F !important;
}

/* MOW4U - Orange category navigation */
.menu-category a:hover,
.siderbar-menu li.active a,
#menu-category .col a.active,
.menu-carousel a.active,
.menu-carousel a:hover {
    color: #FF5A1F !important;
}

/* MOW4U - Orange Back to Menu */
#vue-checkout-back a.back-arrow,
#vue-checkout-back a.back-arrow:hover,
#vue-checkout-back a.back-arrow:focus {
    color: #FF5A1F !important;
}

/* MOW4U - Restaurant category navigation */
.category-carousel .nav-link.active,
.category-owlcarousel .nav-link.active,
.category-carousel .nav-link:hover,
.category-owlcarousel .nav-link:hover {
    color: #FF5A1F !important;
}

/* Orange underline for selected category */
.category-carousel .nav-link.active:after,
.category-owlcarousel .nav-link.active:after {
    border-bottom-color: #FF5A1F !important;
}

/* MOW4U - Category hover effect */
.category-owlcarousel a.nav-link:hover,
.category-carousel a.nav-link:hover {
    color: #FF5A1F !important;
}

.category-owlcarousel a.nav-link,
.category-carousel a.nav-link {
    transition: color 0.2s ease;
}

/* MOW4U - Homepage cuisine hover */
.swiperCuisine .el-links:hover,
.swiperCuisine .el-links:hover .truncate,
.swiperCuisine .el-links:focus,
.swiperCuisine .el-links:focus .truncate {
    color: #FF5A1F !important;
}

.swiperCuisine .el-links .truncate {
    transition: color 0.2s ease;
}

/* MOW4U - Homepage Join buttons */
.el-button.mow-join-button {
    color: #FF5A1F !important;
    border-color: #FF5A1F !important;
    background-color: #FFF4EF !important;
}

.el-button.mow-join-button:hover,
.el-button.mow-join-button:focus {
    color: #FFFFFF !important;
    border-color: #FF5A1F !important;
    background-color: #FF5A1F !important;
    transition: all 0.2s ease;
}

/* MOW4U - Join carousel arrow hover */
.swiperRestox .swiper-button-next .el-button:hover,
.swiperRestox .swiper-button-prev .el-button:hover {
    background-color: #FF5A1F !important;
    border-color: #FF5A1F !important;
    color: #FFFFFF !important;
    transition: all 0.2s ease;
}

/* MOW4U - Homepage carousel arrow hover */
.swiperCuisine .swiper-button-next:not(.swiper-button-disabled):hover .el-button,
.swiperCuisine .swiper-button-prev:not(.swiper-button-disabled):hover .el-button,
.swiperResto .swiper-button-next:not(.swiper-button-disabled):hover .el-button,
.swiperResto .swiper-button-prev:not(.swiper-button-disabled):hover .el-button,
.swiperRestox .swiper-button-next:not(.swiper-button-disabled):hover .el-button,
.swiperRestox .swiper-button-prev:not(.swiper-button-disabled):hover .el-button {
    background-color: #FF5A1F !important;
    border-color: #FF5A1F !important;
    color: #FFFFFF !important;
}

/* Smooth transition */
.swiperCuisine .el-button.is-circle,
.swiperResto .el-button.is-circle,
.swiperRestox .el-button.is-circle {
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* MOW4U - Orange footer Subscribe button */
#vue-esubscription .el-button.mow-subscribe {
    background-color: #FF5A1F !important;
    border-color: #FF5A1F !important;
    color: #FFFFFF !important;
    border-radius: 8px;
    transition: background-color 0.2s ease;
}

#vue-esubscription .el-button.mow-subscribe:hover,
#vue-esubscription .el-button.mow-subscribe:focus {
    background-color: #D94710 !important;
    border-color: #D94710 !important;
}

/* ========================================
   MOW4U CUSTOMER WEBSITE BRAND COLOURS
   Primary: #FF5A1F
   ======================================== */

:root {
    --mow-primary: #FF5A1F;
    --mow-primary-hover: #D94710;
    --mow-navy: #14213D;
}

/* Primary action buttons */
body.controller-store .btn-green:not(:disabled):not(.disabled),
body.controller-account .btn-green:not(:disabled):not(.disabled) {
    background-color: var(--mow-primary) !important;
    border-color: var(--mow-primary) !important;
    color: #fff !important;
}

/* Primary button hover */
body.controller-store .btn-green:not(:disabled):not(.disabled):hover,
body.controller-account .btn-green:not(:disabled):not(.disabled):hover {
    background-color: var(--mow-primary-hover) !important;
    border-color: var(--mow-primary-hover) !important;
}

/* Green text links */
body.controller-store a.text-green,
body.controller-account a.text-green:not(.text-danger),
body.controller-store a:hover,
body.controller-account a:hover {
    color: var(--mow-primary) !important;
}

/* Breadcrumb hover */
.el-breadcrumb a:hover {
    color: var(--mow-primary) !important;
}

/* Outline buttons */
body.controller-store .btn-green-line {
    color: var(--mow-primary) !important;
    border-color: var(--mow-primary) !important;
}

body.controller-store .btn-green-line:hover {
    background-color: var(--mow-primary) !important;
    color: #fff !important;
}

/* Checkbox and radio selections */
body.controller-store .custom-control-input:checked ~ .custom-control-label::before,
body.controller-account .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--mow-primary) !important;
    border-color: var(--mow-primary) !important;
}

/* Preserve disabled buttons */
body .btn-green:disabled,
body .btn-green.disabled,
body .btn-green[disabled] {
    background-color: #B2B2B2 !important;
    border-color: #B2B2B2 !important;
    color: #fff !important;
}


/* MOW4U - Header navigation branding */
#top-navigation a:not(.btn):hover,
#top-navigation a:not(.btn):focus-visible {
    color: #FF5A1F !important;
}

/* Smooth colour transition */
#top-navigation a:not(.btn) {
    transition: color 0.2s ease;
}

/* MOW4U - Username dropdown hover */
#top-navigation .userprofile > a.dropdown-toggle:hover,
#top-navigation .userprofile > a.dropdown-toggle:focus,
#top-navigation .userprofile > a.dropdown-toggle.show {
    color: #FF5A1F !important;
}

/* MOW4U - Restaurant signup links */
body.controller-merchant.action-merchantSignup a,
body.controller-merchant.action-merchantSignup a:hover {
    color: #FF5A1F !important;
}

/* Restaurant signup: terms, privacy and login links */
form.mb-5 .m-0.mt-3 a.text-green,
form.mb-5 a.text-green[href*="backoffice/merchant"] {
    color: #FF5A1F !important;
}

form.mb-5 .m-0.mt-3 a.text-green:hover,
form.mb-5 a.text-green[href*="backoffice/merchant"]:hover {
    color: #D94710 !important;
}