/* Cookbook theme for Mealie: cream paper, warm browns, dusty rose, hand-drawn kitchen doodles.
   Injected by the mealie-theme proxy; only styles light mode so dark mode keeps Mealie's defaults. */
@import url("https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600;700&family=Lora:ital,wght@0,400;0,500;0,600;1,400&family=Playfair+Display:wght@500;600;700&display=swap");

:root {
  --cb-cream: #f8efe2;
  --cb-paper: #fffaf2;
  --cb-paper-2: #f3e5d2;
  --cb-line: #e7d4bd;
  --cb-brown: #5b3a29;
  --cb-brown-2: #8b5e3c;
  --cb-rose: #b5736a;
  --cb-blush: #e9c4bd;
  --cb-shadow: 0 6px 18px rgba(91, 58, 41, 0.12), 0 1px 3px rgba(91, 58, 41, 0.10);
  /* Doodle tile: whisk, heart, strawberry, sprig, spoon, little dots */
  --cb-doodles: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' viewBox='0 0 260 260'%3E%3Cg fill='none' stroke='%23c9a98a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' opacity='0.45'%3E%3Cpath d='M30 70 L58 34'/%3E%3Cpath d='M58 34 C 70 14, 92 18, 84 36 C 78 50, 62 46, 58 34 Z'/%3E%3Cpath d='M58 34 C 74 22, 88 30, 76 42'/%3E%3Cpath d='M58 34 C 64 18, 84 16, 80 30'/%3E%3Cpath d='M160 52 C 160 40, 176 36, 180 48 C 184 36, 200 40, 200 52 C 200 66, 180 76, 180 80 C 180 76, 160 66, 160 52 Z'/%3E%3Cpath d='M70 160 C 52 150, 52 128, 72 124 C 92 120, 104 140, 92 156 C 86 164, 78 166, 70 160 Z'/%3E%3Cpath d='M74 124 C 70 116, 76 110, 82 114 M 82 114 C 88 110, 94 116, 88 122'/%3E%3Ccircle cx='70' cy='138' r='0.8'/%3E%3Ccircle cx='80' cy='146' r='0.8'/%3E%3Ccircle cx='74' cy='152' r='0.8'/%3E%3Cpath d='M190 210 C 196 186, 210 170, 226 162'/%3E%3Cpath d='M198 192 C 188 188, 186 178, 194 176 C 202 178, 202 188, 198 192 Z'/%3E%3Cpath d='M208 178 C 214 170, 224 172, 222 180 C 218 186, 210 184, 208 178 Z'/%3E%3Cpath d='M214 168 C 210 160, 216 154, 222 158'/%3E%3Cpath d='M150 140 L 116 214'/%3E%3Cellipse cx='156' cy='128' rx='9' ry='15' transform='rotate(25 156 128)'/%3E%3C/g%3E%3Cg fill='%23d9a7a0' opacity='0.35'%3E%3Ccircle cx='120' cy='30' r='2'/%3E%3Ccircle cx='238' cy='110' r='2'/%3E%3Ccircle cx='30' cy='230' r='2'/%3E%3Ccircle cx='132' cy='246' r='1.6'/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- Page: cream paper with doodles ---------- */
body,
.v-application.v-theme--light {
  background-color: var(--cb-cream) !important;
  background-image: var(--cb-doodles), radial-gradient(circle at 20% 10%, #fffaf3 0%, transparent 55%),
    radial-gradient(circle at 85% 90%, #f4e3cf 0%, transparent 50%) !important;
  background-attachment: fixed !important;
}
.v-theme--light .v-main,
.v-theme--light .v-main > div,
.v-theme--light .v-container {
  background: transparent !important;
}
.v-theme--light {
  font-family: "Lora", Georgia, serif !important;
}
.v-theme--light .v-list-item-title,
.v-theme--light .v-card-text,
.v-theme--light p {
  font-family: "Lora", Georgia, serif !important;
  color: var(--cb-brown);
}

/* ---------- Headings ---------- */
.v-theme--light h1, .v-theme--light h2, .v-theme--light h3,
.v-theme--light .v-card-title,
.v-theme--light .text-h4, .v-theme--light .text-h5, .v-theme--light .text-h6,
.v-theme--light .headline {
  font-family: "Playfair Display", Georgia, serif !important;
  color: var(--cb-brown) !important;
  letter-spacing: 0.01em;
}

/* ---------- Header bar: chocolate brown, script title ---------- */
.v-theme--light .v-app-bar.v-toolbar {
  background: linear-gradient(90deg, #5b3a29, #7a4d36 60%, #8b5e3c) !important;
  color: #fff4e6 !important;
  box-shadow: 0 2px 10px rgba(91, 58, 41, 0.35) !important;
}
.v-theme--light .v-toolbar-title,
.v-theme--light .v-toolbar-title__placeholder {
  font-family: "Dancing Script", cursive !important;
  font-size: 1.9rem !important;
  font-weight: 700 !important;
  color: #fff4e6 !important;
}
.v-theme--light .v-app-bar .v-icon,
.v-theme--light .v-app-bar .v-btn,
.v-theme--light .v-app-bar .v-btn__content,
.v-theme--light .v-app-bar svg,
.v-theme--light .v-app-bar .v-field input::placeholder {
  color: #fff4e6 !important;
  fill: #fff4e6 !important;
  opacity: 1 !important;
}
.v-theme--light .v-app-bar .v-field {
  background: rgba(255, 244, 230, 0.16) !important;
  color: #fff4e6 !important;
}

/* ---------- Side menu: cookbook tab divider with a stitched edge ---------- */
.v-theme--light .v-navigation-drawer {
  background: linear-gradient(180deg, var(--cb-paper-2), #efdcc6) !important;
  border-right: 2px dashed rgba(139, 94, 60, 0.35) !important;
}
.v-theme--light .v-navigation-drawer .v-list {
  background: transparent !important;
}
.v-theme--light .v-navigation-drawer .v-list-item {
  border-radius: 10px !important;
  margin: 2px 8px !important;
}
.v-theme--light .v-navigation-drawer .v-list-item--active {
  background: var(--cb-blush) !important;
  color: var(--cb-brown) !important;
}
.v-theme--light .v-navigation-drawer .v-list-item-title {
  font-size: 0.95rem !important;
}

/* ---------- Cards: cream paper with soft brown shadows ---------- */
.v-theme--light .v-card:not([class*="bg-"]) {
  background: var(--cb-paper) !important;
  border: 1px solid var(--cb-line) !important;
  border-radius: 14px !important;
  box-shadow: var(--cb-shadow) !important;
}
.v-theme--light .v-card--link {
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.v-theme--light .v-card--link:hover {
  transform: translateY(-3px) rotate(-0.3deg);
  box-shadow: 0 12px 26px rgba(91, 58, 41, 0.18) !important;
}
.v-theme--light .v-card--link .v-img,
.v-theme--light .v-card--link .v-responsive {
  border-radius: 13px 13px 0 0;
}
.v-theme--light .v-card--link .v-card-title {
  font-size: 1.15rem !important;
}

/* ---------- Instruction steps: vintage index recipe cards ---------- */
.v-theme--light .v-card:has(.recipe-step-title):not(:has(.v-card .recipe-step-title)) {
  background-color: #fffdf8 !important;
  background-image:
    linear-gradient(90deg, transparent 38px, rgba(205, 92, 92, 0.45) 38px, rgba(205, 92, 92, 0.45) 40px, transparent 40px),
    repeating-linear-gradient(180deg, transparent 0 29px, rgba(120, 160, 200, 0.28) 29px 30px) !important;
  background-position: 0 0, 0 12px !important;
  padding-left: 30px !important;
  border-radius: 6px !important;
}
.v-theme--light .recipe-step-title {
  font-family: "Dancing Script", cursive !important;
  font-size: 1.6rem !important;
  color: var(--cb-rose) !important;
}

/* ---------- Buttons, chips, inputs ---------- */
.v-theme--light .v-btn.bg-accent, .v-theme--light .v-btn.bg-primary, .v-theme--light .v-btn.bg-secondary,
.v-theme--light .v-btn.bg-accent .v-btn__content, .v-theme--light .v-btn.bg-primary .v-btn__content,
.v-theme--light .v-btn.bg-accent .v-icon, .v-theme--light .v-btn.bg-primary .v-icon {
  color: #fff8ef !important;
}
.v-theme--light .v-chip.bg-accent, .v-theme--light .v-chip.bg-primary, .v-theme--light .v-chip.bg-secondary {
  background: var(--cb-blush) !important;
  color: var(--cb-brown) !important;
  font-weight: 600;
}
.v-theme--light .v-btn {
  border-radius: 999px !important;
  letter-spacing: 0.02em;
  text-transform: none !important;
  font-family: "Lora", Georgia, serif !important;
}
.v-theme--light .v-btn.v-btn--icon {
  border-radius: 50% !important;
}
.v-theme--light .v-chip {
  border-radius: 999px !important;
  font-family: "Lora", Georgia, serif !important;
}
.v-theme--light .v-field {
  background: rgba(255, 250, 242, 0.92) !important;
  border-radius: 12px !important;
}
.v-theme--light .v-divider {
  border-color: var(--cb-line) !important;
  opacity: 1 !important;
}
.v-theme--light .v-checkbox .v-selection-control__input > .v-icon {
  color: var(--cb-rose) !important;
}

/* ---------- Ratings and recipe chips ---------- */
.v-theme--light .v-rating .v-icon,
.v-theme--light .v-rating .v-btn,
.v-theme--light .v-rating .v-btn__content {
  color: #c9963f !important;
  opacity: 1 !important;
}
.v-theme--light .v-chip,
.v-theme--light .v-chip .v-chip__content,
.v-theme--light .v-chip .v-icon {
  color: var(--cb-brown) !important;
}
.v-theme--light .v-chip:not([class*="bg-"]) {
  background: rgba(233, 196, 189, 0.55) !important;
}

/* ---------- Side menu: hide features we do not use ---------- */
.v-navigation-drawer a[href*="mealplan"],
.v-navigation-drawer a[href*="shopping-lists"] {
  display: none !important;
}
