/* ============================================
   İspanya Gezi — Özel Seyahat Planım Sayfası
   style.css
   ============================================ */
:root {
  --red: #e11d48; --red-dark: #be123c; --red-light: #fff1f2;
  --gold: #f59e0b; --gold-light: #fef3c7;
  --navy: #0f172a; --slate: #475569; --slate-light: #94a3b8;
  --bg: #f8fafc; --white: #ffffff; --border: #e2e8f0;
  --green: #16a34a; --green-light: #dcfce7;
  --blue: #2563eb; --blue-light: #dbeafe;
  --shadow-sm: 0 1px 4px rgba(0,0,0,0.07);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.10);
  --shadow-lg: 0 12px 36px rgba(0,0,0,0.13);
  --radius: 16px; --radius-sm: 10px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Segoe UI','Noto Sans',system-ui,sans-serif;background:var(--bg);color:var(--navy);min-height:100vh;line-height:1.6}

/* HERO */
.hero{background:linear-gradient(135deg,#1e1b4b 0%,#be123c 50%,#f59e0b 100%);color:#fff;padding:3rem 1.5rem 2.5rem;text-align:center;position:relative;overflow:hidden}
.hero::before{content:"🇪🇸";font-size:8rem;position:absolute;opacity:.07;top:-1rem;right:-1rem;transform:rotate(-15deg)}
.hero-back{position:absolute;top:1.2rem;left:1.5rem;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);color:#fff;padding:.45rem 1rem;border-radius:999px;font-size:.85rem;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:.4rem;transition:background .15s}
.hero-back:hover{background:rgba(255,255,255,.28)}
.hero-print{position:absolute;top:1.2rem;right:1.5rem;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);color:#fff;padding:.45rem 1rem;border-radius:999px;font-size:.85rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem;transition:background .15s;font-family:inherit}
.hero-print:hover{background:rgba(255,255,255,.28)}
.hero-badge{display:inline-block;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.35);padding:.3rem 1rem;border-radius:999px;font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:1rem}
.hero h1{font-size:clamp(1.6rem,5vw,2.6rem);font-weight:900;line-height:1.2;margin-bottom:.5rem;text-shadow:0 2px 8px rgba(0,0,0,.25)}
.hero-sub{font-size:.95rem;opacity:.88;margin-bottom:2rem}

/* COUNTDOWN */
.countdown-wrap{display:flex;justify-content:center;gap:.8rem;flex-wrap:wrap;margin-top:.5rem}
.countdown-box{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(8px);border-radius:var(--radius-sm);padding:.8rem 1.2rem;min-width:72px;text-align:center}
.countdown-num{font-size:2.2rem;font-weight:900;line-height:1;display:block}
.countdown-lbl{font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.8;margin-top:.2rem;display:block}
.countdown-arrived{font-size:1.4rem;font-weight:900;padding:1rem 2rem;background:rgba(255,255,255,.2);border-radius:var(--radius);display:inline-block}

/* BOARDING PASSES */
.boarding-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.2rem;margin:2rem 0}
.boarding-pass{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-md);overflow:hidden}
.bp-header{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;padding:1rem 1.2rem .8rem;display:flex;justify-content:space-between;align-items:center}
.bp-airline{font-weight:900;font-size:1.1rem;letter-spacing:.04em}
.bp-flight{font-size:.85rem;opacity:.9}
.bp-type{font-size:.7rem;background:rgba(255,255,255,.25);padding:.2rem .6rem;border-radius:999px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.bp-body{padding:1.2rem}
.bp-route{display:flex;align-items:center;gap:.8rem;margin-bottom:1rem}
.bp-city{text-align:center}
.bp-iata{font-size:1.8rem;font-weight:900;color:var(--navy);line-height:1}
.bp-city-name{font-size:.72rem;color:var(--slate);font-weight:600}
.bp-plane{flex:1;text-align:center;font-size:1.4rem;position:relative}
.bp-plane-line{position:absolute;top:50%;left:0;right:0;height:1px;background:var(--border);z-index:0}
.bp-plane span{position:relative;z-index:1}
.bp-details{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.bp-detail-label{font-size:.68rem;color:var(--slate-light);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.bp-detail-value{font-size:.95rem;font-weight:800;color:var(--navy)}
.bp-footer{background:var(--red-light);border-top:2px dashed var(--border);padding:.8rem 1.2rem;display:flex;justify-content:space-between;align-items:center}
.bp-pnr-label{font-size:.7rem;color:var(--slate);text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.bp-pnr{font-size:1.4rem;font-weight:900;color:var(--red);letter-spacing:.1em}
.bp-checkin{font-size:.75rem;color:var(--slate);text-align:right}
.bp-checkin strong{display:block;color:var(--navy);font-size:.88rem}

/* ROUTE BAR */
.route-bar{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1rem 1.5rem;margin:1.5rem 0;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:center}
.route-city{display:flex;flex-direction:column;align-items:center;gap:.1rem}
.route-city-flag{font-size:1.4rem}
.route-city-name{font-size:.73rem;font-weight:800;color:var(--navy)}
.route-city-nights{font-size:.62rem;color:var(--slate);font-weight:600}
.route-arrow{font-size:.9rem;color:var(--slate-light)}

/* MAIN */
.main-container{max-width:840px;margin:0 auto;padding:1.5rem 1rem 4rem}

/* SECTION TITLE */
.section-title{font-size:1.2rem;font-weight:900;color:var(--navy);margin:2rem 0 1rem;display:flex;align-items:center;gap:.5rem}
.section-title::after{content:"";flex:1;height:2px;background:linear-gradient(to right,var(--border),transparent);margin-left:.5rem}

/* ============================================================
   JANJANLI & RETRO SEYAHAT KONSOLU (IŞIL IŞIL RENKLİ MENÜ)
   ============================================================ */
.retro-nav-box {
  background: radial-gradient(circle at 10% 20%, #3b0764 0%, #1e0845 35%, #0d0426 70%, #030712 100%);
  border: 2.5px solid #ec4899;
  border-radius: 20px;
  padding: 1.2rem 1.2rem 1.4rem;
  margin-bottom: 1.8rem;
  box-shadow: 0 0 30px rgba(236, 72, 153, 0.45), 0 0 60px rgba(124, 58, 237, 0.3), inset 0 0 25px rgba(236, 72, 153, 0.18);
  position: relative;
  overflow: hidden;
}

/* Neon Arka Plan Parıltı Efekti */
.retro-nav-box::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(236, 72, 153, 0.08) 0%, transparent 60%);
  pointer-events: none;
  animation: retroRotate 20s linear infinite;
}
@keyframes retroRotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Üst Konsol Başlığı */
.retro-header-board {
  text-align: center;
  margin-bottom: 1.1rem;
  position: relative;
  z-index: 2;
}
.rhb-badge-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-bottom: 0.45rem;
}
.rhb-badge-neon {
  background: linear-gradient(135deg, #f43f5e, #ec4899);
  color: #ffffff;
  font-size: 0.7rem;
  font-weight: 900;
  padding: 0.2rem 0.75rem;
  border-radius: 999px;
  letter-spacing: 0.04em;
  box-shadow: 0 0 12px rgba(244, 63, 94, 0.6);
  text-transform: uppercase;
}
.rhb-live-blink {
  background: #0284c7;
  color: #e0f2fe;
  font-size: 0.68rem;
  font-weight: 800;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  animation: blinkLive 1.8s infinite ease-in-out;
}
@keyframes blinkLive {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
.rhb-neon-title {
  font-size: 1.35rem;
  font-weight: 900;
  color: #ffffff;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-shadow: 0 0 8px #f43f5e, 0 0 18px #ec4899, 0 0 30px #a855f7;
  margin-bottom: 0.35rem;
  font-family: inherit;
}
.rhb-neon-desc {
  font-size: 0.84rem;
  color: #cbd5e1;
  max-width: 650px;
  margin: 0 auto 0.65rem;
  line-height: 1.5;
}
.rhb-neon-desc strong {
  color: #fde047;
  text-shadow: 0 0 6px rgba(253, 224, 71, 0.6);
}
.rhb-arrows-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  font-weight: 900;
  color: #facc15;
}
.rhb-arrow-anim {
  font-size: 1.25rem;
  animation: arrowBounce 1.2s infinite ease-in-out;
}
.rhb-action-pill {
  background: rgba(250, 204, 21, 0.15);
  border: 1.5px dashed #facc15;
  color: #fef08a;
  padding: 0.25rem 0.9rem;
  border-radius: 999px;
  font-size: 0.74rem;
  letter-spacing: 0.05em;
  text-shadow: 0 0 8px rgba(250, 204, 21, 0.8);
}
@keyframes arrowBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(4px); }
}

/* TABS KAPSAYICI — 5 KOLONLU KUSURSUZ SİMETRİ (5 + 5 = 10 BUTON) */
.tabs {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.75rem;
  margin-bottom: 0.5rem;
  background: transparent;
  padding: 0;
  box-shadow: none;
  border: none;
  position: relative;
  z-index: 2;
}

/* GENEL RETRO TAB BUTON TABANI */
.tab-btn {
  padding: 0.8rem 0.65rem 0.85rem !important;
  border-radius: 16px !important;
  color: #ffffff !important;
  font-family: inherit !important;
  cursor: pointer !important;
  transition: all 0.2s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  text-align: center !important;
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.25rem !important;
  min-height: 95px !important;
  position: relative !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  user-select: none !important;
}
.tab-btn:hover {
  transform: translateY(-4px) scale(1.02) !important;
}
.tab-btn:active {
  transform: translateY(3px) !important;
  border-bottom-width: 2px !important;
}

/* BUTON İÇ METİN VE ETİKETLER */
.btn-micro-badge {
  font-size: 0.63rem;
  font-weight: 900;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 0.15rem;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  white-space: nowrap;
}
.btn-main-title {
  font-size: 0.88rem;
  font-weight: 900;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7), 0 0 8px rgba(255, 255, 255, 0.25);
  line-height: 1.25;
  white-space: nowrap;
}
.btn-sub-desc {
  font-size: 0.65rem;
  font-weight: 700;
  opacity: 0.95;
  line-height: 1.2;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  white-space: nowrap;
}

/* ============================================================
   10 FARKLI CANLI RENK & MİKRO ANİMASYON TEMALARI
   ============================================================ */

/* 1. GÜNLÜK PROGRAM (Yakut Kırmızısı) */
.tab-btn-program {
  background: linear-gradient(135deg, #9f1239 0%, #e11d48 50%, #f43f5e 100%) !important;
  border: 2px solid #fda4af !important;
  border-bottom: 5px solid #4c0519 !important;
  box-shadow: 0 0 16px rgba(225, 29, 72, 0.4), 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}
.tab-btn-program:hover {
  box-shadow: 0 0 26px rgba(225, 29, 72, 0.75), 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}
.tab-btn-program .btn-micro-badge { background: #ffe4e6; color: #9f1239; }
.tab-btn-program .btn-sub-desc { color: #fecdd3; }

/* 2. BİLETLER (Altın Kehribar) */
.tab-btn-tickets {
  background: linear-gradient(135deg, #b45309 0%, #d97706 50%, #f59e0b 100%) !important;
  border: 2px solid #fde68a !important;
  border-bottom: 5px solid #78350f !important;
  box-shadow: 0 0 16px rgba(245, 158, 11, 0.4), 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}
.tab-btn-tickets:hover {
  box-shadow: 0 0 26px rgba(245, 158, 11, 0.8), 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}
.tab-btn-tickets .btn-micro-badge { background: #fef3c7; color: #92400e; }
.tab-btn-tickets .btn-sub-desc { color: #fde68a; }

/* 3. SÜPER JANJANLI VIP: NEREDE KALMALI? */
.tab-btn-stay-vip {
  background: linear-gradient(135deg, #ff007f 0%, #8b5cf6 50%, #f59e0b 100%) !important;
  border: 2.5px solid #fef08a !important;
  border-bottom: 6px solid #b45309 !important;
  box-shadow: 0 0 28px rgba(245, 158, 11, 0.8), 0 0 45px rgba(255, 0, 127, 0.6) !important;
  animation: retroJanjanGlow 2s infinite ease-in-out !important;
}
.tab-btn-stay-vip:hover {
  transform: translateY(-5px) scale(1.05) !important;
  box-shadow: 0 0 45px rgba(245, 158, 11, 0.95), 0 0 70px rgba(255, 0, 127, 0.85) !important;
}
.tab-btn-stay-vip .janjan-badge-tag { background: #fde047; color: #0f172a; animation: tagJanjanBounce 1.5s infinite ease-in-out; }
.tab-btn-stay-vip .janjan-main-label { font-size: 0.95rem; text-shadow: 0 0 10px rgba(255, 255, 255, 0.9), 0 2px 4px rgba(0, 0, 0, 0.6); }
.tab-btn-stay-vip .janjan-sub-label { color: #fef08a; font-size: 0.68rem; font-weight: 800; }

/* 4. CANLI HAVA (Turkuaz Gökyüzü) */
.tab-btn-weather {
  background: linear-gradient(135deg, #0369a1 0%, #0284c7 50%, #06b6d4 100%) !important;
  border: 2px solid #7dd3fc !important;
  border-bottom: 5px solid #075985 !important;
  box-shadow: 0 0 16px rgba(6, 182, 212, 0.4), 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}
.tab-btn-weather:hover {
  box-shadow: 0 0 26px rgba(6, 182, 212, 0.8), 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}
.tab-btn-weather .btn-micro-badge { background: #e0f2fe; color: #0369a1; }
.tab-btn-weather .btn-sub-desc { color: #bae6fd; }

/* 5. GURME ALIŞVERİŞ (Zümrüt Yeşili) */
.tab-btn-shopping {
  background: linear-gradient(135deg, #047857 0%, #059669 50%, #10b981 100%) !important;
  border: 2px solid #a7f3d0 !important;
  border-bottom: 5px solid #064e3b !important;
  box-shadow: 0 0 16px rgba(16, 185, 129, 0.4), 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}
.tab-btn-shopping:hover {
  box-shadow: 0 0 26px rgba(16, 185, 129, 0.8), 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}
.tab-btn-shopping .btn-micro-badge { background: #dcfce7; color: #15803d; }
.tab-btn-shopping .btn-sub-desc { color: #bbf7d0; }

/* 6. TÜYOLAR & SÖZLÜK (Elektrik Moru) */
.tab-btn-tips {
  background: linear-gradient(135deg, #4338ca 0%, #6366f1 50%, #8b5cf6 100%) !important;
  border: 2px solid #c7d2fe !important;
  border-bottom: 5px solid #312e81 !important;
  box-shadow: 0 0 16px rgba(139, 92, 246, 0.4), 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}
.tab-btn-tips:hover {
  box-shadow: 0 0 26px rgba(139, 92, 246, 0.8), 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}
.tab-btn-tips .btn-micro-badge { background: #ede9fe; color: #5b21b6; }
.tab-btn-tips .btn-sub-desc { color: #ddd6fe; }

/* 7. VALİZ KONTROL (Deniz Yeşili / Teal) */
.tab-btn-checklist {
  background: linear-gradient(135deg, #0f766e 0%, #0d9488 50%, #14b8a6 100%) !important;
  border: 2px solid #99f6e4 !important;
  border-bottom: 5px solid #134e4a !important;
  box-shadow: 0 0 16px rgba(20, 184, 166, 0.4), 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}
.tab-btn-checklist:hover {
  box-shadow: 0 0 26px rgba(20, 184, 166, 0.8), 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}
.tab-btn-checklist .btn-micro-badge { background: #ccfbf1; color: #115e59; }
.tab-btn-checklist .btn-sub-desc { color: #99f6e4; }

/* 8. BÜTÇE & KUR (Kraliyet Mavisi) */
.tab-btn-budget {
  background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 50%, #3b82f6 100%) !important;
  border: 2px solid #bfdbfe !important;
  border-bottom: 5px solid #1e3a8a !important;
  box-shadow: 0 0 16px rgba(59, 130, 246, 0.4), 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}
.tab-btn-budget:hover {
  box-shadow: 0 0 26px rgba(59, 130, 246, 0.8), 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}
.tab-btn-budget .btn-micro-badge { background: #dbeafe; color: #1e40af; }
.tab-btn-budget .btn-sub-desc { color: #bfdbfe; }

/* 9. ÖZEL NOTLAR (Gül Pembesi / Rose) */
.tab-btn-notes {
  background: linear-gradient(135deg, #9f1239 0%, #be123c 50%, #fb7185 100%) !important;
  border: 2px solid #fecdd3 !important;
  border-bottom: 5px solid #4c0519 !important;
  box-shadow: 0 0 16px rgba(251, 113, 133, 0.4), 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}
.tab-btn-notes:hover {
  box-shadow: 0 0 26px rgba(251, 113, 133, 0.8), 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}
.tab-btn-notes .btn-micro-badge { background: #ffe4e6; color: #881337; }
.tab-btn-notes .btn-sub-desc { color: #fecdd3; }

/* 10. ACİL DURUM (Canlı Kızıl Alarm SOS) */
.tab-btn-sos {
  background: linear-gradient(135deg, #991b1b 0%, #dc2626 50%, #ef4444 100%) !important;
  border: 2px solid #fca5a5 !important;
  border-bottom: 5px solid #7f1d1d !important;
  box-shadow: 0 0 16px rgba(239, 68, 68, 0.4), 0 4px 10px rgba(0, 0, 0, 0.3) !important;
  animation: sosSoftPulse 2.2s infinite ease-in-out !important;
}
.tab-btn-sos:hover {
  box-shadow: 0 0 28px rgba(239, 68, 68, 0.85), 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}
.tab-btn-sos .btn-micro-badge { background: #fee2e2; color: #991b1b; }
.tab-btn-sos .btn-sub-desc { color: #fecaca; }

@keyframes sosSoftPulse {
  0%, 100% { box-shadow: 0 0 16px rgba(239, 68, 68, 0.4); }
  50% { box-shadow: 0 0 28px rgba(239, 68, 68, 0.75); }
}

/* AKTİF BUTON PARILTI HALESİ */
.tab-btn.active {
  outline: 3px solid #ffffff !important;
  outline-offset: 3px !important;
  transform: translateY(-3px) scale(1.03) !important;
  box-shadow: 0 0 35px rgba(255, 255, 255, 0.8), 0 8px 20px rgba(0, 0, 0, 0.5) !important;
}

@media (max-width: 1024px) {
  .tabs {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (max-width: 640px) {
  .tabs {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.5rem !important;
  }
  .btn-main-title {
    font-size: 0.78rem !important;
  }
  .btn-sub-desc {
    display: none !important;
  }
  .tab-btn {
    min-height: 70px !important;
    padding: 0.55rem 0.4rem !important;
  }
}
.tab-btn-stay-vip:hover {
  transform: translateY(-4px) scale(1.04) !important;
  box-shadow: 0 0 40px rgba(245, 158, 11, 0.9), 0 0 70px rgba(255, 0, 127, 0.8) !important;
  border-color: #ffffff !important;
}
.tab-btn-stay-vip:active {
  transform: translateY(3px) !important;
  border-bottom-width: 2px !important;
}
.tab-btn-stay-vip.active {
  background: linear-gradient(135deg, #059669 0%, #10b981 50%, #06b6d4 100%) !important;
  border-color: #a7f3d0 !important;
  border-bottom: 6px solid #064e3b !important;
  box-shadow: 0 0 35px rgba(16, 185, 129, 0.8), 0 0 50px rgba(6, 182, 212, 0.6) !important;
}
.janjan-badge-tag {
  background: #fde047;
  color: #0f172a;
  font-size: 0.68rem;
  font-weight: 900;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  letter-spacing: 0.04em;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
  animation: tagJanjanBounce 1.5s infinite ease-in-out;
}
.janjan-main-label {
  font-size: 0.96rem;
  font-weight: 900;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.9), 0 2px 4px rgba(0, 0, 0, 0.6);
  letter-spacing: 0.02em;
}
.janjan-sub-label {
  font-size: 0.68rem;
  color: #fef08a;
  font-weight: 800;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}

@keyframes retroJanjanGlow {
  0%, 100% {
    box-shadow: 0 0 25px rgba(245, 158, 11, 0.6), 0 0 45px rgba(255, 0, 127, 0.45);
    transform: scale(1);
  }
  50% {
    box-shadow: 0 0 40px rgba(245, 158, 11, 0.9), 0 0 70px rgba(217, 70, 239, 0.75);
    transform: scale(1.03);
  }
}
@keyframes tagJanjanBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

.tab-panel{display:none}
.tab-panel.active{display:block}

/* DAY CARDS */
.day-card{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-sm);margin-bottom:1rem;overflow:hidden;border-left:4px solid var(--border);transition:box-shadow .2s}
.day-card:hover{box-shadow:var(--shadow-md)}
.day-card.madrid{border-left-color:#7c3aed}
.day-card.sevilla{border-left-color:var(--gold)}
.day-card.granada{border-left-color:var(--red)}
.day-card.barcelona{border-left-color:var(--blue)}
.day-card.travel{border-left-color:#0891b2}
.day-header{padding:1rem 1.2rem;display:flex;align-items:center;gap:.8rem;cursor:pointer;user-select:none}
.day-num{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.88rem;flex-shrink:0;color:#fff}
.madrid .day-num{background:#7c3aed}
.sevilla .day-num{background:var(--gold)}
.granada .day-num{background:var(--red)}
.barcelona .day-num{background:var(--blue)}
.travel .day-num{background:#0891b2}
.day-header-info{flex:1;min-width:0}
.day-date{font-size:.72rem;color:var(--slate-light);font-weight:600;text-transform:uppercase}
.day-title{font-size:.95rem;font-weight:800;color:var(--navy);line-height:1.35;word-break:break-word}
.day-city-badge{font-size:.68rem;font-weight:800;padding:.2rem .55rem;border-radius:999px;text-transform:uppercase;letter-spacing:.04em;flex-shrink:0;white-space:nowrap}
.madrid .day-city-badge{background:#ede9fe;color:#7c3aed}
.sevilla .day-city-badge{background:var(--gold-light);color:#92400e}
.granada .day-city-badge{background:var(--red-light);color:var(--red-dark)}
.barcelona .day-city-badge{background:var(--blue-light);color:var(--blue)}
.travel .day-city-badge{background:#cffafe;color:#0e7490}
.day-toggle{font-size:1rem;color:var(--slate-light);transition:transform .2s;margin-left:.5rem;flex-shrink:0}
.day-card.open .day-toggle{transform:rotate(180deg)}
.day-body{display:none;padding:0 1.2rem 1.2rem;border-top:1px solid var(--border)}
.day-card.open .day-body{display:block}

/* SCHEDULE */
.schedule-item{display:flex;gap:.9rem;padding:.75rem 0;border-bottom:1px solid var(--bg);align-items:flex-start}
.schedule-item:last-child{border-bottom:none}
.schedule-time{font-size:.72rem;font-weight:700;color:var(--slate-light);text-transform:uppercase;letter-spacing:.04em;min-width:65px;padding-top:.2rem;flex-shrink:0}
.schedule-content{flex:1;min-width:0}
.schedule-place{font-weight:800;color:var(--navy);font-size:.95rem;line-height:1.55;margin-bottom:.25rem;word-break:break-word}
.schedule-desc{font-size:.84rem;color:var(--slate);margin-top:.2rem;line-height:1.55;word-break:break-word}
.schedule-price{font-size:.73rem;font-weight:700;color:var(--green);background:var(--green-light);padding:.15rem .55rem;border-radius:999px;margin-top:.3rem;display:inline-block;white-space:nowrap}
.schedule-free{font-size:.73rem;font-weight:700;color:var(--blue);background:var(--blue-light);padding:.15rem .55rem;border-radius:999px;margin-top:.3rem;display:inline-block;white-space:nowrap}
.schedule-tip{font-size:.78rem;color:#92400e;background:var(--gold-light);border-left:3px solid var(--gold);padding:.45rem .75rem;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-top:.45rem;line-height:1.55;word-break:break-word}
.schedule-note{font-size:.78rem;color:#1e40af;background:var(--blue-light);border-left:3px solid var(--blue);padding:.45rem .75rem;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-top:.45rem;line-height:1.55;word-break:break-word}
.schedule-tr{font-size:.78rem;color:#9a3412;background:#fff7ed;border-left:3px solid #ea580c;padding:.45rem .75rem;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-top:.45rem;line-height:1.55;word-break:break-word}
.schedule-warn{font-size:.78rem;color:var(--red-dark);background:var(--red-light);border-left:3px solid var(--red);padding:.45rem .75rem;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-top:.45rem;line-height:1.55;word-break:break-word}

/* TICKETS */
.ticket-list{display:flex;flex-direction:column;gap:.7rem}
.ticket-item{background:var(--white);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);padding:.9rem 1.1rem;display:flex;align-items:center;gap:.9rem;border-left:4px solid var(--border);transition:all .15s}
.ticket-item.done{border-left-color:var(--green);background:var(--green-light)}
.ticket-item.urgent{border-left-color:var(--red)}
.ticket-check{width:26px;height:26px;border-radius:50%;border:2.5px solid var(--border);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;font-size:.88rem;transition:all .15s;background:#fff}
.ticket-item.done .ticket-check{background:var(--green);border-color:var(--green);color:#fff}
.ticket-info{flex:1}
.ticket-name{font-weight:800;font-size:.92rem;color:var(--navy)}
.ticket-meta{font-size:.76rem;color:var(--slate);margin-top:.1rem}
.ticket-price{font-size:.8rem;font-weight:700;color:var(--green);white-space:nowrap}
.ticket-urgency{font-size:.68rem;font-weight:800;padding:.18rem .55rem;border-radius:999px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.urgency-now{background:#fee2e2;color:var(--red-dark)}
.urgency-soon{background:var(--gold-light);color:#92400e}
.urgency-later{background:var(--blue-light);color:var(--blue)}
.ticket-link{font-size:.75rem;color:var(--blue);text-decoration:none;font-weight:700}
.ticket-link:hover{text-decoration:underline}

/* CHECKLIST */
.checklist-section{margin-bottom:1.5rem}
.checklist-section h4{font-size:.82rem;font-weight:800;color:var(--slate);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.65rem}
.checklist-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:.45rem}
.check-item{display:flex;align-items:center;gap:.55rem;background:var(--white);border-radius:var(--radius-sm);padding:.55rem .8rem;cursor:pointer;border:1.5px solid var(--border);transition:all .15s;user-select:none}
.check-item:hover{border-color:var(--red)}
.check-item.checked{background:var(--green-light);border-color:var(--green)}
.check-icon{width:20px;height:20px;border-radius:50%;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:.7rem;flex-shrink:0;transition:all .15s;background:#fff}
.check-item.checked .check-icon{background:var(--green);border-color:var(--green);color:#fff}
.check-label{font-size:.82rem;font-weight:600;color:var(--navy);line-height:1.3}
.check-item.checked .check-label{color:var(--green);text-decoration:line-through;opacity:.7}
.checklist-progress{background:var(--white);border-radius:var(--radius-sm);padding:1rem 1.2rem;margin-bottom:1rem;box-shadow:var(--shadow-sm)}
.progress-label{font-size:.8rem;font-weight:700;color:var(--slate);margin-bottom:.4rem;display:flex;justify-content:space-between}
.progress-bar{height:8px;background:var(--border);border-radius:999px;overflow:hidden}
.progress-fill{height:100%;background:linear-gradient(to right,var(--red),var(--gold));border-radius:999px;transition:width .4s}

/* BUDGET */
.budget-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:.8rem;margin-bottom:1.5rem}
.budget-card{background:var(--white);border-radius:var(--radius-sm);padding:.9rem 1rem;box-shadow:var(--shadow-sm)}
.budget-label{font-size:.73rem;color:var(--slate);font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-bottom:.35rem}
.budget-input-row{display:flex;align-items:center;gap:.4rem}
.budget-currency{font-weight:800;color:var(--slate);font-size:1rem}
.budget-input{flex:1;border:1.5px solid var(--border);border-radius:8px;padding:.45rem .65rem;font-size:.95rem;font-weight:700;color:var(--navy);font-family:inherit;transition:border-color .15s;width:100%}
.budget-input:focus{outline:none;border-color:var(--red)}
.budget-hint{font-size:.7rem;color:var(--slate-light);margin-top:.22rem}
.budget-total{background:linear-gradient(135deg,var(--red),#be123c);color:#fff;border-radius:var(--radius);padding:1.4rem;text-align:center;margin-bottom:1rem}
.budget-total-label{font-size:.85rem;opacity:.85;margin-bottom:.25rem}
.budget-total-eur{font-size:2rem;font-weight:900}
.budget-total-try{font-size:.95rem;opacity:.8;margin-top:.2rem}
.budget-rate-info{font-size:.7rem;opacity:.65;margin-top:.3rem}
.budget-breakdown{background:var(--white);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);overflow:hidden;margin-bottom:1rem}
.budget-row{display:flex;justify-content:space-between;align-items:center;padding:.7rem 1.1rem;border-bottom:1px solid var(--bg)}
.budget-row:last-child{border-bottom:none;font-weight:800;background:var(--bg)}
.budget-row-label{font-size:.86rem;color:var(--slate)}
.budget-row-val{font-size:.86rem;font-weight:700;color:var(--navy)}

/* NOTES */
.notes-area{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1.1rem}
.notes-label{font-size:.78rem;font-weight:700;color:var(--slate);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.55rem}
.notes-textarea{width:100%;min-height:130px;border:1.5px solid var(--border);border-radius:var(--radius-sm);padding:.75rem;font-size:.88rem;font-family:inherit;color:var(--navy);resize:vertical;line-height:1.6;transition:border-color .15s}
.notes-textarea:focus{outline:none;border-color:var(--red)}
.notes-save-btn{margin-top:.65rem;background:var(--red);color:#fff;border:none;border-radius:999px;padding:.5rem 1.3rem;font-weight:700;font-size:.83rem;cursor:pointer;font-family:inherit;transition:background .15s}
.notes-save-btn:hover{background:var(--red-dark)}
.notes-saved{font-size:.76rem;color:var(--green);margin-top:.35rem;display:none}

/* CITY SUMMARY */
.city-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:.8rem;margin-bottom:1.5rem}
.city-card{border-radius:var(--radius-sm);padding:1rem;text-align:center;color:#fff;font-weight:800}
.city-card.madrid{background:linear-gradient(135deg,#7c3aed,#4c1d95)}
.city-card.sevilla{background:linear-gradient(135deg,#f59e0b,#b45309)}
.city-card.granada{background:linear-gradient(135deg,#e11d48,#be123c)}
.city-card.barcelona{background:linear-gradient(135deg,#2563eb,#1d4ed8)}
.city-card-emoji{font-size:1.8rem;display:block;margin-bottom:.3rem}
.city-card-name{font-size:.88rem}
.city-card-nights{font-size:.72rem;opacity:.85;margin-top:.1rem}

/* RESPONSIVE */
@media(max-width:640px){
  .hero{padding:3.8rem 1rem 1.8rem}
  .hero-back{top:.75rem;left:.75rem;padding:.35rem .75rem;font-size:.78rem}
  .hero-print{top:.75rem;right:.75rem;padding:.35rem .75rem;font-size:.78rem}
  .hero h1{font-size:1.5rem;line-height:1.25}
  .boarding-grid{grid-template-columns:1fr}
  .tabs{gap:.25rem}
  .tab-btn{font-size:.73rem;padding:.45rem .4rem;min-width:80px}
  .schedule-time{min-width:55px;font-size:.66rem}
  .main-container{padding:1rem .8rem 3rem}
  .city-cards{grid-template-columns:1fr 1fr}
  .budget-grid{grid-template-columns:1fr}
}

/* PRINT */
@media print{
  .hero-back,.hero-print,.tabs,.notes-save-btn{display:none!important}
  .day-body{display:block!important}
  .tab-panel{display:block!important}
  body{background:#fff}
  .day-card{box-shadow:none;border:1px solid #ddd;margin-bottom:.8rem}
  .boarding-pass{box-shadow:none;border:1px solid #ddd}
}

/* PLAN SELECTOR */
.plan-selector-container {
  background: var(--white);
  border-radius: var(--radius);
  padding: 1.2rem;
  box-shadow: var(--shadow-sm);
  margin-bottom: 1.5rem;
  border: 2px solid var(--border);
}
.plan-selector-title {
  font-size: 0.95rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.plan-nav-buttons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.8rem;
}
.plan-btn {
  border: 2px solid var(--border);
  background: #f8fafc;
  border-radius: var(--radius-sm);
  padding: 0.9rem 1rem;
  text-align: left;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: inherit;
  position: relative;
}
.plan-btn:hover {
  border-color: #cbd5e1;
  background: #f1f5f9;
}
.plan-btn.active {
  border-color: var(--red);
  background: #fff1f2;
  box-shadow: 0 4px 12px rgba(225,29,72,0.12);
}
.plan-badge {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  margin-bottom: 0.4rem;
}
.plan-btn:nth-child(1) .plan-badge { background: #fee2e2; color: var(--red-dark); }
.plan-btn:nth-child(2) .plan-badge { background: #dbeafe; color: #1e40af; }
.plan-btn-title {
  font-size: 0.98rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 0.2rem;
}
.plan-btn-desc {
  font-size: 0.78rem;
  color: var(--slate);
  line-height: 1.4;
}

.plan-content-wrap {
  display: none;
}
.plan-content-wrap.active {
  display: block;
}

@media (max-width: 640px) {
  .plan-nav-buttons {
    grid-template-columns: 1fr;
  }
}

/* VERDICT TAGS & VALUE RATINGS */
.verdict-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.72rem;
  font-weight: 800;
  padding: 0.18rem 0.6rem;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0.15rem 0.25rem 0.15rem 0.2rem;
  vertical-align: middle;
  white-space: nowrap;
  line-height: 1.25;
}
.verdict-must {
  background: #dcfce7;
  color: #15803d;
  border: 1px solid #86efac;
}
.verdict-free-gem {
  background: #dbeafe;
  color: #1d4ed8;
  border: 1px solid #93c5fd;
}
.verdict-skip-pay {
  background: #fef3c7;
  color: #b45309;
  border: 1px solid #fde68a;
}
.verdict-exp {
  font-size: 0.76rem;
  color: #334155;
  background: #f8fafc;
  border-left: 3px solid #64748b;
  padding: 0.38rem 0.65rem;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  margin-top: 0.35rem;
  line-height: 1.45;
}
.verdict-exp strong {
  color: var(--navy);
}

/* DETAILED CULTURE & STORYTELLING BOXES */
.culture-deep-card {
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  padding: 1rem 1.1rem;
  margin-top: 0.6rem;
  margin-bottom: 0.4rem;
  font-size: 0.83rem;
  line-height: 1.6;
}
.culture-deep-card h5 {
  font-size: 0.88rem;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 0.4rem;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.culture-history {
  background: #f8fafc;
  border-left: 3px solid #3b82f6;
  padding: 0.5rem 0.75rem;
  border-radius: 0 8px 8px 0;
  margin-bottom: 0.4rem;
  color: #1e293b;
}
.culture-tr-link {
  background: #fff7ed;
  border-left: 3px solid #ea580c;
  padding: 0.5rem 0.75rem;
  border-radius: 0 8px 8px 0;
  margin-bottom: 0.4rem;
  color: #7c2d12;
}
.culture-verdict-box {
  background: #f0fdf4;
  border-left: 3px solid #16a34a;
  padding: 0.5rem 0.75rem;
  border-radius: 0 8px 8px 0;
  color: #14532d;
}
.culture-obs-list {
  background: #fdf4ff;
  border-left: 3px solid #c026d3;
  padding: 0.5rem 0.75rem;
  border-radius: 0 8px 8px 0;
  margin-bottom: 0.4rem;
  color: #701a75;
  font-size: 0.83rem;
  line-height: 1.5;
}
.culture-price-tag {
  font-weight: 800;
  color: #15803d;
}

/* SURVIVAL GUIDE STYLES */
.survival-card {
  background: var(--white);
  border-radius: var(--radius);
  padding: 1.2rem;
  box-shadow: var(--shadow-sm);
  margin-bottom: 1.2rem;
  border-left: 4px solid var(--red);
}
.survival-card.orange { border-left-color: var(--gold); }
.survival-card.blue { border-left-color: var(--blue); }
.survival-card.green { border-left-color: var(--green); }

.survival-card h4 {
  font-size: 1rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 0.6rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.survival-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
  margin-top: 0.5rem;
}
.survival-table th, .survival-table td {
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
}
.survival-table th {
  background: #f8fafc;
  color: var(--slate);
  font-weight: 700;
}
.phrase-es {
  font-weight: 800;
  color: var(--red-dark);
}
.phrase-tr {
  color: var(--navy);
  font-weight: 600;
}
.phrase-read {
  font-size: 0.76rem;
  color: var(--slate);
  font-style: italic;
}

/* TRY CONVERSION TAG */
.try-val {
  color: #c2410c;
  font-weight: 700;
  font-size: 0.9em;
  margin-left: 0.25rem;
}

/* ITINERARY PHOTO CARD */
.itinerary-photo-wrap {
  margin: 0.85rem 0 0.6rem 0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
  border: 1px solid #e2e8f0;
  position: relative;
  cursor: pointer;
  background: #0f172a;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.itinerary-photo-wrap:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 26px rgba(0,0,0,0.14);
  border-color: #cbd5e1;
}
.itinerary-photo {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  display: block;
  transition: transform 0.35s ease, opacity 0.25s ease;
  cursor: zoom-in;
}
.itinerary-photo-wrap:hover .itinerary-photo {
  transform: scale(1.025);
  opacity: 0.95;
}
.photo-expand-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(15, 23, 42, 0.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.28rem 0.65rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  border: 1px solid rgba(255,255,255,0.22);
  pointer-events: none;
  transition: all 0.2s ease;
  z-index: 2;
}
.itinerary-photo-wrap:hover .photo-expand-badge {
  background: rgba(225, 29, 72, 0.92);
  border-color: rgba(255,255,255,0.45);
  transform: scale(1.06);
}
.itinerary-photo-caption {
  background: #f8fafc;
  padding: 0.65rem 0.95rem;
  font-size: 0.8rem;
  color: #475569;
  display: block;
  border-top: 1px solid #e2e8f0;
  line-height: 1.55;
  word-break: break-word;
}
.itinerary-photo-caption strong {
  color: #0f172a;
  font-weight: 700;
  margin-right: 0.2rem;
}

/* PHRASE TRIGGER BUTTON & MODAL STYLES */
.phrase-trigger-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: linear-gradient(135deg, #fef3c7, #fde68a);
  border: 1.5px solid #f59e0b;
  color: #92400e;
  font-size: 0.74rem;
  font-weight: 800;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  cursor: pointer;
  margin: 0.15rem 0.25rem 0.15rem 0.2rem;
  transition: all 0.2s ease;
  vertical-align: middle;
  font-family: inherit;
  box-shadow: 0 2px 6px rgba(245, 158, 11, 0.2);
  white-space: nowrap;
  line-height: 1.25;
}
.phrase-trigger-btn:hover {
  background: linear-gradient(135deg, #fde68a, #fcd34d);
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(245, 158, 11, 0.3);
}
.phrase-trigger-btn .icon {
  font-size: 0.88rem;
}

/* MODAL BACKDROP */
.sp-modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(15, 23, 42, 0.7);
  backdrop-filter: blur(4px);
  z-index: 99999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  transition: opacity 0.25s ease;
}
.sp-modal-backdrop.open {
  display: flex;
  opacity: 1;
}

/* MODAL DIALOG */
.sp-modal-dialog {
  background: #ffffff;
  border-radius: 16px;
  width: 100%;
  max-width: 680px;
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 50px rgba(0,0,0,0.3);
  overflow: hidden;
  border: 1px solid #e2e8f0;
  transform: scale(0.95);
  transition: transform 0.25s ease;
}
.sp-modal-backdrop.open .sp-modal-dialog {
  transform: scale(1);
}

.sp-modal-header {
  padding: 1.1rem 1.3rem;
  background: linear-gradient(135deg, #0f172a, #1e293b);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sp-modal-title-box {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.sp-modal-icon {
  font-size: 1.5rem;
  background: rgba(255,255,255,0.1);
  padding: 0.3rem 0.5rem;
  border-radius: 10px;
}
.sp-modal-title {
  font-size: 1.05rem;
  font-weight: 800;
  margin: 0;
  color: #ffffff;
}
.sp-modal-subtitle {
  font-size: 0.75rem;
  color: #94a3b8;
  margin: 0.1rem 0 0 0;
}
.sp-modal-close {
  background: rgba(255,255,255,0.1);
  border: none;
  color: #ffffff;
  font-size: 1.2rem;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s;
}
.sp-modal-close:hover {
  background: rgba(225, 29, 72, 0.8);
}

.sp-modal-body {
  padding: 1rem 1.2rem;
  overflow-y: auto;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

/* PHRASE ITEM CARD */
.phrase-row-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 0.75rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.phrase-row-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 3px 8px rgba(0,0,0,0.04);
}

.p-tr {
  font-size: 0.9rem;
  font-weight: 800;
  color: #0f172a;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.p-tr::before {
  content: "🇹🇷";
  font-size: 0.85rem;
}

.p-en-group {
  background: #eff6ff;
  border-left: 3px solid #3b82f6;
  padding: 0.35rem 0.6rem;
  border-radius: 0 6px 6px 0;
  font-size: 0.83rem;
}
.p-en {
  font-weight: 700;
  color: #1e40af;
}
.p-en-read {
  font-size: 0.75rem;
  color: #64748b;
  font-style: italic;
  margin-left: 0.3rem;
}

.p-es-group {
  background: #fff1f2;
  border-left: 3px solid #e11d48;
  padding: 0.35rem 0.6rem;
  border-radius: 0 6px 6px 0;
  font-size: 0.83rem;
}
.p-es {
  font-weight: 800;
  color: #be123c;
}
.p-es-read {
  font-size: 0.75rem;
  color: #881337;
  font-style: italic;
  margin-left: 0.3rem;
}

.sp-modal-footer {
  padding: 0.75rem 1.2rem;
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
  font-size: 0.76rem;
  color: #64748b;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* TRANSIT DEEP BOX */
.transit-box {
  background: #f0fdfa;
  border-left: 4px solid #0d9488;
  border-radius: 0 10px 10px 0;
  padding: 0.85rem 1rem;
  margin-top: 0.55rem;
  margin-bottom: 0.45rem;
  font-size: 0.83rem;
  line-height: 1.55;
  color: #134e4a;
}
.transit-header {
  font-weight: 800;
  font-size: 0.88rem;
  color: #115e59;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.35rem;
}
.transit-line-badge {
  display: inline-block;
  padding: 0.1rem 0.45rem;
  border-radius: 6px;
  font-weight: 800;
  font-size: 0.75rem;
  color: #fff;
  margin: 0 0.2rem;
}
.badge-metro-madrid-l1 { background: #0093d7; }
.badge-metro-madrid-l2 { background: #ea1d2d; }
.badge-metro-madrid-l5 { background: #8ec321; }
.badge-metro-bcn-l2 { background: #9b26b6; }
.badge-metro-bcn-l3 { background: #3cb878; }
.badge-metro-bcn-l4 { background: #fdb913; color: #000; }
.badge-metro-bcn-l5 { background: #008cd2; }
.badge-train-renfe { background: #8b1e41; }
.badge-train-fgc { background: #f37021; }
.badge-bus { background: #475569; }

/* WEATHER & CLOTHING WIDGET */
.weather-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.weather-card {
  background: #ffffff;
  border-radius: 14px;
  padding: 1.2rem;
  box-shadow: 0 4px 15px rgba(0,0,0,0.05);
  border: 1.5px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.weather-card.madrid-w { border-top: 5px solid #7c3aed; }
.weather-card.bcn-w { border-top: 5px solid #2563eb; }

.weather-city-title {
  font-size: 1.1rem;
  font-weight: 800;
  color: #0f172a;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.weather-temp-badge {
  font-size: 1.3rem;
  font-weight: 900;
  color: #0f172a;
  background: #f1f5f9;
  padding: 0.2rem 0.6rem;
  border-radius: 10px;
}
.weather-desc {
  font-size: 0.82rem;
  color: #64748b;
  line-height: 1.5;
}
.clothing-advice-box {
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 10px;
  padding: 0.75rem 0.9rem;
  font-size: 0.83rem;
  color: #9a3412;
  line-height: 1.55;
}

/* SHOPPING CARDS */
.shopping-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 0.9rem;
}
.shop-item-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.shop-item-name {
  font-weight: 800;
  color: #0f172a;
  font-size: 0.92rem;
}
.shop-item-brand {
  font-size: 0.76rem;
  font-weight: 700;
  color: #2563eb;
  background: #dbeafe;
  padding: 0.1rem 0.45rem;
  border-radius: 999px;
  display: inline-block;
}
.shop-item-price {
  font-weight: 800;
  color: #16a34a;
  font-size: 0.82rem;
}
.shop-item-desc {
  font-size: 0.8rem;
  color: #475569;
  line-height: 1.45;
}

/* GOOGLE MAPS LINK BUTTON */
.maps-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.73rem;
  font-weight: 700;
  color: #2563eb;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  text-decoration: none;
  margin: 0.15rem 0.25rem 0.15rem 0.2rem;
  vertical-align: middle;
  transition: all 0.15s;
  white-space: nowrap;
  line-height: 1.25;
}
.maps-btn:hover {
  background: #dbeafe;
  border-color: #93c5fd;
  text-decoration: none;
}

/* LIVE PULSE INDICATOR */
.live-pulse {
  display: inline-block;
  width: 9px;
  height: 9px;
  background-color: #22c55e;
  border-radius: 50%;
  margin-right: 6px;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
  animation: pulse-green 2s infinite;
}
@keyframes pulse-green {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 8px rgba(34, 197, 94, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
  }
}

/* WEATHER DAYS CAROUSEL / STRIP */
.weather-days-strip {
  display: flex;
  gap: 0.6rem;
  overflow-x: auto;
  padding: 0.5rem 0 0.8rem 0;
  margin: 1rem 0;
  scrollbar-width: thin;
}
.weather-day-chip {
  flex: 0 0 auto;
  background: #f8fafc;
  border: 1.5px solid #e2e8f0;
  border-radius: 12px;
  padding: 0.6rem 0.8rem;
  text-align: center;
  min-width: 95px;
  transition: transform 0.15s;
}
.weather-day-chip:hover {
  transform: translateY(-2px);
  border-color: #3b82f6;
  background: #ffffff;
}
.wd-date { font-size: 0.72rem; font-weight: 700; color: #64748b; margin-bottom: 0.2rem; }
.wd-icon { font-size: 1.3rem; margin: 0.2rem 0; }
.wd-temp { font-size: 0.88rem; font-weight: 800; color: #0f172a; }
.wd-city { font-size: 0.68rem; font-weight: 700; color: #2563eb; background: #eff6ff; border-radius: 6px; padding: 0.1rem 0.3rem; margin-top: 0.3rem; display: inline-block; }

/* SUPERMARKET BRANDING */
.supermarket-brand-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.9rem 1.2rem;
  border-radius: 12px;
  margin-bottom: 1rem;
}
.brand-mercadona {
  background: linear-gradient(135deg, #059669 0%, #10b981 100%);
  color: white;
}
.brand-eci {
  background: linear-gradient(135deg, #064e3b 0%, #047857 100%);
  color: white;
}
.brand-title {
  font-size: 1.15rem;
  font-weight: 900;
  letter-spacing: -0.01em;
}
.brand-badge {
  font-size: 0.75rem;
  font-weight: 800;
  background: rgba(255,255,255,0.22);
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  backdrop-filter: blur(4px);
}

/* CUSTOMS ALERT BOX */
.customs-box {
  background: #f0fdf4;
  border: 1.5px solid #86efac;
  border-radius: 14px;
  padding: 1rem 1.2rem;
  margin-top: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.customs-box-title {
  font-weight: 800;
  color: #166534;
  font-size: 0.95rem;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.customs-box p, .customs-box li {
  font-size: 0.83rem;
  color: #14532d;
  line-height: 1.5;
}

/* ============================================================
   4K FOTOĞRAF LIGHTBOX (BÜYÜTÜCÜ) & TAM EKRAN GALERİ STİLLERİ
   ============================================================ */
.sp-lightbox-backdrop {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(10, 15, 29, 0.96);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  z-index: 100000;
  display: none;
  flex-direction: column;
  justify-content: space-between;
  opacity: 0;
  transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  user-select: none;
  touch-action: none;
}
.sp-lightbox-backdrop.open {
  display: flex;
  opacity: 1;
}

/* Üst Kontrol Barı */
.sp-lb-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.4rem;
  z-index: 20;
  width: 100%;
}
.sp-lb-counter-pill {
  background: rgba(255, 255, 255, 0.12);
  color: #f8fafc;
  font-size: 0.86rem;
  font-weight: 700;
  padding: 0.4rem 0.95rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
.sp-lb-actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.sp-lb-btn {
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #ffffff;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 1.15rem;
  text-decoration: none;
  transition: all 0.18s ease;
  backdrop-filter: blur(8px);
  outline: none;
}
.sp-lb-btn:hover {
  background: rgba(255, 255, 255, 0.25);
  transform: scale(1.08);
}
.sp-lb-btn:active {
  transform: scale(0.95);
}
.sp-lb-close-btn {
  background: rgba(225, 29, 72, 0.88);
  border-color: rgba(255, 255, 255, 0.35);
  font-size: 1.3rem;
  font-weight: 800;
}
.sp-lb-close-btn:hover {
  background: #e11d48;
}

/* Navigasyon Okları (Desktop & Geniş Ekran) */
.sp-lb-nav-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #ffffff;
  font-size: 2.6rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 20;
  transition: all 0.2s ease;
  backdrop-filter: blur(8px);
  outline: none;
}
.sp-lb-nav-btn:hover {
  background: rgba(255, 255, 255, 0.3);
  transform: translateY(-50%) scale(1.1);
}
.sp-lb-nav-btn:active {
  transform: translateY(-50%) scale(0.95);
}
.sp-lb-prev-btn { left: 1.6rem; }
.sp-lb-next-btn { right: 1.6rem; }

/* Görsel Alanı */
.sp-lb-content {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  padding: 0.5rem 1.2rem;
  width: 100%;
}
.sp-lb-img-container {
  position: relative;
  max-width: 95vw;
  max-height: 76vh;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.sp-lb-img-container.zoomed {
  transform: scale(1.65);
  cursor: grab;
}
.sp-lb-img-container.zoomed:active {
  cursor: grabbing;
}
#sp-lb-img {
  max-width: 94vw;
  max-height: 75vh;
  object-fit: contain;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.15);
  cursor: zoom-in;
  transition: opacity 0.2s ease, transform 0.25s ease;
}
.sp-lb-img-container.zoomed #sp-lb-img {
  cursor: zoom-out;
}

/* Alt Çubuk ve Açıklama */
.sp-lb-bottombar {
  padding: 0.8rem 1.4rem 1.2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  z-index: 20;
  width: 100%;
}
.sp-lb-caption-box {
  background: rgba(15, 23, 42, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: #f8fafc;
  font-size: 0.86rem;
  line-height: 1.5;
  padding: 0.65rem 1.2rem;
  border-radius: 12px;
  max-width: 860px;
  text-align: center;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.4);
}
.sp-lb-caption-box strong {
  color: #fbbf24;
}
.sp-lb-mobile-nav {
  display: none;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 440px;
  gap: 0.8rem;
}
.sp-lb-mob-btn {
  flex: 1;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #ffffff;
  font-size: 0.84rem;
  font-weight: 700;
  padding: 0.6rem 0.9rem;
  border-radius: 999px;
  cursor: pointer;
  font-family: inherit;
  backdrop-filter: blur(8px);
  transition: background 0.15s;
}
.sp-lb-mob-btn:active {
  background: rgba(255, 255, 255, 0.28);
}
.sp-lb-swipe-hint {
  color: #cbd5e1;
  font-size: 0.74rem;
  font-weight: 600;
  white-space: nowrap;
}

/* ============================================================
   KUSURSUZ MOBİL UYUMLULUK (RESPONSIVE MASTER SUITE)
   ============================================================ */
@media (max-width: 768px) {
  /* Lightbox mobil dokunuşlar */
  .sp-lb-nav-btn { display: none !important; }
  .sp-lb-mobile-nav { display: flex; }
  .sp-lb-topbar { padding: 0.65rem 0.85rem; }
  .sp-lb-bottombar { padding: 0.5rem 0.85rem 1rem; }
  .sp-lb-caption-box {
    font-size: 0.78rem;
    padding: 0.55rem 0.85rem;
    max-height: 80px;
    overflow-y: auto;
  }
  #sp-lb-img {
    max-height: 64vh;
    border-radius: 10px;
  }
  .sp-lb-counter-pill {
    font-size: 0.78rem;
    padding: 0.3rem 0.75rem;
  }
  .sp-lb-btn {
    width: 38px;
    height: 38px;
    font-size: 1rem;
  }
}

@media (max-width: 640px) {
  /* Genel sayfa düzeni */
  .main-container {
    padding: 0.8rem 0.65rem 3rem !important;
  }

  /* Mobil Uygulama Hissinde Yatay Kayan Sekmeler */
  .tabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    gap: 0.45rem !important;
    padding: 0.5rem 0.35rem 0.7rem !important;
    margin-bottom: 0.9rem !important;
  }
  .tabs::-webkit-scrollbar {
    display: none !important;
  }
  .tab-btn {
    flex: 0 0 auto !important;
    min-width: auto !important;
    padding: 0.55rem 0.85rem !important;
    font-size: 0.78rem !important;
    white-space: nowrap !important;
    border-radius: 12px !important;
    border: 1.5px solid #cbd5e1 !important;
    background: #f8fafc !important;
  }
  .tab-btn.active {
    background: linear-gradient(135deg, #e11d48, #be123c) !important;
    border-color: #9f1239 !important;
    color: #fff !important;
  }
  .tab-btn-stay-vip {
    flex: 0 0 auto !important;
    min-width: auto !important;
    padding: 0.45rem 0.85rem !important;
    white-space: nowrap !important;
  }

  /* Plan Seçici (Plan A / Plan B) */
  .plan-selector-container {
    padding: 0.85rem !important;
    margin-bottom: 1rem !important;
  }
  .plan-nav-buttons {
    grid-template-columns: 1fr !important;
    gap: 0.6rem !important;
  }
  .plan-btn {
    padding: 0.75rem 0.85rem !important;
  }
  .plan-btn-title {
    font-size: 0.95rem !important;
  }

  /* Gün Kartları ve Başlıkları */
  .day-card {
    border-radius: 14px !important;
    margin-bottom: 0.85rem !important;
  }
  .day-header {
    padding: 0.85rem 0.85rem !important;
    gap: 0.6rem !important;
    align-items: flex-start !important;
  }
  .day-num {
    width: 34px !important;
    height: 34px !important;
    font-size: 0.92rem !important;
    margin-top: 0.15rem !important;
    flex-shrink: 0 !important;
  }
  .day-header-info {
    flex: 1 !important;
    min-width: 0 !important;
  }
  .day-title {
    font-size: 0.88rem !important;
    line-height: 1.4 !important;
    word-break: break-word !important;
  }
  .day-city-badge {
    font-size: 0.64rem !important;
    padding: 0.18rem 0.45rem !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    margin-top: 0.15rem !important;
  }
  .day-toggle {
    margin-top: 0.15rem !important;
    flex-shrink: 0 !important;
  }
  .day-body {
    padding: 0 0.85rem 1rem !important;
  }

  /* Zaman Çizelgesi ve Mekanlar */
  .schedule-item {
    gap: 0.65rem !important;
    padding: 0.7rem 0 !important;
  }
  .schedule-time {
    min-width: 50px !important;
    font-size: 0.66rem !important;
    padding-top: 0.2rem !important;
  }
  .schedule-place {
    font-size: 0.9rem !important;
    line-height: 1.55 !important;
    display: block !important;
    word-break: break-word !important;
    margin-bottom: 0.3rem !important;
  }

  /* Butonlar: Sözlük ve Google Maps */
  .phrase-trigger-btn {
    display: inline-flex !important;
    margin: 0.15rem 0.25rem 0.15rem 0 !important;
    padding: 0.25rem 0.6rem !important;
    font-size: 0.72rem !important;
    min-height: 28px !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
    line-height: 1.25 !important;
  }
  .maps-btn {
    display: inline-flex !important;
    margin: 0.15rem 0.25rem 0.15rem 0 !important;
    padding: 0.25rem 0.6rem !important;
    font-size: 0.72rem !important;
    min-height: 28px !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
    line-height: 1.25 !important;
  }
  .verdict-tag {
    display: inline-flex !important;
    margin: 0.15rem 0.25rem 0.15rem 0 !important;
    font-size: 0.68rem !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
    line-height: 1.25 !important;
  }

  /* Kültür & Tarih Kartları */
  .culture-deep-card {
    padding: 0.8rem 0.85rem !important;
    font-size: 0.8rem !important;
    border-radius: 10px !important;
  }
  .culture-history, .culture-tr-link, .culture-obs-list, .culture-verdict-box {
    padding: 0.55rem 0.7rem !important;
    font-size: 0.78rem !important;
    line-height: 1.6 !important;
    word-break: break-word !important;
  }

  /* Mekan Sözlüğü Modalı */
  .sp-modal-backdrop {
    padding: 0.5rem !important;
  }
  .sp-modal-dialog {
    max-width: 100% !important;
    max-height: 92vh !important;
    border-radius: 16px !important;
  }
  .sp-modal-header {
    padding: 0.85rem 1rem !important;
  }
  .sp-modal-title {
    font-size: 0.95rem !important;
  }
  .sp-modal-body {
    padding: 0.75rem 0.85rem !important;
    gap: 0.6rem !important;
  }
  .sp-phrase-card {
    padding: 0.65rem 0.8rem !important;
  }
  .sp-phrase-tr {
    font-size: 0.84rem !important;
  }
  .sp-phrase-en, .sp-phrase-es {
    font-size: 0.82rem !important;
  }

  /* Biletler ve Çanta Kontrolü */
  .ticket-item {
    padding: 0.75rem 0.85rem !important;
    gap: 0.7rem !important;
  }
  .check-item {
    padding: 0.7rem 0.8rem !important;
  }

  /* Süpermarket & Alışveriş Gridleri */
  .supermarket-grid, .shop-items-grid {
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }
}

/* ============================================================
   PWA & ÇEVRİMDIŞI (OFFLINE) MODU STİLLERİ
   ============================================================ */
.pwa-banner {
  background: linear-gradient(135deg, #1e1b4b 0%, #312e81 60%, #4338ca 100%);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: var(--radius);
  padding: 1rem 1.2rem;
  margin-bottom: 1.2rem;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  box-shadow: 0 8px 24px rgba(30, 27, 75, 0.25);
  animation: pwaSlideDown 0.3s ease;
}
@keyframes pwaSlideDown {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}
.pwa-banner-left {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  flex: 1;
}
.pwa-banner-icon {
  font-size: 2rem;
  background: rgba(255, 255, 255, 0.15);
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pwa-banner-info {
  flex: 1;
}
.pwa-banner-title {
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  margin-bottom: 0.15rem;
}
.pwa-banner-desc {
  font-size: 0.78rem;
  color: #c7d2fe;
  line-height: 1.4;
}
.pwa-banner-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.pwa-btn-primary {
  background: linear-gradient(135deg, #e11d48, #be123c);
  border: none;
  color: #ffffff;
  font-size: 0.82rem;
  font-weight: 800;
  padding: 0.55rem 1rem;
  border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(225, 29, 72, 0.4);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  white-space: nowrap;
  font-family: inherit;
}
.pwa-btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(225, 29, 72, 0.5);
}
.pwa-btn-dismiss {
  background: rgba(255, 255, 255, 0.15);
  border: none;
  color: #ffffff;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 0.85rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s;
}
.pwa-btn-dismiss:hover {
  background: rgba(255, 255, 255, 0.28);
}

.pwa-offline-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 0.6rem 1rem;
  margin-bottom: 1.2rem;
  box-shadow: var(--shadow-sm);
  flex-wrap: wrap;
  gap: 0.5rem;
}
.pwa-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.78rem;
  font-weight: 700;
  color: #166534;
}
.pwa-info-btn {
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  color: #334155;
  font-size: 0.73rem;
  font-weight: 700;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
}
.pwa-info-btn:hover {
  background: #e2e8f0;
  color: #0f172a;
}

.offline-toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(120px);
  background: rgba(15, 23, 42, 0.94);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #ffffff;
  padding: 0.75rem 1.4rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 700;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.45);
  border: 1px solid rgba(255, 255, 255, 0.2);
  z-index: 999999;
  pointer-events: none;
  opacity: 0;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
  max-width: 90vw;
  text-align: center;
}
.offline-toast.visible {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}

@media (max-width: 640px) {
  .pwa-banner {
    flex-direction: column;
    align-items: stretch;
    padding: 0.9rem;
    gap: 0.8rem;
  }
  .pwa-banner-actions {
    justify-content: flex-end;
  }
  .pwa-btn-primary {
    flex: 1;
    text-align: center;
  }
}

/* ============================================================
   GÜNLÜK GOOGLE MAPS TAM ROTA BAŞLATICI STİLLERİ
   ============================================================ */
.day-route-banner {
  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
  border: 1.5px solid #86efac;
  border-radius: 12px;
  padding: 0.75rem 1rem;
  margin: 0.8rem 0 1.1rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  flex-wrap: wrap;
  box-shadow: 0 2px 8px rgba(22, 163, 74, 0.08);
}
.dr-info {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex: 1;
  min-width: 220px;
}
.dr-icon {
  font-size: 1.4rem;
  background: #ffffff;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(22, 163, 74, 0.15);
  flex-shrink: 0;
}
.dr-text {
  display: flex;
  flex-direction: column;
}
.dr-text strong {
  font-size: 0.88rem;
  font-weight: 800;
  color: #14532d;
  line-height: 1.3;
}
.dr-text span {
  font-size: 0.74rem;
  color: #166534;
  line-height: 1.35;
}
.day-route-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: linear-gradient(135deg, #16a34a, #15803d);
  color: #ffffff !important;
  text-decoration: none !important;
  font-size: 0.78rem;
  font-weight: 800;
  padding: 0.48rem 1rem;
  border-radius: 999px;
  box-shadow: 0 3px 10px rgba(22, 163, 74, 0.35);
  transition: all 0.18s ease;
  white-space: nowrap;
}
.day-route-btn:hover {
  background: linear-gradient(135deg, #15803d, #166534);
  transform: translateY(-1px);
  box-shadow: 0 5px 14px rgba(22, 163, 74, 0.45);
}
.day-route-btn:active {
  transform: scale(0.97);
}

@media (max-width: 640px) {
  .day-route-banner {
    padding: 0.7rem 0.8rem;
    gap: 0.6rem;
  }
  .day-route-btn {
    width: 100%;
    justify-content: center;
    padding: 0.55rem;
    font-size: 0.8rem;
  }
}

/* ============================================================
   CANLI DÖVİZ & MENÜ HESAP MAKİNESİ (EUR ➔ TRY) STİLLERİ
   ============================================================ */
.quick-converter-card {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 2px solid #e2e8f0;
  border-radius: var(--radius);
  padding: 1.3rem;
  margin-bottom: 1.5rem;
  box-shadow: var(--shadow-sm);
}
.qc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-bottom: 1.1rem;
  padding-bottom: 0.8rem;
  border-bottom: 1px solid #e2e8f0;
}
.qc-title-box {
  display: flex;
  align-items: center;
  gap: 0.7rem;
}
.qc-icon {
  font-size: 1.8rem;
  background: #fef3c7;
  border: 1px solid #fde68a;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.qc-title {
  font-size: 1.05rem;
  font-weight: 900;
  color: #0f172a;
}
.qc-sub {
  font-size: 0.78rem;
  color: #64748b;
  margin-top: 0.1rem;
}
.qc-rate-badge {
  font-size: 0.82rem;
  font-weight: 700;
  color: #b45309;
  background: #fef3c7;
  border: 1px solid #fcd34d;
  padding: 0.35rem 0.8rem;
  border-radius: 999px;
  white-space: nowrap;
}
.qc-body {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
}
.qc-input-group {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.qc-input-group label {
  font-size: 0.8rem;
  font-weight: 800;
  color: #334155;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.qc-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}
.qc-currency-symbol {
  position: absolute;
  left: 1rem;
  font-size: 1.2rem;
  font-weight: 900;
  color: #64748b;
  pointer-events: none;
}
.qc-input {
  width: 100%;
  padding: 0.75rem 1rem 0.75rem 2.4rem;
  font-size: 1.2rem;
  font-weight: 900;
  color: #0f172a;
  border: 2px solid #cbd5e1;
  border-radius: 12px;
  background: #ffffff;
  font-family: inherit;
  transition: border-color 0.2s;
}
.qc-input:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}
.qc-chips {
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
}
.qc-chip {
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  color: #334155;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.3rem 0.65rem;
  border-radius: 999px;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
}
.qc-chip:hover {
  background: #e2e8f0;
  border-color: #cbd5e1;
}
.qc-result-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.8rem;
  margin-top: 0.3rem;
}
.qc-res-box {
  background: #eff6ff;
  border: 1.5px solid #bfdbfe;
  border-radius: 12px;
  padding: 0.85rem 1rem;
  text-align: center;
}
.qc-res-box.qc-res-couple {
  background: #fdf2f8;
  border-color: #fbcfe8;
}
.qc-res-lbl {
  font-size: 0.74rem;
  font-weight: 700;
  color: #1e40af;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.2rem;
}
.qc-res-couple .qc-res-lbl {
  color: #be185d;
}
.qc-res-val {
  font-size: 1.3rem;
  font-weight: 900;
  color: #1e3a8a;
}
.qc-res-couple .qc-res-val {
  color: #9d174d;
}

/* ============================================================
   SOS POCKET HUB (ACİL DURUM & SAĞLIK) STİLLERİ
   ============================================================ */
.sos-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius);
  padding: 1.3rem;
  margin-bottom: 1.3rem;
  box-shadow: var(--shadow-sm);
}
.sos-card.red-accent {
  border-left: 5px solid #e11d48;
}
.sos-card.blue-accent {
  border-left: 5px solid #2563eb;
}
.sos-card.green-accent {
  border-left: 5px solid #16a34a;
}
.sos-card-title {
  font-size: 1.05rem;
  font-weight: 900;
  color: #0f172a;
  margin-bottom: 0.8rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.sos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1rem;
}
.sos-contact-box {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}
.sos-contact-name {
  font-size: 0.95rem;
  font-weight: 900;
  color: #0f172a;
}
.sos-contact-detail {
  font-size: 0.8rem;
  color: #475569;
  line-height: 1.45;
}
.sos-call-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  background: #e11d48;
  color: #ffffff !important;
  text-decoration: none !important;
  font-size: 0.82rem;
  font-weight: 800;
  padding: 0.5rem 1rem;
  border-radius: 999px;
  margin-top: 0.4rem;
  transition: all 0.15s;
}
.sos-call-btn:hover {
  background: #be123c;
}
.sos-call-btn.green {
  background: #16a34a;
}
.sos-call-btn.green:hover {
  background: #15803d;
}
.sos-steps-list {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.sos-step-item {
  background: #f8fafc;
  border-left: 3px solid #f59e0b;
  padding: 0.6rem 0.85rem;
  border-radius: 0 8px 8px 0;
  font-size: 0.82rem;
  line-height: 1.5;
  color: #1e293b;
}
.sos-physio-box {
  background: #f0fdf4;
  border: 1.5px solid #86efac;
  border-radius: 14px;
  padding: 1.1rem;
  margin-top: 0.5rem;
}
.sos-physio-badge {
  display: inline-block;
  background: #166534;
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 800;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  margin-bottom: 0.6rem;
  text-transform: uppercase;
}

@media (max-width: 640px) {
  .qc-result-grid {
    grid-template-columns: 1fr;
  }
  .sos-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   ÇİFTLER İÇİN EN İYİ FOTOĞRAF & POZ NOKTALARI STİLLERİ
   ============================================================ */
.couple-photo-tip {
  background: linear-gradient(135deg, #fff1f2 0%, #fdf2f8 100%);
  border: 1.5px solid #fbcfe8;
  border-left: 4px solid #db2777;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  padding: 0.65rem 0.95rem;
  margin-top: 0.55rem;
  margin-bottom: 0.55rem;
  font-size: 0.81rem;
  line-height: 1.6;
  color: #831843;
  word-break: break-word;
}
.couple-photo-tip strong {
  color: #9d174d;
}
.cpt-header {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-weight: 800;
  font-size: 0.84rem;
  color: #9d174d;
  margin-bottom: 0.3rem;
}
.cpt-header-icon {
  font-size: 1.05rem;
}



/* ===== KONAKLAMA REHBERİ (panel-stay) ===== */
.stay-intro{background:linear-gradient(135deg,#eef2ff,#fff);border:1.5px solid #c7d2fe;border-radius:14px;padding:1.2rem 1.4rem;margin-bottom:1.4rem;font-size:.88rem;line-height:1.6;color:#334155}
.stay-intro-title{font-weight:900;font-size:1.1rem;color:#1e1b4b;margin-bottom:.5rem}
.stay-intro-nodes{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.8rem}
.stay-intro-nodes span{background:#fff;border:1px solid #c7d2fe;border-radius:999px;padding:.25rem .7rem;font-size:.75rem;font-weight:700;color:#3730a3}
.stay-logic{background:#fffbeb;border-left:4px solid #f59e0b;border-radius:0 10px 10px 0;padding:.9rem 1.1rem;margin-bottom:1rem;font-size:.86rem;line-height:1.6;color:#78350f}
.stay-card{background:#fff;border:1.5px solid var(--border,#e2e8f0);border-radius:14px;padding:1.1rem 1.3rem;margin-bottom:1rem;box-shadow:0 2px 8px rgba(15,23,42,.05)}
.stay-card.best{border:2px solid #16a34a;box-shadow:0 4px 16px rgba(22,163,74,.12)}
.stay-card-head{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem;margin-bottom:.6rem}
.stay-card-head h3{font-size:1.02rem;font-weight:800;color:#0f172a;margin:0;flex:1;min-width:200px}
.stay-rank{font-size:.7rem;font-weight:900;letter-spacing:.04em;background:#f1f5f9;color:#334155;padding:.2rem .6rem;border-radius:999px}
.stay-card.best .stay-rank{background:#dcfce7;color:#166534}
.stay-why{font-size:.86rem;line-height:1.6;color:#334155;margin:0 0 .7rem}
.stay-streets{display:grid;gap:.5rem;font-size:.83rem;line-height:1.55;margin-bottom:.7rem}
.stay-streets>div{background:#f8fafc;border-radius:8px;padding:.6rem .8rem}
.stay-streets .ok{font-weight:800;color:#15803d}
.stay-streets .warn{font-weight:800;color:#b45309}
.stay-matrix{width:100%;border-collapse:collapse;font-size:.8rem;margin-bottom:.6rem}
.stay-matrix th{background:#0f172a;color:#fff;text-align:left;padding:.45rem .6rem;font-weight:700}
.stay-matrix td{border-bottom:1px solid #e2e8f0;padding:.45rem .6rem;vertical-align:top;color:#334155}
.stay-matrix tr:nth-child(even) td{background:#f8fafc}
.stay-metro{font-size:.8rem;color:#1e40af;background:#eff6ff;border-radius:8px;padding:.5rem .8rem}
.stay-alt{background:#f8fafc;border:1px dashed #94a3b8;border-radius:12px;padding:1rem 1.2rem;margin-bottom:1rem;font-size:.85rem;line-height:1.6;color:#334155}
.stay-alt ul{margin:.5rem 0 .6rem 1.1rem;padding:0}
.stay-alt li{margin-bottom:.35rem}
.stay-avoid{background:#fef2f2;border-radius:8px;padding:.6rem .8rem;color:#991b1b;font-size:.82rem}
.stay-transfer{background:#ecfeff;border-left:4px solid #0891b2;border-radius:0 10px 10px 0;padding:.9rem 1.1rem;margin-bottom:1rem;font-size:.85rem;line-height:1.65;color:#155e75}
.stay-platform-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.8rem;margin-bottom:1rem}
.stay-platform{background:#fff;border:1.5px solid #e2e8f0;border-radius:12px;padding:1rem 1.1rem;font-size:.83rem;line-height:1.55;color:#334155}
.stay-platform ul{margin:.4rem 0 0 1rem;padding:0}
.stay-platform li{margin-bottom:.35rem}
.sp-title{font-weight:900;font-size:.98rem;color:#0f172a}
.sp-best{font-size:.75rem;color:#16a34a;font-weight:700;margin:.2rem 0 .3rem}
.stay-checklist{background:#f0fdf4;border:1.5px solid #86efac;border-radius:12px;padding:1rem 1.2rem;margin-bottom:1rem;font-size:.85rem;line-height:1.6;color:#14532d}
.stay-checklist ol{margin:.5rem 0 0 1.2rem;padding:0}
.stay-checklist li{margin-bottom:.35rem}
.stay-tax,.stay-budget{background:#fff;border:1.5px solid #e2e8f0;border-radius:12px;padding:1rem 1.2rem;margin-bottom:1rem;font-size:.85rem;line-height:1.6;color:#334155}
.stay-tax{border-color:#fcd34d;background:#fffbeb}
.stay-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.8rem;margin-bottom:1rem}
.stay-links-col{background:#fff;border:1.5px solid #e2e8f0;border-radius:12px;padding:.9rem 1rem;display:flex;flex-direction:column;gap:.4rem}
.sl-city{font-weight:900;color:#0f172a;margin-bottom:.2rem}
.stay-links-col a{display:block;background:#f1f5f9;border-radius:8px;padding:.5rem .7rem;font-size:.82rem;font-weight:700;color:#1e40af;text-decoration:none;transition:background .15s}
.stay-links-col a:hover{background:#dbeafe}
.stay-final{background:linear-gradient(135deg,#0f172a,#1e293b);color:#f8fafc;border-radius:14px;padding:1.1rem 1.3rem;font-size:.88rem;line-height:1.65;margin-bottom:1rem}
@media (max-width:640px){.stay-matrix{font-size:.74rem}.stay-matrix th,.stay-matrix td{padding:.35rem .4rem}}

/* ============================================================
   3D İZOMETRİK GÜNLÜK ROTA HARİTASI VE ADIM ADIM AKIŞ
   ============================================================ */
.day-3d-route-card {
  background: #ffffff;
  border: 1.5px solid #e2e8f0;
  border-radius: 14px;
  padding: 1rem 1.1rem;
  margin-bottom: 1.4rem;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
  transition: transform 0.2s, box-shadow 0.2s;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}
.day-3d-route-card:hover {
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.09);
}
.d3r-header {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 0.8rem;
  flex-wrap: wrap;
}
.d3r-badge {
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 800;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.d3r-title {
  font-size: 0.95rem;
  font-weight: 800;
  color: #0f172a;
}
.d3r-img-wrap {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  background: #0f172a;
  border: 1px solid #cbd5e1;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.d3r-img {
  width: 100%;
  height: auto;
  max-height: 520px;
  object-fit: contain;
  display: block;
  transition: transform 0.35s ease;
}
.d3r-img-wrap:hover .d3r-img {
  transform: scale(1.02);
}
.d3r-zoom-badge {
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: rgba(15, 23, 42, 0.82);
  backdrop-filter: blur(4px);
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.3rem 0.7rem;
  border-radius: 999px;
  pointer-events: none;
}
.d3r-steps-flow {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.9rem;
  padding: 0.7rem 0.8rem;
  background: #f8fafc;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}
.d3r-step-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1;
  min-width: 125px;
}
.d3r-num {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #0f172a;
  color: #ffffff;
  font-size: 0.75rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.d3r-step-info {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
}
.d3r-step-info strong {
  font-size: 0.78rem;
  color: #0f172a;
}
.d3r-step-info span {
  font-size: 0.68rem;
  color: #64748b;
}
.d3r-arrow {
  color: #ea580c;
  font-weight: 900;
  font-size: 1.05rem;
  animation: pulseArrow 1.5s infinite ease-in-out;
  flex-shrink: 0;
}
@keyframes pulseArrow {
  0%, 100% { transform: translateX(0); opacity: 0.65; }
  50% { transform: translateX(4px); opacity: 1; }
}

/* ROUTE TRANSIT STEP CONNECTOR */
.route-transit-step {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.4rem 0.9rem;
  margin: 0.6rem 0 0.6rem 1rem;
  background: #f8fafc;
  border-left: 3px solid #3b82f6;
  border-radius: 0 8px 8px 0;
  font-size: 0.8rem;
  box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.rts-icon { font-size: 0.95rem; }
.rts-text { color: #334155; font-weight: 600; }
.rts-text strong { color: #1e3a8a; }

/* GOLDEN HOUR PHOTO CARD */
.day-golden-photo-card {
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
  border: 1.5px solid #fcd34d;
  border-radius: var(--radius-sm);
  padding: 0.95rem 1.15rem;
  margin-top: 1.2rem;
  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.10);
}
.dgpc-icon-wrap {
  font-size: 1.8rem;
  line-height: 1;
  flex-shrink: 0;
}
.dgpc-content { flex: 1; font-size: 0.85rem; color: #78350f; line-height: 1.5; }
.dgpc-title {
  font-size: 0.92rem;
  font-weight: 900;
  color: #92400e;
  margin-bottom: 0.25rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.dgpc-time-badge {
  background: #f59e0b;
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 800;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* DAY BUDGET SUMMARY BOX */
.day-budget-summary-box {
  background: #f0fdf4;
  border: 1.5px solid #86efac;
  border-radius: var(--radius-sm);
  padding: 0.95rem 1.15rem;
  margin-top: 0.8rem;
  margin-bottom: 0.5rem;
  box-shadow: 0 2px 8px rgba(22, 163, 74, 0.08);
}
.dbsb-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.6rem;
  border-bottom: 1px dashed #bbf7d0;
  padding-bottom: 0.5rem;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.dbsb-title {
  font-size: 0.9rem;
  font-weight: 900;
  color: #14532d;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.dbsb-total {
  font-size: 0.92rem;
  font-weight: 900;
  color: #15803d;
  background: #dcfce7;
  padding: 0.25rem 0.7rem;
  border-radius: 999px;
}
.dbsb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 0.5rem;
  font-size: 0.8rem;
}
.dbsb-item {
  background: #ffffff;
  border: 1px solid #dcfce7;
  padding: 0.45rem 0.65rem;
  border-radius: 8px;
}
.dbsb-item-lbl {
  font-size: 0.72rem;
  color: #4b5563;
  font-weight: 600;
  display: block;
}
.dbsb-item-val {
  font-weight: 800;
  color: #166534;
  font-size: 0.85rem;
}

/* CHILL & RELAXING ESCAPES CARD */
.day-chill-card {
  background: linear-gradient(135deg, #fdf4ff 0%, #fae8ff 100%);
  border: 1.5px solid #e9d5ff;
  border-radius: var(--radius-sm);
  padding: 0.95rem 1.15rem;
  margin-top: 0.8rem;
  box-shadow: 0 2px 8px rgba(168, 85, 247, 0.08);
}
.dcc-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.92rem;
  font-weight: 900;
  color: #7e22ce;
  margin-bottom: 0.6rem;
  flex-wrap: wrap;
}
.dcc-badge {
  background: #f3e8ff;
  color: #6b21a8;
  font-size: 0.68rem;
  font-weight: 800;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-left: auto;
}
.dcc-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.dcc-item {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  font-size: 0.83rem;
  line-height: 1.45;
  color: #4c1d95;
  background: rgba(255, 255, 255, 0.75);
  padding: 0.5rem 0.75rem;
  border-radius: 8px;
  border: 1px solid #f3e8ff;
}
.dcc-icon {
  font-size: 1.15rem;
  line-height: 1.2;
  flex-shrink: 0;
}
.dcc-item strong {
  color: #581c87;
}