/* ============================================================
   Someday — shared detail slide-in panel
   Opens on the right when a person / you / tradition / holiday
   is clicked. Adapted to the dashboard's Romie + Futura palette.
   ============================================================ */
.dp-overlay { position: fixed; inset: 0; background: rgba(48,49,79,0.34); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); z-index: 2500; opacity: 0; pointer-events: none; transition: opacity 0.25s ease; }
.dp-overlay.open { opacity: 1; pointer-events: auto; }
.dp-panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(600px, 100%); background: #F4EFE3; z-index: 2600; display: flex; flex-direction: column; box-shadow: -20px 0 60px rgba(48,49,79,0.18); transform: translateX(100%); transition: transform 0.3s cubic-bezier(0.32,0,0.14,1); overflow: hidden; font-family: 'FuturaPT','Futura','Century Gothic',sans-serif; }
@media (min-width: 1200px) { .dp-panel { width: 660px; } }
.dp-panel.open { transform: none; }

.dp-header { flex-shrink: 0; background: #30314F; padding: 1.5rem 1.5rem 1.25rem; }
.dp-header-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.dp-id-row { display: flex; align-items: center; gap: 0.875rem; min-width: 0; }
.dp-avatar { width: 3rem; height: 3rem; border-radius: 50%; background: rgba(244,239,227,0.12); border: 1px solid rgba(244,239,227,0.22); display: flex; align-items: center; justify-content: center; font-family: 'Romie',serif; font-size: 1.375rem; color: #F4EFE3; flex-shrink: 0; }
.dp-avatar.sq { border-radius: 0.75rem; font-size: 1.5rem; }
.dp-avatar.accent { background: rgba(178,36,82,0.22); border-color: rgba(178,36,82,0.4); }
.dp-avatar.gold { background: rgba(204,211,55,0.16); border-color: rgba(204,211,55,0.3); }
.dp-name { font-family: 'Romie',serif; font-style: italic; font-size: 1.75rem; color: #F4EFE3; line-height: 1.1; }
.dp-meta { font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(244,239,227,0.5); margin-top: 5px; }
.dp-close { width: 1.875rem; height: 1.875rem; border-radius: 50%; background: rgba(244,239,227,0.1); border: none; cursor: pointer; color: rgba(244,239,227,0.6); font-size: 0.9375rem; flex-shrink: 0; line-height: 1; }
.dp-close:hover { background: rgba(244,239,227,0.18); color: #F4EFE3; }
.dp-stats { display: flex; gap: 0.4375rem; flex-wrap: wrap; }
.dp-pill { display: flex; align-items: center; gap: 5px; padding: 4px 11px; border-radius: 20px; background: rgba(244,239,227,0.08); border: 1px solid rgba(244,239,227,0.14); font-size: 14px; color: rgba(244,239,227,0.7); }
.dp-pill strong { font-weight: 600; color: #F4EFE3; }
.dp-pill.accent { background: rgba(178,36,82,0.22); border-color: rgba(178,36,82,0.4); color: #f0c2d2; }
.dp-pill.accent strong { color: #fff; }
.dp-pill.gold { background: rgba(204,211,55,0.14); border-color: rgba(204,211,55,0.28); color: rgba(204,211,55,0.92); }

.dp-header-cta { display: flex; gap: 0.5rem; margin-top: 0.875rem; flex-wrap: wrap; }
.dp-cta-make { display: inline-flex; align-items: center; gap: 5px; padding: 7px 14px; background: rgba(244,239,227,0.12); border: 1px solid rgba(244,239,227,0.22); border-radius: 8px; color: #F4EFE3; font-size: 14px; letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer; font-family: 'FuturaPT',sans-serif; transition: background 0.15s; }
.dp-cta-make:hover { background: rgba(244,239,227,0.2); }
.dp-cta-save { display: inline-flex; align-items: center; gap: 5px; padding: 7px 14px; background: transparent; border: 1px solid rgba(244,239,227,0.18); border-radius: 8px; color: rgba(244,239,227,0.65); font-size: 14px; letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer; font-family: 'FuturaPT',sans-serif; transition: background 0.15s, color 0.15s; }
.dp-cta-save:hover { background: rgba(244,239,227,0.1); color: #F4EFE3; }

.dp-filter-bar { flex-shrink: 0; background: #fff; border-bottom: 1px solid rgba(48,49,79,0.1); padding: 0.625rem 1.25rem; display: flex; gap: 0.375rem; flex-wrap: wrap; align-items: center; }
.dp-filter-pill { padding: 5px 13px; border-radius: 20px; border: 1px solid rgba(48,49,79,0.12); background: #F4EFE3; color: #30314F; font-size: 14px; letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer; white-space: nowrap; font-family: 'FuturaPT',sans-serif; transition: border-color 0.15s, color 0.15s, background 0.15s; }
.dp-filter-pill:hover { border-color: #30314F; color: #30314F; }
.dp-filter-pill.active { background: #30314F; color: #F4EFE3; border-color: #30314F; }

/* TABS — pill as default */
.dp-tabs { flex-shrink: 0; display: flex; padding: 8px 12px; gap: 4px; background: #F4EFE3; border-bottom: 1px solid rgba(48,49,79,0.08); overflow-x: auto; scrollbar-width: none; }
.dp-tabs::-webkit-scrollbar { display: none; }
.dp-tab { font-size: 14px; letter-spacing: 0.07em; text-transform: uppercase; color: #30314F; padding: 5px 13px; border-radius: 20px; border-bottom: none; margin-bottom: 0; cursor: pointer; white-space: nowrap; background: none; border: none; font-family: 'FuturaPT',sans-serif; transition: background 0.15s, color 0.15s; }
.dp-tab:hover { background: rgba(48,49,79,0.07); color: #30314F; }
.dp-tab.active { background: #30314F; color: #F4EFE3; }

/* TAB STYLE A — pill */
.dp-tabs.ts-pill { padding: 8px 12px; gap: 4px; background: #F4EFE3; border-bottom: 1px solid rgba(48,49,79,0.08); }
.dp-tabs.ts-pill .dp-tab { border-bottom: none; border-radius: 20px; padding: 5px 13px; margin-bottom: 0; color: #30314F; }
.dp-tabs.ts-pill .dp-tab:hover { background: rgba(48,49,79,0.06); color: #30314F; }
.dp-tabs.ts-pill .dp-tab.active { background: #30314F; color: #F4EFE3; }

/* TAB STYLE B — bold underline (refined) */
.dp-tabs.ts-line { padding: 0 20px; gap: 0; }
.dp-tabs.ts-line .dp-tab { border-bottom: 3px solid transparent; padding: 10px 14px; letter-spacing: 0.06em; }
.dp-tabs.ts-line .dp-tab.active { color: #B22452; border-bottom-color: #B22452; }

/* TAB STYLE C — segmented control */
.dp-tabs.ts-seg { padding: 10px 16px; background: #F4EFE3; border-bottom: 1px solid rgba(48,49,79,0.08); }
.dp-tabs.ts-seg::before { content: ''; } /* spacer trick */
.dp-tabs.ts-seg .dp-tab { border-bottom: none; border-radius: 0; margin-bottom: 0; padding: 5px 12px; border-right: 1px solid rgba(48,49,79,0.12); color: #30314F; background: #fff; }
.dp-tabs.ts-seg .dp-tab:first-child { border-radius: 8px 0 0 8px; }
.dp-tabs.ts-seg .dp-tab:last-child { border-radius: 0 8px 8px 0; border-right: none; }
.dp-tabs.ts-seg .dp-tab.active { background: #30314F; color: #F4EFE3; }

.dp-body { flex: 1; overflow-y: auto; padding: 0 1.5rem 2rem; }
.dp-body::-webkit-scrollbar { width: 5px; }
.dp-body::-webkit-scrollbar-thumb { background: #E0DAD0; border-radius: 4px; }
.dp-section { padding: 1.375rem 0; border-bottom: 1px solid rgba(48,49,79,0.1); }
.dp-section:last-child { border-bottom: none; }
.dp-label { font-size: 14px; letter-spacing: 0.16em; text-transform: uppercase; color: #30314F; margin-bottom: 0.875rem; display: flex; align-items: center; gap: 0.625rem; }
.dp-label-action { margin-left: auto; font-size: 14px; letter-spacing: 0.08em; text-transform: uppercase; color: #30314F; cursor: pointer; }
.dp-label-action:hover { color: #30314F; }

/* prose / narrative card */
.dp-prose-card { background: #EAE5DB; border: 1px solid rgba(48,49,79,0.1); border-radius: 10px; padding: 15px 16px; }
.dp-prose { font-family: 'Romie',serif; font-style: italic; font-size: 0.9375rem; color: #30314F; line-height: 1.7; }

/* generic rows */
.dp-list { display: flex; flex-direction: column; gap: 8px; }
.dp-item { background: #fff; border: 1px solid rgba(48,49,79,0.1); border-radius: 10px; padding: 12px 14px; }
.dp-item-title { font-family: 'Romie',serif; font-size: 0.9375rem; color: #30314F; line-height: 1.3; margin-bottom: 2px; }
.dp-item-sub { font-size: 14px; color: #30314F; line-height: 1.5; }

/* date rows */
.dp-date-row { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid rgba(48,49,79,0.1); border-radius: 10px; padding: 11px 14px; }
.dp-badge { min-width: 42px; height: 42px; border-radius: 8px; background: #EAE5DB; border: 1px solid rgba(48,49,79,0.1); display: flex; flex-direction: column; align-items: center; justify-content: center; flex-shrink: 0; }
.dp-badge.soon { background: rgba(178,36,82,0.08); border-color: rgba(178,36,82,0.22); }
.dp-bm { font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase; color: #30314F; }
.dp-badge.soon .dp-bm { color: #B22452; }
.dp-bd { font-family: 'Romie',serif; font-size: 1.25rem; color: #30314F; line-height: 1; }
.dp-badge.soon .dp-bd { color: #B22452; }
.dp-date-body { flex: 1; min-width: 0; }
.dp-date-name { font-family: 'Romie',serif; font-size: 0.875rem; color: #30314F; margin-bottom: 2px; }
.dp-date-sub { font-size: 14px; color: #30314F; line-height: 1.4; }
.dp-date-sub.urgent { color: #B22452; }
.dp-mini-btn { flex-shrink: 0; padding: 5px 11px; border-radius: 20px; border: 1px solid #B22452; background: transparent; color: #B22452; font-size: 14px; cursor: pointer; white-space: nowrap; font-family: 'FuturaPT',sans-serif; }
.dp-mini-btn:hover { background: #B22452; color: #F4EFE3; }

/* AI suggestion */
.dp-ai { margin-top: 10px; padding: 13px 15px; background: rgba(178,36,82,0.07); border: 1px solid rgba(178,36,82,0.18); border-radius: 10px; display: flex; gap: 10px; align-items: flex-start; }
.dp-ai-icon { width: 26px; height: 26px; border-radius: 7px; background: #B22452; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 14px; flex-shrink: 0; }
.dp-ai-label { font-size: 14px; letter-spacing: 0.14em; text-transform: uppercase; color: #B22452; margin-bottom: 3px; }
.dp-ai-body { font-size: 14px; color: #30314F; line-height: 1.6; }
.dp-ai-body em { font-style: normal; color: #B22452; font-weight: 600; }
.dp-ai-actions { display: flex; gap: 5px; margin-top: 8px; flex-wrap: wrap; }
.dp-ai-btn { padding: 4px 10px; border-radius: 20px; border: 1px solid rgba(178,36,82,0.25); background: transparent; color: #B22452; font-size: 14px; cursor: pointer; font-family: 'FuturaPT',sans-serif; }
.dp-ai-btn.filled { background: #B22452; color: #F4EFE3; border-color: #B22452; }

/* favorites grid */
.dp-fav-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.dp-fav { padding: 11px 13px; background: #fff; border: 1px solid rgba(48,49,79,0.1); border-radius: 10px; }
.dp-fav-cat { font-size: 14px; letter-spacing: 0.12em; text-transform: uppercase; color: #30314F; margin-bottom: 4px; }
.dp-fav-val { font-family: 'Romie',serif; font-size: 1rem; color: #30314F; line-height: 1.2; margin-bottom: 2px; }
.dp-fav-note { font-size: 14px; color: #30314F; line-height: 1.5; }

/* note card */
.dp-note { padding: 13px 15px; background: #EAE5DB; border: 1px solid rgba(48,49,79,0.1); border-radius: 10px; margin-top: 10px; }
.dp-note-text { font-family: 'Romie',serif; font-style: italic; font-size: 0.875rem; color: #30314F; line-height: 1.65; }
.dp-note-src { margin-top: 6px; font-size: 14px; color: #30314F; }

/* memories */
.dp-mem { display: grid; grid-template-columns: 4px 1fr; gap: 12px; }
.dp-mem-rule { border-radius: 2px; background: #E0DAD0; }
.dp-mem-rule.rose { background: #B22452; opacity: 0.4; }
.dp-mem-rule.gold { background: #CCD337; opacity: 0.55; }
.dp-mem-rule.blue { background: #A6B7C7; }
.dp-mem-body { padding: 11px 13px; background: #fff; border: 1px solid rgba(48,49,79,0.1); border-radius: 10px; }
.dp-mem-tag { font-size: 14px; letter-spacing: 0.12em; text-transform: uppercase; color: #30314F; margin-bottom: 4px; }
.dp-mem-title { font-family: 'Romie',serif; font-size: 0.9375rem; color: #30314F; margin-bottom: 5px; line-height: 1.3; }
.dp-mem-text { font-size: 14px; color: #30314F; line-height: 1.65; }
.dp-mem-date { margin-top: 6px; font-size: 14px; color: #30314F; }

/* gift history */
.dp-gift-row { display: grid; grid-template-columns: 42px 1fr auto; gap: 10px; align-items: center; padding: 10px 14px; background: #fff; border: 1px solid rgba(48,49,79,0.1); border-radius: 10px; }
.dp-gift-year { font-family: 'Romie',serif; font-size: 1rem; color: #30314F; }
.dp-gift-name { font-family: 'Romie',serif; font-size: 0.875rem; color: #30314F; line-height: 1.25; }
.dp-gift-occ { font-size: 14px; color: #30314F; margin-top: 1px; }
.dp-gift-tag { font-size: 14px; padding: 2px 8px; border-radius: 10px; background: #EAE5DB; border: 1px solid rgba(48,49,79,0.1); color: #30314F; white-space: nowrap; }
.dp-gift-tag.hit { background: rgba(204,211,55,0.14); border-color: rgba(204,211,55,0.3); color: #6E751F; }

/* simple stacked list (constants / what-happens) */
.dp-stack { display: flex; flex-direction: column; gap: 7px; }
.dp-stack-row { display: flex; gap: 10px; align-items: flex-start; padding: 10px 13px; background: #fff; border: 1px solid rgba(48,49,79,0.1); border-radius: 10px; }
.dp-stack-dot { width: 5px; height: 5px; border-radius: 50%; background: #B22452; margin-top: 7px; flex-shrink: 0; }
.dp-stack-text { font-size: 14px; color: #30314F; line-height: 1.55; }
.dp-stack-text strong { color: #30314F; font-weight: 600; }

.dp-add-btn { width: 100%; padding: 10px; background: transparent; border: 1px dashed rgba(48,49,79,0.2); border-radius: 10px; color: #30314F; font-size: 14px; letter-spacing: 0.04em; cursor: pointer; margin-top: 8px; font-family: 'FuturaPT',sans-serif; }
.dp-add-btn:hover { border-color: #30314F; color: #30314F; }

/* BE READY CHAT MODAL */
.br-overlay { position: fixed; inset: 0; background: rgba(48,49,79,0.4); backdrop-filter: blur(3px); z-index: 3000; display: flex; align-items: center; justify-content: center; padding: 24px; opacity: 0; pointer-events: none; transition: opacity 0.22s; }
.br-overlay.open { opacity: 1; pointer-events: all; }
.br-modal { background: #fff; border-radius: 14px; width: 100%; max-width: 560px; max-height: 80vh; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 24px 60px rgba(48,49,79,0.22); }
.br-header { background: #30314F; padding: 18px 20px 16px; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-shrink: 0; }
.br-header-left { min-width: 0; }
.br-eyebrow { font-size: 14px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(244,239,227,0.5); margin-bottom: 4px; }
.br-title { font-family: 'Romie',serif; font-style: italic; font-size: 1.25rem; color: #F4EFE3; line-height: 1.2; }
.br-close { width: 28px; height: 28px; border-radius: 50%; background: rgba(244,239,227,0.1); border: none; cursor: pointer; color: rgba(244,239,227,0.6); font-size: 14px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.br-close:hover { background: rgba(244,239,227,0.18); color: #F4EFE3; }
.br-thread { flex: 1; overflow-y: auto; padding: 18px 20px; display: flex; flex-direction: column; gap: 14px; }
.br-ai-msg { font-size: 14px; color: #30314F; line-height: 1.65; padding: 4px 0; }
.br-ai-msg em { font-style: normal; color: #B22452; font-weight: 600; }
.br-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 2px; }
.br-chip { padding: 6px 14px; border-radius: 20px; border: 1px solid rgba(48,49,79,0.18); background: #fff; color: #30314F; font-size: 14px; cursor: pointer; font-family: 'FuturaPT',sans-serif; letter-spacing: 0.04em; transition: background 0.15s, color 0.15s; }
.br-chip:hover { background: #30314F; color: #F4EFE3; border-color: #30314F; }
.br-user-msg { display: flex; justify-content: flex-end; }
.br-user-bubble { background: #30314F; color: #F4EFE3; border-radius: 14px 4px 14px 14px; padding: 10px 14px; font-size: 14px; line-height: 1.55; max-width: 80%; }
.br-response { background: #F4EFE3; border-radius: 4px 10px 10px 10px; padding: 13px 15px; font-size: 14px; color: #30314F; line-height: 1.65; }
.br-response ul { padding-left: 1rem; margin-top: 6px; }
.br-response li { margin-bottom: 4px; }
.br-input-zone { flex-shrink: 0; padding: 12px 16px 14px; border-top: 1px solid rgba(48,49,79,0.1); display: flex; gap: 8px; align-items: center; background: #fff; }
.br-input { flex: 1; background: #F4EFE3; border: 1px solid rgba(48,49,79,0.1); border-radius: 8px; padding: 9px 12px; font-family: 'Romie',serif; font-style: italic; font-size: 14px; color: #30314F; outline: none; resize: none; }
.br-input::placeholder { color: #30314F; }
.br-send { width: 34px; height: 34px; border-radius: 8px; background: #B22452; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: opacity 0.15s; }
.br-send:hover { opacity: 0.85; }
.br-send svg { width: 12px; height: 12px; stroke: #fff; fill: none; stroke-width: 2; }
.br-footer { padding: 10px 16px 14px; border-top: 1px solid rgba(48,49,79,0.1); display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; flex-shrink: 0; border-radius: 0 0 14px 14px; }
.br-footer-wordmark { font-family: 'Romie',serif; font-style: normal; font-size: 1rem; color: #30314F; }
.br-footer-btn { font-family: 'FuturaPT',sans-serif; font-size: 14px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #F4EFE3; background: #B22452; border: none; border-radius: 6px; padding: 7px 14px; cursor: pointer; }
.br-footer-btn:hover { background: #8a1a3d; }
.dp-section-heading { font-family: 'Romie',serif; font-style: italic; font-size: 1.0625rem; color: #30314F; margin-bottom: 0.875rem; letter-spacing: 0; text-transform: none; display: flex; align-items: center; gap: 0.625rem; }
.dp-section-heading .dp-label-action { font-family: 'FuturaPT',sans-serif; font-style: normal; font-size: 14px; letter-spacing: 0.08em; text-transform: uppercase; color: #30314F; }
.dp-clean-row { display: flex; justify-content: space-between; align-items: baseline; padding: 9px 0; border-bottom: 1px solid rgba(48,49,79,0.07); gap: 1rem; }
.dp-clean-row:last-of-type { border-bottom: none; }
.dp-clean-label { font-family: 'Romie',serif; font-size: 0.9375rem; color: #30314F; line-height: 1.3; }
.dp-clean-val { font-size: 14px; color: #30314F; text-align: right; }

.dp-prompt { flex-shrink: 0; background: #fff; border-top: 1px solid rgba(48,49,79,0.1); padding: 0.6875rem 0.875rem; display: flex; gap: 0.5rem; align-items: center; }
.dp-prompt-ctx { font-size: 14px; letter-spacing: 0.08em; text-transform: uppercase; color: #30314F; padding: 4px 10px; background: #EAE5DB; border-radius: 12px; flex-shrink: 0; }
.dp-prompt-input { flex: 1; background: #F4EFE3; border: 1px solid rgba(48,49,79,0.1); border-radius: 8px; padding: 8px 12px; font-family: 'Romie',serif; font-style: italic; font-size: 14px; color: #30314F; outline: none; }
.dp-prompt-input::placeholder { color: #30314F; }
.dp-prompt-send { width: 2rem; height: 2rem; border-radius: 8px; background: #B22452; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.dp-prompt-send svg { width: 11px; height: 11px; stroke: #fff; fill: none; stroke-width: 2; }
.dp-add-photo { font-family: 'FuturaPT','Futura',sans-serif; font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(244,239,227,0.55); background: rgba(244,239,227,0.08); border: 1px solid rgba(244,239,227,0.2); border-radius: 1rem; padding: 4px 11px; cursor: pointer; white-space: nowrap; transition: color 0.15s, border-color 0.15s, background 0.15s; margin-left: auto; margin-right: 8px; flex-shrink: 0; }
.dp-add-photo:hover { color: #F4EFE3; border-color: rgba(244,239,227,0.45); background: rgba(244,239,227,0.14); }