@import 'tailwindcss';

/*  */
@import './rate.css';
@import './icons.css';
/*  */

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.js';

@config "../../tailwind.config.js";

:root {
}
/* then your overrides: */
@layer base {
  /* global default border-color */
  * {
    border-color: hsl(var(--border));
  }

   input[type="search"]::-webkit-search-cancel-button {
    @apply hidden;
  }
}

@layer components {
    .icon-btn {
        @apply flex cursor-pointer items-center justify-center rounded-lg border text-text/80 transition-all duration-200 hover:bg-background;
    }

    .btn-primary {
        @apply rounded-lg bg-primary-btn/90 text-center text-white duration-200 hover:bg-primary-btn disabled:bg-primary/40 disabled:text-text/60 disabled:hover:bg-primary/45 dark:bg-primary-btn dark:hover:bg-primary-btn/80;
    }

    .btn-warning {
        @apply rounded-lg bg-warning/80 text-center text-white duration-300 hover:bg-warning disabled:bg-warning/40 disabled:text-text/60 disabled:hover:bg-warning/45;
    }

    .btn-secondary {
        @apply bg-secondary duration-200 hover:bg-secondary/80 disabled:bg-secondary/50 disabled:hover:bg-secondary/60;
    }

    .mega-menu-link {
        @apply block px-4 py-3;
    }

    .mega-menu-link-active {
        @apply bg-muted text-primary duration-200;
    }

    .main-banner-nav-button {
        @apply !bottom-[10%] !top-[unset] !h-9 !w-9 !rounded-full border !border-border !bg-muted !opacity-0 group-hover:!opacity-100 duration-150;
    }

    .main-banner-nav-button::after {
        @apply !text-sm !font-bold !text-primary;
    }

    .main-slider-nav-button {
        @apply !h-9 !w-9 !rounded-xl border !border-border !bg-background duration-200;
    }

    .main-slider-nav-button::after {
        @apply !text-sm !font-bold !text-text hover:!text-primary;
    }
}