/* public/css/user/input.css */

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

/* * Now, copy and paste ALL your custom styles 
 * (from the old 'style.css' we made) below!
 */

/* 1. Set the default font (optional, as Tailwind can do this) */
body {
    font-family: 'Inter', sans-serif;
}

/* 2. Custom Styles for Swiper Arrows */

/* Hero Carousel Arrows */
#hero-carousel .swiper-button-prev,
#hero-carousel .swiper-button-next {
    color: #ffffff;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 50%;
    width: 50px;
    height: 50px;
    transition: background-color 0.2s ease;
}
/* ... (and so on) ... */

/* (Paste all other custom styles from the previous style.css here) */
/*
 * ===============================================
 * CUSTOM FIX: Hide number input steppers
 * ===============================================
 * This fixes the layout bug in the filter sidebar
 * by removing the arrows that break Tailwind's w-full.
 */

/* Hide steppers for Chrome, Safari, Edge */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Hide steppers for Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}