@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,100..900;1,100..900&display=swap');
:root {
  --font-family: "Inter Tight",sans-serif;
  --brand-logo: url("https://thumbs.paysite.com/assets/logo_1779900811675.png");
  --color-base-100: #6f1b1b;
  --color-base-200: #fdf2e7;
  --color-base-300: #df9595;
  --color-base-content: #ef3434;
  --color-primary: #eb0017;
  --color-primary-content: #FFFFFF;
  --color-secondary: #f70808;
  --color-secondary-content: #ffffff;
  --radius-selector: 0.5rem;
  --radius-field: 0.5rem;
  --radius-box: 0.8rem;
  --size-selector: 4px;
  --size-field: 4px;
  --size-grid-item-margin: 10px;
  --border-border: 1px;
  --depth-depth: 1;
  --noise-noise: 0;
}


/* Layout: home */
:root {
}
@media (min-width: 375px) {
  :root {
    --items-model-per-row: 2;
    --items-reels-per-row: 1;
  }
}
@media (min-width: 768px) {
  :root {
    --items-model-per-row: 4;
    --items-reels-per-row: 4;
  }
}
@media (min-width: 1024px) {
  :root {
    --items-model-per-row: 4;
    --items-reels-per-row: 4;
  }
}
@media (min-width: 1440px) {
  :root {
    --items-model-per-row: 4;
    --items-reels-per-row: 4;
  }
}


/* Theme CSS Overrides */
/* [2026-05-27 16:59] change search bar color to white */

.search-bar {
  background-color: #ffffff;
  --color-base-content: #000000;
}

/* [2026-05-27 17:00] make the text input color in search to black */

.search-bar input {
  background-color: #ffffff;
  color: #000000;
}

.search-bar input::placeholder {
  color: rgba(0, 0, 0, 0.5);
}