@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
    --background-primary: #ffffff;
    --background-primary-rgb: 255, 255, 255;
    --main: #f6ddfe;
    --shadow-color-on-main: rgba(0, 0, 0, 0.2);
    --shadow-color-on-main-rgb: 0, 0, 0;
    --main-dark: #4e4e4e;
    --error: #ff3b30;
    --error-red: #ff3b30;
    --warning: #ccaa20;
    --main-rgb: 93, 212, 99;
    --main-color-rgb: 0, 0, 0;
    --color-on-main: #ffffff;
    --background-secondary: #ededed;
    --background-secondary-1: #d2d2d2;
    --background-secondary-rgb: 237, 237, 237;
    --background-tertiary: #545458;
    --background-tertiary-rgb: 44, 44, 46;
    --color-on-main-rgb: 0, 0, 0;
    --appbar-tabs-container-background-color: black;
    --appbar-tabs-container-background-color-rgb: 0, 0, 0;
    --app-bar-button-light-background-color-rgb: 255, 255, 255;
    --app-bar-button-text-color: #fff;
    --app-bar-height: 70px;
    --appbar-margin-block: 10px;
    --text-primary: #000;
    --text-primary-rgb: 0, 0, 0;
    --text-secondary: #909090;
    --text-primary-2: #4e4e4e;
    --text-seconday-on-opposite-background: #fff;
    --border-color: #353535;
    --unselected-star-color: #8d8d8d;
    --border-color-1: #bbbbbb;
    --border-color-1-rgb: 187, 187, 187;
    --border-color-light: #e0e0e0;
    --green-light: #00b14f;
    --green: #08ac0a;
    --green-light-rgb: 0, 177, 79;
    --green-rgb: 8, 172, 10;
    --green-dark: #3e6b40;
    --green-dark-rgb: 62, 107, 64;
    --rating-star-color: #ffc107;
    --rating-star-color-rgb: 255, 193, 7;
    --color-on-rating-star-color: black;
    --average-feedback-background-color: #7c7c7c;
    --average-feedback-background-color-rgb: 162, 122, 0;
    --color-on-rating-star: #423100;
    --text-gradient-color-blue-1-rgb: 45, 130, 234;
    --text-gradient-color-pink-1-rgb: 116, 57, 194;
    --color-background-light-rgb: 227, 227, 227;
    --mobile-menu-item-text-color: #353535;
    --mobile-menu-background-color: #f2f2f2;
    --drawer-background-color: #eeeeee;
    --button-disabled-background-color: #8d8d8d;
    --high-alert-action-button-background-color: #fb641b;
    --high-alert-action-button-background-color-rbg: 251, 100, 27;
    --theme-mode: light;
    --background-secondary-color-2: #f4f2ec;
}

.font-Messiri {
    font-family: "El Messiri", sans-serif !important;
}

* {
    outline: none !important;
}

.desktop-view {
    display: block;
}

.mobile-view {
    display: none;
}

.no-scrollbar::-webkit-scrollbar {
    display: none;
}

@media (max-width: 1300px) {
    .desktop-view {
        display: none;
    }

    .mobile-view {
        display: block;
    }
}



body {
    overflow-x: hidden;
}

.disable-scroll-bar::-webkit-scrollbar {
    display: none;
}

.logo-light {
    display: flex;
}

.logo-dark {
    display: none;
}

.thin-scroller::-webkit-scrollbar {
    width: 2px;
    height: 2px;
    background-color: var(--background-secondary);
}

.thin-scroller::-webkit-scrollbar-thumb {
    background-color: var(--text-secondary);
    border-radius: 0px;
}

.container-large {
    max-width: 1400px;
    padding-inline: 20px;
    width: 100%;
    margin: 0 auto;
}

.homepage-container-large {
    max-width: 1600px;
    padding-inline: 20px;
    width: 100%;
    margin: 0 auto;
}

input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type='number'] {
    -moz-appearance: textfield;
    /* Firefox */
}

@media (max-width: 768px) {
    .homepage-container-large {
        padding-inline: 0px;
    }
}

.f-playfair-display {
    font-family: "Playfair Display", serif;
    font-optical-sizing: auto;
    font-style: normal;
}

.f-montserrat {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}

.f-cormorant-garamond {
    font-family: "Cormorant Garamond", serif;
    font-optical-sizing: auto;
    font-style: normal;
}

.underlineOnHover{
    text-decoration: none !important;
}

.underlineOnHover:hover {
    text-decoration: underline !important;
}