/* AmanDagat Live Sky & Sea v1.
 * Sources: supplied /sunset/ screenshot and original forecast components.
 * Opt-in scope: add this ID to the existing page-content wrapper only after
 * inspecting page-sunset.php on staging. This is not an automatic installer.
 * No changes to forecast JavaScript, values, booking handlers or logo assets.
 */
#amandagat-sky-sea {
  --ink:#0c2340; --deep:#0c2340; --night:#0c2340;
  --limewash:#f4f8f9; --sand:#fff; --white:#fff;
  --brass:#14549e; --brass-light:#d6a8a8;
  --display:'Fraunces',Georgia,serif;
  --body:'Karla','Segoe UI',sans-serif;
  color:#0c2340; background:#f4f8f9;
  font-family:var(--body); font-size:17px; line-height:1.7;
}
#amandagat-sky-sea :is(h1,h2,h3) {
  font-family:var(--display); font-weight:400;
  letter-spacing:-.025em; line-height:1.15;
}
#amandagat-sky-sea h1 { color:#0c2340; font-size:clamp(38px,4.5vw,56px); }
#amandagat-sky-sea h1 em { color:#14549e; }
#amandagat-sky-sea :focus-visible { outline:3px solid #14549e; outline-offset:5px; }
#amandagat-sky-sea :is(.sfx-card,.stars-cal) :focus-visible { outline-color:#d6a8a8; }
#amandagat-sky-sea :is(.sfx-card,.stars-cal,.wave-status) {
  box-shadow:0 14px 38px rgba(12,35,64,.12);
}
#amandagat-sky-sea .sunset-forecast { background:#f4f8f9; }
#amandagat-sky-sea .sfx-card {
  background:radial-gradient(ellipse at 100% 0%,rgba(214,168,168,.24),transparent 60%),
    linear-gradient(120deg,#0c2340,#14549e);
  color:#fff;
}
#amandagat-sky-sea :is(.sfx-head .t,.ws-head .t,.stars-cal .t) {
  font:700 12px/1.5 var(--body); letter-spacing:.18em; opacity:1;
}
#amandagat-sky-sea .sfx-head .t { color:#f4f8f9; }
#amandagat-sky-sea .sfx-gauge .num b { font-size:48px; }
#amandagat-sky-sea .sfx-gauge .num span { font-size:11px; opacity:1; }
#amandagat-sky-sea #sfxArc { stroke:#d6a8a8; }
#amandagat-sky-sea :is(.sfx-text h3,.ws-text h3) { font-size:clamp(28px,3vw,36px); }
#amandagat-sky-sea .sfx-text h3 { color:#fff; }
#amandagat-sky-sea .sfx-text h3 em { color:#d6a8a8; }
#amandagat-sky-sea :is(.sfx-text p,.ws-text p) { font-size:17px; line-height:1.7; opacity:1; }
#amandagat-sky-sea .sfx-text p { color:#f4f8f9; }
#amandagat-sky-sea .sfx-stats { background:rgba(12,35,64,.22); border-color:rgba(244,248,249,.25); }
#amandagat-sky-sea .sfx-stats div { border-color:rgba(244,248,249,.25); }
#amandagat-sky-sea :is(.sfx-stats b,.ws-stats b) { font-size:24px; line-height:1.4; }
#amandagat-sky-sea :is(.sfx-stats span,.ws-stats span) { font-size:11px; letter-spacing:.12em; opacity:1; }
#amandagat-sky-sea :is(.sfx-note,.ws-note) { font-size:12px; line-height:1.5; opacity:1; }
#amandagat-sky-sea .sfx-note { background:rgba(12,35,64,.22); color:#e6eef4; }
#amandagat-sky-sea .stars-cal { background:#0c2340; color:#f4f8f9; }
#amandagat-sky-sea .stars-cal .t { color:#d6a8a8; }
#amandagat-sky-sea .stars-cal h3 { color:#fff; font-size:clamp(25px,2.5vw,30px); }
#amandagat-sky-sea .stars-cal h3 em { color:#d6a8a8; }
#amandagat-sky-sea .moon-day { background:rgba(244,248,249,.06); border-color:rgba(244,248,249,.24); }
#amandagat-sky-sea .moon-day.best { background:rgba(214,168,168,.13); border-color:#d6a8a8; }
#amandagat-sky-sea .moon-day b { font-size:15px; letter-spacing:.02em; }
#amandagat-sky-sea .moon-day span { font-size:12px; line-height:1.5; letter-spacing:0; opacity:1; }
#amandagat-sky-sea .moon-day .flag { color:#0c2340; background:#d6a8a8; font-size:10px; letter-spacing:.05em; box-shadow:none; }
/* Keep the original moon-phase geometry; recolour its SVG fills only. */
#amandagat-sky-sea .moon-day .m svg circle:first-child { fill:#0c2340; stroke:#d6a8a8; }
#amandagat-sky-sea .moon-day .m svg :is(path,circle:not(:first-child)) { fill:#f4f8f9; }
#amandagat-sky-sea .wave-status { background:linear-gradient(125deg,#fff,#e5eef5); color:#0c2340; }
#amandagat-sky-sea .ws-head .t { color:#14549e; }
#amandagat-sky-sea .ws-icon { background:#e5eef5; border-color:#14549e; }
#amandagat-sky-sea .ws-icon svg { stroke:#14549e; }
#amandagat-sky-sea .ws-text h3 { color:#0c2340; }
#amandagat-sky-sea .ws-text h3 em { color:#14549e; }
#amandagat-sky-sea .ws-text p { color:#44515d; }
#amandagat-sky-sea .ws-stats { background:#e5eef5; border-color:#ccd6df; }
#amandagat-sky-sea .ws-stats div { border-color:#ccd6df; }
#amandagat-sky-sea .ws-note { background:#e5eef5; color:#44515d; }
#amandagat-sky-sea .btn {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; font:700 12px/1.4 var(--body) !important;
  text-align:center; white-space:normal;
}
#amandagat-sky-sea .btn-brass { background:#14549e; color:#fff !important; box-shadow:none; border:1px solid #14549e; }
#amandagat-sky-sea .sfx-card .btn-brass { background:#fff; color:#14549e !important; border-color:#fff; }
#amandagat-sky-sea .btn-brass:hover { background:#0c2340; color:#fff !important; border-color:#0c2340; }
#amandagat-sky-sea .sfx-card .btn-brass:hover { background:#d6a8a8; color:#0c2340 !important; border-color:#d6a8a8; }
#amandagat-sky-sea .btn-ghost { background:transparent; color:#14549e; border:1px solid #14549e; }
#amandagat-sky-sea .btn-ghost:hover { background:#14549e; color:#fff; }
@media(max-width:800px) {
  /* Keep the existing wrapped moon row balanced as the text grows. */
  #amandagat-sky-sea .moon-day { min-width:0; flex:0 0 calc(33.333% - 8px); }
  #amandagat-sky-sea .moon-row { row-gap:22px; }
}
@media(max-width:720px) {
  #amandagat-sky-sea :is(.sfx-head .t,.ws-head .t,.stars-cal .t) { font-size:11px; letter-spacing:.12em; }
  #amandagat-sky-sea .sfx-gauge .num b { font-size:34px; }
  #amandagat-sky-sea .sfx-gauge .num span { font-size:9px; }
  #amandagat-sky-sea :is(.sfx-text h3,.ws-text h3) { font-size:29px; }
  #amandagat-sky-sea .stars-cal h3 { font-size:26px; margin-bottom:26px; }
  #amandagat-sky-sea :is(.sfx-text p,.ws-text p) { font-size:17px; }
  #amandagat-sky-sea :is(.sfx-stats b,.ws-stats b) { font-size:21px; }
  #amandagat-sky-sea :is(.sfx-stats span,.ws-stats span) { font-size:10px; letter-spacing:.08em; }
  #amandagat-sky-sea :is(.sfx-note,.ws-note) { font-size:11px; }
  #amandagat-sky-sea .moon-row { row-gap:22px; }
  #amandagat-sky-sea .moon-day { min-width:0; }
  #amandagat-sky-sea .moon-day b { font-size:14px; }
  #amandagat-sky-sea .moon-day span { font-size:11px; }
  #amandagat-sky-sea .moon-day .flag { font-size:9px; padding-inline:7px; }
  #amandagat-sky-sea .ws-stats div { min-width:50%; }
  #amandagat-sky-sea .ws-stats div:last-child { flex-basis:100%; }
}
@media(max-width:380px) {
  #amandagat-sky-sea .moon-day { flex-basis:calc(50% - 4px); }
}