/* ═══════════════════════════════════════════════════════════════
   OZANA STANDALONE CSS - TERRA CHAT WIDGET
   ═══════════════════════════════════════════════════════════════ */

html {
  height: 100dvh;
}

body.ozana-standalone-body {
  margin: 0;
  padding: 0;
  overflow: hidden;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  background-color: var(--bg, #0A0A0A);
  color: var(--text, #F2EEE6);
  transition: background-color 0.3s ease, color 0.3s ease;
}

.graticule-grid {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.055;
  background-image: linear-gradient(rgba(196, 168, 130, 0.22) 1px, transparent 1px), linear-gradient(90deg, rgba(196, 168, 130, 0.22) 1px, transparent 1px);
  background-size: 46px 46px;
}

/* Container animat "Swipe Up" la încărcare */
.ozana-container {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0; /* CRITICAL: prevents flex item from overflowing */
  padding: calc(70px + env(safe-area-inset-top)) 5vw 0 5vw;
  background: transparent;
  
  /* Swipe-up animation */
  transform: translateY(100vh);
  animation: swipeUp 0.6s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

@keyframes swipeUp {
  to { transform: translateY(0); }
}

/* Header cu buton Back stânga-sus */
.ozana-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background-color: var(--bg);
  padding-top: max(1rem, env(safe-area-inset-top));
  padding-bottom: 0.5rem;
  padding-left: 5vw;
  padding-right: 5vw;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid rgba(196, 168, 130, 0.1);
  box-shadow: 0 4px 20px rgba(0,0,0,0.2);
  transition: background-color 0.3s ease;
}

.ozana-back {
  position: relative;
  white-space: nowrap; /* Prevents wrapping on narrow screens */
  font-family: var(--ff-mono, 'JetBrains Mono', monospace);
  font-size: 0.55rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--ink, #C4A883);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  opacity: 0.85;
  transition: opacity 0.2s, background-color 0.2s;
  padding: 6px 12px;
  border: 1px solid rgba(196, 168, 130, 0.3);
  border-radius: 4px;
  background: rgba(20, 17, 11, 0.6);
}

.ozana-back:hover {
  opacity: 1;
  background: rgba(196, 168, 130, 0.12);
  border-color: var(--ink);
}

[data-theme="light"] .ozana-back {
  background: rgba(231, 221, 201, 0.6);
  border-color: rgba(90, 70, 42, 0.4);
  color: #5a462a;
}
[data-theme="light"] .ozana-back:hover {
  background: rgba(90, 70, 42, 0.1);
  border-color: #6E5022;
}

.header-spacer {
  justify-self: end;
}

.ozana-chat-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  min-height: 0; /* CRITICAL: prevents flex item from overflowing */
  max-width: 600px;
  margin: 0 auto;
  width: 100%;
  overflow: hidden;
}

.s-title {
  justify-self: center;
  font-family: var(--ff-serif, 'Cormorant Garamond', serif);
  font-size: clamp(2rem, 4dvh + 2vw, 3.2rem);
  font-weight: 300;
  letter-spacing: -0.02em;
  line-height: 0.96;
  margin: 0;
  text-align: center;
  color: var(--text, #F2EEE6);
}

.s-title em {
  font-style: italic;
  color: var(--ink, #C4A883);
}

/* Chat Panel Specific Overrides to neutralize L0 drawer from terra.css */
body.ozana-standalone-body .oz-panel {
  position: relative !important;
  bottom: auto !important;
  right: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
  box-shadow: none !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border: none !important;
  border-radius: 0 !important;
}

body.ozana-standalone-body .oz-head {
  display: none !important; /* Hide L0 head drawer header */
}

.oz-msgs {
  flex: 1;
  overflow-y: auto;
  padding: 1.1rem 0.6rem;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  scrollbar-width: none;
}
.oz-msgs::-webkit-scrollbar { display: none; }

body.ozana-standalone-body .oz-msg {
  max-width: 85%;
  padding: 0.7rem 0.9rem;
  font-size: 0.85rem;
  line-height: 1.5;
  font-weight: 400;
  font-family: var(--ff-sans, sans-serif);
  border-radius: 8px;
  box-shadow: none;
}
body.ozana-standalone-body .oz-msg b, 
body.ozana-standalone-body .oz-msg strong { 
  color: var(--ink-bright, #E7D3AC); 
  font-weight: 600; 
}
[data-theme="light"] body.ozana-standalone-body .oz-msg b, 
[data-theme="light"] body.ozana-standalone-body .oz-msg strong { 
  color: #6E5022; 
}

body.ozana-standalone-body .oz-agent {
  align-self: flex-start;
  background: rgba(196, 168, 130, 0.05) !important;
  border: 1px solid rgba(196, 168, 130, 0.2) !important;
  color: var(--text, #F2EEE6) !important;
}

body.ozana-standalone-body .oz-user {
  align-self: flex-end;
  background: var(--ink, #C4A883) !important;
  color: #0A0A0A !important;
  font-weight: 500 !important;
  border: 1px solid var(--ink, #C4A883) !important;
}

[data-theme="light"] body.ozana-standalone-body .oz-user {
  background: #6E5022 !important;
  color: #F4ECDB !important;
  border-color: #6E5022 !important;
}

.oz-typing {
  align-self: flex-start;
  display: flex;
  gap: 5px;
  padding: 0.7rem 0.9rem;
}
.oz-typing i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(196, 168, 130, 0.4);
  animation: ozb 1s infinite;
}
.oz-typing i:nth-child(2) { animation-delay: 0.15s; }
.oz-typing i:nth-child(3) { animation-delay: 0.3s; }

@keyframes ozb { 0%, 100% { opacity: 0.25; } 50% { opacity: 1; } }

.oz-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.6rem 0;
  justify-content: center;
}

body.ozana-standalone-body .oz-chip {
  font-family: var(--ff-mono, 'JetBrains Mono', monospace) !important;
  font-size: 0.52rem !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  padding: 0.45rem 0.75rem !important;
  border: 1px solid rgba(196, 168, 130, 0.3) !important;
  color: var(--text-mut, rgba(242, 238, 230, 0.6)) !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  background: transparent !important;
  border-radius: 4px !important;
}
body.ozana-standalone-body .oz-chip:hover { 
  border-color: var(--ink, #C4A883) !important; 
  color: var(--text, #F2EEE6) !important; 
  box-shadow: 0 0 8px rgba(196, 168, 130, 0.2) !important;
}
body.ozana-standalone-body .oz-chip:active, 
body.ozana-standalone-body .oz-chip.active {
  background: var(--ink, #C4A883) !important;
  color: #0A0A0A !important;
  box-shadow: 0 0 15px rgba(196, 168, 130, 0.5) !important;
  transform: scale(0.95) !important;
}

[data-theme="light"] body.ozana-standalone-body .oz-chip {
  border-color: rgba(90, 70, 42, 0.3) !important;
  color: var(--text-mut) !important;
}
[data-theme="light"] body.ozana-standalone-body .oz-chip:hover {
  border-color: #6E5022 !important;
  color: var(--text) !important;
}
[data-theme="light"] body.ozana-standalone-body .oz-chip:active, 
[data-theme="light"] body.ozana-standalone-body .oz-chip.active {
  background: #6E5022 !important;
  color: #F4ECDB !important;
  border-color: #6E5022 !important;
}

/* Media Actions Bar (GPS, Camera, Gallery) - positioned above input row */
body.ozana-standalone-body .oz-actions {
  display: flex !important;
  gap: 8px !important;
  padding: 8px 0 !important;
  border-top: 1px solid var(--border, rgba(196, 168, 130, 0.15)) !important;
  width: 100% !important;
  background: transparent !important;
}

body.ozana-standalone-body .oz-act {
  width: 32px !important;
  height: 32px !important;
  border: 1px solid rgba(196, 168, 130, 0.25) !important;
  color: var(--ink, #C4A883) !important;
  background: rgba(196, 168, 130, 0.05) !important;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  transition: all 0.2s ease;
}
body.ozana-standalone-body .oz-act:hover {
  background: rgba(196, 168, 130, 0.15) !important;
  border-color: var(--ink, #C4A883) !important;
}
body.ozana-standalone-body .oz-act svg {
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
}

[data-theme="light"] body.ozana-standalone-body .oz-act {
  border-color: rgba(90, 70, 42, 0.25) !important;
  color: #6E5022 !important;
  background: rgba(90, 70, 42, 0.05) !important;
}
[data-theme="light"] body.ozana-standalone-body .oz-act:hover {
  background: rgba(90, 70, 42, 0.12) !important;
  border-color: #6E5022 !important;
}

/* Input row with ONLY input and send button */
body.ozana-standalone-body .oz-standalone-input-row {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 8px 0;
  padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
  background: transparent;
  width: 100%;
}

body.ozana-standalone-body .oz-standalone-input {
  flex: 1;
  background: none !important;
  border: none !important;
  border-bottom: 1px solid var(--border, rgba(196, 168, 130, 0.24)) !important;
  color: var(--text, #F2EEE6) !important;
  font-family: var(--ff-serif, 'Cormorant Garamond', serif) !important;
  font-size: 1.1rem !important;
  padding: 0.5rem 0 !important;
  outline: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  height: auto !important;
  transition: border-color 0.2s ease;
}
body.ozana-standalone-body .oz-standalone-input::placeholder { color: var(--text-mut, rgba(242, 238, 230, 0.4)); opacity: 0.8; font-style: italic; }
body.ozana-standalone-body .oz-standalone-input:focus { border-color: var(--ink, #C4A883) !important; }

body.ozana-standalone-body .oz-send {
  width: 36px;
  height: 36px;
  border: 1px solid rgba(196, 168, 130, 0.4) !important;
  color: var(--ink, #C4A883) !important;
  cursor: pointer;
  flex: none;
  transition: 0.2s;
  background: transparent !important;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
}
body.ozana-standalone-body .oz-send:hover { background: var(--ink, #C4A883) !important; color: #0A0A0A !important; }

[data-theme="light"] body.ozana-standalone-body .oz-send {
  border-color: rgba(90, 70, 42, 0.4) !important;
  color: #6E5022 !important;
}
[data-theme="light"] body.ozana-standalone-body .oz-send:hover {
  background: #6E5022 !important;
  color: #F4ECDB !important;
}

/* WhatsApp / Reserve links in messages */
.oz-wa-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background-color: transparent;
  color: #5cba5c !important;
  text-decoration: none;
  padding: 0.6rem 1.5rem;
  border-radius: 4px;
  font-family: var(--ff-mono, 'JetBrains Mono', monospace);
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-top: 1rem;
  transition: all 0.25s ease;
  border: 1px solid rgba(92, 186, 92, 0.5);
}
.oz-wa-btn:hover {
  background-color: rgba(92, 186, 92, 0.15);
  border-color: #5cba5c;
}

.oz-reserve-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background-color: transparent;
  color: var(--ink, #C4A883) !important;
  text-decoration: none;
  padding: 0.6rem 1.5rem;
  border-radius: 4px;
  font-family: var(--ff-mono, 'JetBrains Mono', monospace);
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-top: 1rem;
  transition: all 0.25s ease;
  border: 1px solid rgba(196, 168, 130, 0.5);
}
.oz-reserve-btn:hover {
  background-color: rgba(196, 168, 130, 0.15);
  border-color: var(--ink, #C4A883);
}

[data-theme="light"] .oz-reserve-btn {
  color: #6E5022 !important;
  border-color: rgba(90, 70, 42, 0.5);
}
[data-theme="light"] .oz-reserve-btn:hover {
  background-color: rgba(90, 70, 42, 0.12);
  border-color: #6E5022;
}

/* AI Badge */
.ai-badge {
  font-family: var(--ff-mono, 'JetBrains Mono', monospace);
  font-size: 0.22em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.0em;
  height: 2.0em;
  border: 1px solid var(--ink, #C4A883);
  border-radius: 50%;
  vertical-align: super;
  margin-left: 0.3em;
  color: var(--ink, #C4A883);
  font-weight: 600;
  text-transform: none;
  font-style: normal;
  animation: pulseAi 2s infinite cubic-bezier(0.4, 0, 0.6, 1);
}

@keyframes pulseAi {
  0% { box-shadow: 0 0 0 0 rgba(196, 168, 130, 0.6); }
  70% { box-shadow: 0 0 0 6px rgba(196, 168, 130, 0); }
  100% { box-shadow: 0 0 0 0 rgba(196, 168, 130, 0); }
}

body.ozana-standalone-body .theme-toggle {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: scale(0.8) !important;
  transform-origin: center right !important;
  margin: 0 !important;
  opacity: 0.85 !important;
  z-index: 10 !important;
}

@media (max-width: 600px) {
  .ozana-header { justify-content: center; }
}

/* Ascunde tag-ul <think> din output-ul LLM-ului */
think {
  display: none !important;
}
