/* Avelia · stiluri de bază. Stilurile de componentă trăiesc inline (port fidel
   al prototipului de design); aici stau doar reset-ul, rama aplicației,
   controalele native re-stilizate și animațiile. */

html, body {
  margin: 0; padding: 0; height: 100%;
  background: #E8DFCD;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

/* Spațiul de sus: pe desktop rama imită un telefon cu bara de stare (58px);
   pe telefon bara de stare reală e deasupra, deci rămâne doar o margine mică. */
:root { --av-top: 58px; }
@media (max-width: 480px) {
  :root { --av-top: calc(env(safe-area-inset-top, 0px) + 18px); }
  html, body { background: #F1E9DC; }
}
body {
  font-family: "Geist", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
button { font-family: inherit; }
input, textarea { font-family: inherit; }

/* Rama aplicației: pe mobil umple ecranul, pe desktop e centrată ca un telefon */
#root { height: 100dvh; display: flex; align-items: stretch; justify-content: center; }
.avelia-frame {
  position: relative;
  width: 100%; max-width: 402px; height: 100%;
  background: #F1E9DC;
  overflow: hidden;
}
@media (min-width: 480px) and (min-height: 700px) {
  #root { align-items: center; padding: 24px 0; }
  .avelia-frame {
    height: min(874px, calc(100dvh - 48px));
    border-radius: 36px;
    box-shadow: 0 24px 80px rgba(50,35,18,0.18), 0 2px 8px rgba(50,35,18,0.10),
                inset 0 0 0 1px rgba(60,40,20,0.06);
  }
}

/* Ascundem scrollbar-urile, păstrând scroll-ul (estetică de aplicație) */
.no-scrollbar { scrollbar-width: none; }
.no-scrollbar::-webkit-scrollbar { display: none; }

/* Slider nativ re-stilizat (verificarea zilnică) */
input[type="range"].av-slider {
  -webkit-appearance: none; appearance: none;
  width: 100%; height: 28px; background: transparent; margin: 0;
}
input[type="range"].av-slider::-webkit-slider-runnable-track {
  height: 6px; border-radius: 999px;
  background: linear-gradient(90deg, #4F6549 0%, #4F6549 var(--fill, 30%), #EBE3D2 var(--fill, 30%), #EBE3D2 100%);
}
input[type="range"].av-slider::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 22px; height: 22px; border-radius: 999px; margin-top: -8px;
  background: #FFFEFA; border: none; cursor: pointer;
  box-shadow: 0 3px 8px rgba(60,40,20,0.18), inset 0 0 0 1px rgba(60,40,20,0.10);
}
input[type="range"].av-slider::-moz-range-track {
  height: 6px; border-radius: 999px; background: #EBE3D2;
}
input[type="range"].av-slider::-moz-range-progress {
  height: 6px; border-radius: 999px; background: #4F6549;
}
input[type="range"].av-slider::-moz-range-thumb {
  width: 22px; height: 22px; border-radius: 999px;
  background: #FFFEFA; border: none; cursor: pointer;
  box-shadow: 0 3px 8px rgba(60,40,20,0.18), inset 0 0 0 1px rgba(60,40,20,0.10);
}

/* Textarea pentru „Alte observații" */
textarea.av-notes {
  width: 100%; border: none; outline: none; resize: none;
  background: transparent; padding: 0;
  font-family: "Geist", system-ui, sans-serif;
  font-size: 13.5px; line-height: 1.5; color: #2D2823;
}
textarea.av-notes::placeholder { color: #A39A8B; }

/* Input parolă / căutare (onboarding) */
input.av-input {
  flex: 1; min-width: 0; border: none; outline: none; background: transparent;
  font-size: 17px; color: #1F1B17; letter-spacing: 0.12em; padding: 0;
}
input.av-input.av-input--plain { font-size: 14px; letter-spacing: normal; }
input.av-input::placeholder { color: #A39A8B; letter-spacing: normal; }

/* Input invizibil pentru codul de pacient */
input.av-code-input {
  position: absolute; inset: 0; width: 100%; height: 100%;
  opacity: 0; border: none; outline: none; background: transparent;
  font-size: 16px; caret-color: transparent; color: transparent;
}

/* Tranziții blânde între ecrane */
@keyframes av-fade-up { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.av-screen-enter { animation: av-fade-up .32s cubic-bezier(.22,.8,.36,1) both; }

@keyframes av-fade { from { opacity: 0; } to { opacity: 1; } }
.av-fade-in { animation: av-fade .28s ease both; }

/* Flash de captură foto */
@keyframes av-flash { 0% { opacity: 0.9; } 100% { opacity: 0; } }
.av-flash { animation: av-flash .45s ease-out both; pointer-events: none; }

/* Pulsa discretă pentru punctul de notificare */
@keyframes av-pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.25); } }