/*
 * Landing page (rezit.hu) palette. tailwind.config.js maps gray, blue, indigo and white to these
 * variables, so every utility class follows <html data-theme>: light is mist/sage/moss, dark is navy/amber.
 * --p/--b1/... re-theme DaisyUI's built-in light and dark themes to the same palette.
 */
:root, [data-theme="light"] {
  --white: 255 254 251;
  --gray-50: 247 245 242; --gray-100: 239 236 230; --gray-200: 226 222 214; --gray-300: 203 200 190; --gray-400: 150 146 136; --gray-500: 104 100 92; --gray-600: 88 84 77; --gray-700: 74 86 73; --gray-800: 53 70 54; --gray-900: 44 62 45; --gray-950: 31 45 32;
  --accent-50: 241 246 241; --accent-100: 226 236 227; --accent-200: 198 218 200; --accent-300: 163 194 166; --accent-400: 122 158 126; --accent-500: 107 143 111; --accent-600: 92 127 96; --accent-700: 74 106 78; --accent-800: 58 84 61; --accent-900: 44 62 45; --accent-950: 31 45 32;
  /* Rose: the landing page blush as a warm second accent (headers, highlights, empty states). */
  --rose-50: 251 244 242; --rose-100: 245 230 225; --rose-200: 236 221 216; --rose-300: 223 192 183; --rose-400: 201 150 138; --rose-500: 181 125 112; --rose-600: 154 107 98; --rose-700: 127 85 77; --rose-800: 101 67 61; --rose-900: 74 49 45;
  /* Extra warm accents (approved palette): 100 = tint, 500 = mid, 700 = text on the tint. */
  --terracotta-50: 251 242 236; --terracotta-100: 246 228 218; --terracotta-200: 237 203 184; --terracotta-500: 194 119 90; --terracotta-700: 138 75 51;
  --honey-50: 252 247 234; --honey-100: 247 237 211; --honey-200: 238 219 166; --honey-500: 201 160 79; --honey-700: 125 95 34;
  --mauve-50: 247 244 249; --mauve-100: 237 231 241; --mauve-200: 220 210 228; --mauve-500: 154 134 168; --mauve-700: 95 76 110;
  --eucalyptus-50: 241 247 246; --eucalyptus-100: 225 238 236; --eucalyptus-200: 195 220 216; --eucalyptus-500: 110 154 154; --eucalyptus-700: 63 103 103;
  --denim-50: 243 246 249; --denim-100: 228 234 241; --denim-200: 201 213 227; --denim-500: 124 147 174; --denim-700: 74 95 120;
  --p: 127 16% 43%; --pf: 127 18% 35%; --pc: 45 100% 99%;
  --s: 11 32% 57%; --sf: 10 22% 49%; --sc: 45 100% 99%;
  --b1: 45 100% 99%; --b2: 36 24% 96%; --b3: 40 17% 86%; --bc: 123 17% 21%;
}

:root[data-theme="dark"] {
  --white: 242 246 252;
  --gray-50: 242 246 252; --gray-100: 227 234 244; --gray-200: 203 214 230; --gray-300: 184 198 219; --gray-400: 168 184 208; --gray-500: 127 147 178; --gray-600: 74 96 130; --gray-700: 58 78 110; --gray-800: 43 63 92; --gray-900: 26 39 64; --gray-950: 18 28 46;
  --accent-50: 254 246 231; --accent-100: 253 235 200; --accent-200: 250 213 147; --accent-300: 248 205 122; --accent-400: 245 188 92; --accent-500: 240 160 53; --accent-600: 212 137 28; --accent-700: 176 111 18; --accent-800: 138 86 15; --accent-900: 94 59 12; --accent-950: 61 42 20;
  --rose-50: 58 42 51; --rose-100: 74 50 62; --rose-200: 96 64 78; --rose-300: 140 92 104; --rose-400: 196 128 138; --rose-500: 222 150 158; --rose-600: 236 170 176; --rose-700: 244 194 198; --rose-800: 249 216 219; --rose-900: 252 234 236;
  --terracotta-50: 60 40 36; --terracotta-100: 78 50 42; --terracotta-200: 110 68 54; --terracotta-500: 214 140 110; --terracotta-700: 240 196 176;
  --honey-50: 58 48 28; --honey-100: 76 62 32; --honey-200: 108 88 44; --honey-500: 222 184 104; --honey-700: 245 222 170;
  --mauve-50: 48 42 60; --mauve-100: 62 54 78; --mauve-200: 88 76 108; --mauve-500: 184 166 200; --mauve-700: 228 218 238;
  --eucalyptus-50: 30 52 54; --eucalyptus-100: 38 66 68; --eucalyptus-200: 54 92 94; --eucalyptus-500: 130 180 178; --eucalyptus-700: 200 232 228;
  --denim-50: 36 46 64; --denim-100: 46 60 84; --denim-200: 66 84 114; --denim-500: 150 172 200; --denim-700: 214 226 240;
  --p: 34 86% 57%; --pf: 36 77% 47%; --pc: 219 44% 13%;
  --s: 353 52% 73%; --sf: 351 37% 64%; --sc: 219 44% 13%;
  --b1: 216 36% 26%; --b2: 219 42% 18%; --b3: 217 31% 33%; --bc: 216 63% 97%;
}

/* Amber buttons take navy text in dark mode, like the landing page's primary buttons. */
[data-theme="dark"] .text-white:is([class*="bg-blue-"], [class*="bg-indigo-"]) {
  color: #121C2E;
}

.bg-stripes {
  background-image: linear-gradient(45deg, var(--stripes-color) 12.50%, transparent 12.50%, transparent 50%, var(--stripes-color) 50%, var(--stripes-color) 62.50%, transparent 62.50%, transparent 100%);
  background-size: 5.66px 5.66px;
}

.bg-stripes-white {
  --stripes-color: #fff;
}
/*
 * Light-mode fallback for form fields: a field without its own light bg-* utility
 * (most only declare dark:bg-*) would be white on the cream cards and modals.
 * Covers DaisyUI .input/.select/.textarea too, which default to the cream base color.
 */
:root:not([data-theme="dark"]) input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="file"], [type="hidden"], [type="submit"], [type="button"], [type="reset"], [type="image"], [class^="bg-"], [class*=" bg-"]),
:root:not([data-theme="dark"]) select:not([class^="bg-"], [class*=" bg-"]),
:root:not([data-theme="dark"]) textarea:not([class^="bg-"], [class*=" bg-"]) {
  background-color: rgb(var(--gray-50));
}

/*
 * Dark-mode fallback for form fields: any field without its own dark:bg-*
 * utility would stay light on a dark page.
 * Fields that already declare dark:bg-* keep their explicit styling.
 */
[data-theme="dark"] input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="file"], [type="hidden"], [type="submit"], [type="button"], [type="reset"], [type="image"], [class*="dark:bg"]),
[data-theme="dark"] select:not([class*="dark:bg"]),
[data-theme="dark"] textarea:not([class*="dark:bg"]) {
  color-scheme: dark;
  background-color: rgb(var(--gray-700));
  border-color: rgb(var(--gray-600));
  color: rgb(var(--white));
}

[data-theme="dark"] input:not([class*="dark:placeholder"])::placeholder,
[data-theme="dark"] textarea:not([class*="dark:placeholder"])::placeholder {
  color: rgb(var(--gray-400));
}

/*
 * Mobile browsers (notably iOS Safari) give date/time inputs a large intrinsic
 * min-width, which pushes them out of narrow grid/flex containers.
 */
input[type="date"],
input[type="time"],
input[type="datetime-local"] {
  min-width: 0;
}

input[type="date"]::-webkit-date-and-time-value,
input[type="time"]::-webkit-date-and-time-value,
input[type="datetime-local"]::-webkit-date-and-time-value {
  text-align: left;
}

/*
 * Driver.js clips the highlighted element's parent (overflow:hidden). A highlighted
 * dropdown menu sits outside its .dropdown box, so it would be clipped away entirely.
 */
.dropdown:has(> .driver-active-element) {
  overflow: visible !important;
}

/* DaisyUI 3 uppercases .btn; keep sentence case like the rest of the app's buttons. */
.btn {
  text-transform: none;
}

/*
 * Page titles (every main-area <h1 class="text-2xl font-bold ...">) take the brand serif of the logo.
 */
main h1.text-2xl.font-bold {
  font-family: Fraunces, Georgia, serif;
  letter-spacing: -0.01em;
}

/*
 * Page icon chip: a tinted square with the area's icon, set before a page title so each area
 * has its own color. Usage: <span class="page-chip" data-icon="services" aria-hidden="true"></span>
 * The icon is a CSS mask, so it needs no SVG markup in the templates.
 */
.page-chip {
  display: inline-flex;
  flex-shrink: 0;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.75rem;
  vertical-align: middle;
  position: relative;
  background: var(--chip-bg);
}
.page-chip::after {
  content: "";
  position: absolute;
  inset: 0.5rem;
  background: var(--chip-fg);
  -webkit-mask: var(--chip-icon) center / contain no-repeat;
  mask: var(--chip-icon) center / contain no-repeat;
}
.page-chip[data-icon="calendar"] { --chip-bg: rgb(var(--eucalyptus-100)); --chip-fg: rgb(var(--eucalyptus-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2v4M16 2v4M3 10h18M5 4h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E"); }
.page-chip[data-icon="services"] { --chip-bg: rgb(var(--rose-100)); --chip-fg: rgb(var(--rose-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3a3 3 0 1 0 0 6 3 3 0 0 0 0-6zM6 15a3 3 0 1 0 0 6 3 3 0 0 0 0-6zM20 4 8.12 15.88M14.47 14.48 20 20M8.12 8.12 12 12'/%3E%3C/svg%3E"); }
.page-chip[data-icon="clock"] { --chip-bg: rgb(var(--accent-100)); --chip-fg: rgb(var(--accent-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 6v6l4 2M22 12a10 10 0 1 1-20 0 10 10 0 0 1 20 0z'/%3E%3C/svg%3E"); }
.page-chip[data-icon="coffee"] { --chip-bg: rgb(var(--honey-100)); --chip-fg: rgb(var(--honey-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 8h1a4 4 0 1 1 0 8h-1M3 8h14v9a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4zM6 2v2M10 2v2M14 2v2'/%3E%3C/svg%3E"); }
.page-chip[data-icon="users"] { --chip-bg: rgb(var(--denim-100)); --chip-fg: rgb(var(--denim-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2M9 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E"); }
.page-chip[data-icon="ban"] { --chip-bg: rgb(var(--terracotta-100)); --chip-fg: rgb(var(--terracotta-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM4.93 4.93l14.14 14.14'/%3E%3C/svg%3E"); }
.page-chip[data-icon="store"] { --chip-bg: rgb(var(--denim-100)); --chip-fg: rgb(var(--denim-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l1.5-5h15L21 9M3 9v11h18V9M3 9h18M9 20v-6h6v6'/%3E%3C/svg%3E"); }
.page-chip[data-icon="check"] { --chip-bg: rgb(var(--accent-100)); --chip-fg: rgb(var(--accent-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14M22 4 12 14.01l-3-3'/%3E%3C/svg%3E"); }
.page-chip[data-icon="qr"] { --chip-bg: rgb(var(--mauve-100)); --chip-fg: rgb(var(--mauve-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3h7v7H3zM14 3h7v7h-7zM3 14h7v7H3zM14 14h3v3h-3zM20 14v.01M14 20h.01M17 20h4v-3'/%3E%3C/svg%3E"); }
.page-chip[data-icon="hourglass"] { --chip-bg: rgb(var(--honey-100)); --chip-fg: rgb(var(--honey-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2h12M6 22h12M7 2v4a5 5 0 0 0 10 0V2M7 22v-4a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E"); }
.page-chip[data-icon="card"] { --chip-bg: rgb(var(--eucalyptus-100)); --chip-fg: rgb(var(--eucalyptus-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 7a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2zM2 10h20M6 15h4'/%3E%3C/svg%3E"); }
.page-chip[data-icon="receipt"] { --chip-bg: rgb(var(--denim-100)); --chip-fg: rgb(var(--denim-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 2v20l3-2 3 2 2-2 2 2 3-2 3 2V2l-3 2-3-2-2 2-2-2-3 2zM8 8h8M8 12h8M8 16h5'/%3E%3C/svg%3E"); }
.page-chip[data-icon="star"] { --chip-bg: rgb(var(--mauve-100)); --chip-fg: rgb(var(--mauve-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01z'/%3E%3C/svg%3E"); }
.page-chip[data-icon="sparkles"] { --chip-bg: rgb(var(--rose-100)); --chip-fg: rgb(var(--rose-700)); --chip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.9 5.1L19 10l-5.1 1.9L12 17l-1.9-5.1L5 10l5.1-1.9zM19 15l.9 2.1L22 18l-2.1.9L19 21l-.9-2.1L16 18l2.1-.9z'/%3E%3C/svg%3E"); }
/* Dark mode: the palette variables above switch to dark tints, so the chips need no override. */