/* CityCalc — site-wide auth control + modal (loaded on every page) */

/* Nav: sign-in button + account menu */
.cc-auth { display: inline-flex; align-items: center; }
.cc-signin-btn {
  font: inherit; font-size: .82rem; font-weight: 600; letter-spacing: .01em;
  color: var(--ink, #0A0F1C); background: var(--gold, #C29440);
  border: 1px solid var(--gold, #C29440); border-radius: 999px;
  padding: .42rem 1.05rem; cursor: pointer; transition: filter .15s ease, transform .15s ease;
}
.cc-signin-btn:hover { filter: brightness(1.06); }
.cc-acct { position: relative; }
.cc-acct-btn {
  display: inline-flex; align-items: center; gap: .5rem; font: inherit; font-size: .82rem; font-weight: 600;
  color: var(--ink-2, #172033); background: transparent; border: 1px solid var(--cream-3, #DDD5C4);
  border-radius: 999px; padding: .3rem .7rem .3rem .35rem; cursor: pointer;
}
.cc-acct-btn:hover { border-color: var(--gold-border, rgba(194,148,64,.22)); }
.cc-acct-dot {
  display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem;
  border-radius: 50%; background: var(--ink, #0A0F1C); color: var(--cream, #F7F4EE); font-size: .72rem; font-weight: 700;
}
.cc-acct-nm { max-width: 9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cc-acct-menu {
  position: absolute; top: calc(100% + .4rem); right: 0; min-width: 11rem; z-index: 1200;
  background: #fff; border: 1px solid var(--cream-3, #DDD5C4); border-radius: .6rem;
  box-shadow: 0 18px 40px rgba(10,15,28,.16); padding: .35rem; display: flex; flex-direction: column;
}
html[dir="rtl"] .cc-acct-menu { right: auto; left: 0; }
.cc-acct-link {
  font: inherit; font-size: .82rem; text-align: start; color: var(--ink-2, #172033); text-decoration: none;
  background: transparent; border: 0; border-radius: .4rem; padding: .5rem .65rem; cursor: pointer;
}
.cc-acct-link:hover { background: var(--cream, #F7F4EE); }

/* Modal */
.cc-modal-backdrop {
  position: fixed; inset: 0; z-index: 4000; display: none; align-items: flex-start; justify-content: center;
  background: rgba(10,15,28,.55); backdrop-filter: blur(3px); padding: 4vh 1rem; overflow-y: auto;
}
.cc-modal-backdrop.open { display: flex; }
.cc-modal {
  position: relative; width: 100%; max-width: 30rem; background: var(--cream, #F7F4EE);
  border: 1px solid var(--cream-3, #DDD5C4); border-radius: 1rem; padding: 1.6rem 1.6rem 1.4rem;
  box-shadow: 0 30px 80px rgba(10,15,28,.35);
}
.cc-modal-x {
  position: absolute; top: .55rem; right: .7rem; font-size: 1.6rem; line-height: 1; color: var(--ink-4, #7F92AD);
  background: transparent; border: 0; cursor: pointer;
}
html[dir="rtl"] .cc-modal-x { right: auto; left: .7rem; }
.cc-modal-brand {
  font-family: 'Playfair Display', Georgia, serif; font-size: 1.35rem; color: var(--ink, #0A0F1C); margin-bottom: .8rem; letter-spacing: -.01em;
}
.cc-modal-brand strong { color: var(--gold, #C29440); font-weight: 700; }
.cc-gate-msg {
  font-size: .82rem; color: var(--ink-2, #172033); background: var(--gold-tint, rgba(194,148,64,.08));
  border: 1px solid var(--gold-border, rgba(194,148,64,.22)); border-radius: .5rem; padding: .6rem .75rem; margin-bottom: .9rem;
}
.cc-tabs { display: flex; gap: .25rem; margin-bottom: 1rem; border-bottom: 1px solid var(--cream-3, #DDD5C4); }
.cc-tab {
  font: inherit; font-size: .85rem; font-weight: 600; color: var(--ink-4, #7F92AD); background: transparent;
  border: 0; border-bottom: 2px solid transparent; padding: .5rem .65rem; cursor: pointer; margin-bottom: -1px;
}
.cc-tab.on { color: var(--ink, #0A0F1C); border-bottom-color: var(--gold, #C29440); }
.cc-pane { display: none; }
.cc-pane.on { display: block; }
.cc-lede { font-size: .85rem; color: var(--ink-3, #3B4D6B); margin: 0 0 1rem; line-height: 1.5; }
.cc-row { margin-bottom: .7rem; }
.cc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem .7rem; margin-bottom: .7rem; }
.cc-pane label { display: block; font-size: .76rem; font-weight: 600; color: var(--ink-2, #172033); }
.cc-pane input[type="text"], .cc-pane input[type="email"], .cc-pane input[type="password"],
.cc-pane input[type="tel"], .cc-pane select, .cc-pane textarea {
  width: 100%; margin-top: .25rem; font: inherit; font-size: .85rem; font-weight: 400; color: var(--ink, #0A0F1C);
  background: #fff; border: 1px solid var(--cream-3, #DDD5C4); border-radius: .45rem; padding: .5rem .6rem; box-sizing: border-box;
}
.cc-pane input:focus, .cc-pane select:focus, .cc-pane textarea:focus {
  outline: none; border-color: var(--gold, #C29440); box-shadow: 0 0 0 3px var(--gold-tint, rgba(194,148,64,.08));
}
.cc-hint { display: block; font-size: .7rem; font-weight: 400; color: var(--ink-4, #7F92AD); margin-top: .25rem; }
.cc-check { display: flex; align-items: flex-start; gap: .5rem; font-size: .76rem; font-weight: 400; color: var(--ink-2, #172033); margin: .55rem 0; line-height: 1.4; }
.cc-check input { margin-top: .15rem; }
.cc-err { font-size: .8rem; color: #B23A48; background: rgba(178,58,72,.08); border: 1px solid rgba(178,58,72,.25); border-radius: .45rem; padding: .5rem .65rem; margin: .5rem 0; }
.cc-submit {
  width: 100%; margin-top: .9rem; font: inherit; font-size: .9rem; font-weight: 700; color: var(--ink, #0A0F1C);
  background: var(--gold, #C29440); border: 0; border-radius: .55rem; padding: .7rem; cursor: pointer; transition: filter .15s ease;
}
.cc-submit:hover { filter: brightness(1.06); }
.cc-submit:disabled { opacity: .6; cursor: default; }
.cc-switch { font-size: .78rem; color: var(--ink-3, #3B4D6B); text-align: center; margin: .9rem 0 0; }
.cc-switch button { font: inherit; font-size: .78rem; font-weight: 700; color: var(--gold, #C29440); background: transparent; border: 0; cursor: pointer; padding: 0; }
@media (max-width: 480px) { .cc-grid { grid-template-columns: 1fr; } }

/* Footer newsletter sign-up */
.footer-newsletter { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.footer-newsletter input[type="email"] {
  flex: 1 1 140px; min-width: 0; padding: 9px 12px;
  border: 1px solid var(--gold-border, rgba(194,148,64,.35));
  border-radius: 8px; background: #fff; font: inherit; font-size: 13px; color: var(--ink, #0A0F1C);
}
.footer-newsletter input[type="email"]:focus { outline: none; border-color: var(--gold, #C29440); }
.footer-newsletter button {
  padding: 9px 16px; border: none; border-radius: 8px; cursor: pointer;
  background: var(--ink, #0A0F1C); color: var(--cream, #F7F4EE);
  font: inherit; font-size: 13px; font-weight: 600; transition: background .15s;
}
.footer-newsletter button:hover { background: var(--gold, #C29440); color: var(--ink, #0A0F1C); }
.footer-newsletter-msg { flex: 1 0 100%; font-size: 12px; color: var(--ink-4, #7a8597); }