@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --paper: #fbf7f0; --sand: #f2e9db; --line: #e4d6c0; --line-soft: #efe5d4;
  --ink: #2b2620; --ink-2: #4a4034; --muted: #756857;
  --green: #2e5e52; --green-deep: #234a41; --green-dark: #18352e;
  --clay: #bf6f44; --gold: #b9965c; --sky: #5a8f8a;
  --white: #fff; --cream: #f6efe2;
  --radius: 16px; --radius-sm: 11px; --pill: 999px;
  --shadow: 0 18px 44px rgba(43,38,32,.12); --shadow-soft: 0 12px 30px rgba(43,38,32,.08);
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, system-ui, -apple-system, "Segoe UI", Arial, sans-serif; color: var(--ink); background: var(--paper); -webkit-font-smoothing: antialiased; }
h1,h2,h3 { font-family: Fraunces, Georgia, serif; font-weight: 600; letter-spacing: -.01em; margin: 0; }
a { color: inherit; }

/* ---------------- Auth screens ---------------- */
.auth-body { min-height: 100vh; display: grid; place-items: center; padding: 24px;
  background: radial-gradient(1100px 600px at 80% -10%, rgba(185,150,92,.16), transparent 60%), linear-gradient(160deg, var(--green-dark), var(--green-deep)); }
.auth-wrap { width: min(420px, 100%); }
.auth-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 32px 30px; }
.auth-logo { margin-bottom: 18px; }
.auth-logo img { width: 210px; height: auto; }
.auth-card h1 { font-size: 1.5rem; margin-bottom: 6px; }
.auth-sub { color: var(--muted); font-size: .94rem; margin: 0 0 20px; line-height: 1.55; }
.auth-card label { display: block; font-size: .82rem; font-weight: 700; margin: 14px 0 6px; }
.auth-card input { width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper); font: inherit; min-height: 46px; }
.auth-card input:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(46,94,82,.18); background: #fff; }
.auth-btn { display: inline-flex; align-items: center; justify-content: center; width: 100%; margin-top: 20px; min-height: 48px; border: none; border-radius: var(--pill); background: var(--green); color: var(--cream); font-weight: 600; font-size: 1rem; cursor: pointer; text-decoration: none; transition: background .16s ease; }
.auth-btn:hover { background: var(--green-dark); }
.auth-err { background: rgba(191,111,68,.12); border: 1px solid rgba(191,111,68,.32); color: #9a5226; border-radius: var(--radius-sm); padding: 11px 14px; font-size: .9rem; font-weight: 600; }
.auth-foot { text-align: center; color: rgba(246,239,226,.7); font-size: .8rem; margin-top: 16px; }

/* ---------------- Dashboard shell ---------------- */
.adm-top { position: sticky; top: 0; z-index: 20; background: var(--green-dark); color: var(--cream); }
.adm-top__in { max-width: 1240px; margin: 0 auto; display: flex; align-items: center; gap: 16px; padding: 14px 24px; flex-wrap: wrap; }
.adm-brand { display: flex; align-items: center; gap: 12px; font-family: Fraunces, serif; font-size: 1.15rem; font-weight: 600; }
.adm-brand .dot { width: 34px; height: 34px; border-radius: 50%; background: rgba(246,239,226,.12); display: grid; place-items: center; }
.adm-brand .dot svg { width: 20px; height: 20px; }
.adm-top__spacer { flex: 1; }
.adm-range { display: flex; gap: 4px; background: rgba(246,239,226,.1); border-radius: var(--pill); padding: 4px; }
.adm-range a { padding: 7px 14px; border-radius: var(--pill); font-size: .84rem; font-weight: 600; color: rgba(246,239,226,.8); text-decoration: none; white-space: nowrap; }
.adm-range a.is-active { background: var(--cream); color: var(--green-deep); }
.adm-logout { color: rgba(246,239,226,.85); text-decoration: none; font-weight: 600; font-size: .86rem; border: 1px solid rgba(246,239,226,.22); border-radius: var(--pill); padding: 7px 14px; }
.adm-logout:hover { background: rgba(246,239,226,.1); }

.adm-main { max-width: 1240px; margin: 0 auto; padding: 26px 24px 60px; }
.adm-head { margin: 6px 0 22px; }
.adm-head h1 { font-size: 1.9rem; }
.adm-head p { color: var(--muted); margin: 6px 0 0; }

/* KPI cards */
.adm-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 26px; }
.kpi { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 20px; box-shadow: var(--shadow-soft); }
.kpi__label { color: var(--muted); font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; display: flex; align-items: center; gap: 8px; }
.kpi__label svg { width: 16px; height: 16px; color: var(--clay); }
.kpi__value { font-family: Fraunces, serif; font-size: 2.1rem; font-weight: 600; color: var(--green-deep); line-height: 1.1; margin-top: 8px; }
.kpi__sub { color: var(--muted); font-size: .82rem; margin-top: 4px; }

/* Panels grid */
.adm-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
.card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 22px; box-shadow: var(--shadow-soft); min-width: 0; }
.card h2 { font-size: 1.15rem; margin-bottom: 4px; }
.card .card__sub { color: var(--muted); font-size: .82rem; margin: 0 0 14px; }
.col-12 { grid-column: span 12; } .col-8 { grid-column: span 8; } .col-6 { grid-column: span 6; }
.col-4 { grid-column: span 4; } .col-5 { grid-column: span 5; } .col-7 { grid-column: span 7; }
.chart-wrap { position: relative; width: 100%; }
.chart-wrap.h-tall { height: 300px; } .chart-wrap.h-mid { height: 240px; } .chart-wrap.h-short { height: 210px; }

/* Bar list (geo, referrers) */
.barlist { display: grid; gap: 11px; }
.barlist__row { display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; align-items: center; }
.barlist__row .lab { font-size: .9rem; font-weight: 600; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.barlist__row .val { font-size: .86rem; font-weight: 700; color: var(--green-deep); }
.barlist__track { grid-column: 1 / -1; height: 8px; border-radius: var(--pill); background: var(--sand); overflow: hidden; }
.barlist__fill { height: 100%; border-radius: var(--pill); background: linear-gradient(90deg, var(--clay), var(--gold)); }
.muted-empty { color: var(--muted); font-size: .9rem; padding: 10px 0; }

/* Condo table */
.adm-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.adm-table th { text-align: left; color: var(--muted); font-size: .74rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: 0 10px 10px; border-bottom: 1px solid var(--line); }
.adm-table th.num, .adm-table td.num { text-align: right; }
.adm-table td { padding: 12px 10px; border-bottom: 1px solid var(--line-soft); }
.adm-table tr:last-child td { border-bottom: none; }
.adm-table .cname { font-weight: 600; }
.adm-table .cid { color: var(--clay); font-weight: 700; font-size: .78rem; }
.pillnum { display: inline-block; min-width: 30px; text-align: center; background: rgba(46,94,82,.1); color: var(--green-deep); border-radius: var(--pill); padding: 3px 9px; font-weight: 700; font-size: .82rem; }

/* Recent feed */
.feed { display: grid; gap: 2px; max-height: 360px; overflow: auto; }
.feed__row { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; padding: 10px 4px; border-bottom: 1px solid var(--line-soft); }
.feed__row:last-child { border-bottom: none; }
.feed__ico { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; }
.feed__ico svg { width: 15px; height: 15px; }
.feed__ico.view { background: rgba(46,94,82,.12); color: var(--green-deep); }
.feed__ico.request { background: rgba(191,111,68,.16); color: var(--clay); }
.feed__main { min-width: 0; }
.feed__main b { font-weight: 600; }
.feed__meta { color: var(--muted); font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.feed__time { color: var(--muted); font-size: .78rem; white-space: nowrap; }

/* Inquiries inbox */
.inbox { display: grid; gap: 12px; }
.inbox__row { border: 1px solid var(--line-soft); border-left: 3px solid var(--clay); border-radius: var(--radius-sm); padding: 14px 16px; background: var(--paper); }
.inbox__top { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.inbox__name { font-weight: 700; font-size: 1rem; }
.inbox__condo { color: var(--green-deep); font-weight: 600; font-size: .8rem; background: rgba(46,94,82,.1); border-radius: var(--pill); padding: 3px 10px; }
.inbox__when { color: var(--muted); font-size: .8rem; margin-left: auto; }
.inbox__meta { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 8px; font-size: .9rem; color: var(--ink-2); }
.inbox__meta strong { color: var(--muted); font-weight: 700; }
.inbox__contact { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 8px; }
.inbox__contact a { color: var(--green-deep); font-weight: 600; font-size: .88rem; }
.inbox__msg { margin: 10px 0 0; color: var(--muted); font-size: .92rem; border-top: 1px dashed var(--line); padding-top: 10px; white-space: pre-wrap; }

/* Settings / users */
.adm-msg { border-radius: var(--radius-sm); padding: 12px 16px; font-weight: 600; font-size: .92rem; margin-bottom: 18px; }
.adm-msg.is-ok { background: rgba(46,94,82,.12); border: 1px solid rgba(46,94,82,.28); color: var(--green-deep); }
.adm-msg.is-err { background: rgba(191,111,68,.12); border: 1px solid rgba(191,111,68,.32); color: #9a5226; }
.setform { display: grid; gap: 4px; }
.setform label { font-size: .8rem; font-weight: 700; margin-top: 10px; color: var(--ink-2); }
.setform input { width: 100%; padding: 11px 13px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper); font: inherit; min-height: 44px; }
.setform input:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(46,94,82,.16); background: #fff; }
.setform button, .btn-mini { margin-top: 14px; border: none; border-radius: var(--pill); background: var(--green); color: var(--cream); font-weight: 600; padding: 11px 20px; cursor: pointer; font-size: .92rem; }
.setform button:hover, .btn-mini:hover { background: var(--green-dark); }
.users-table td { vertical-align: middle; }
.users-table .you { font-size: .7rem; font-weight: 700; color: var(--clay); background: rgba(191,111,68,.12); border-radius: var(--pill); padding: 2px 8px; margin-left: 6px; text-transform: uppercase; letter-spacing: .05em; }
.inline-form { display: flex; gap: 8px; align-items: center; margin: 0; }
.inline-form input { padding: 8px 11px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper); font: inherit; min-height: 38px; max-width: 170px; }
.btn-mini { margin-top: 0; padding: 8px 14px; font-size: .84rem; }
.btn-danger { background: transparent; color: #9a5226; border: 1px solid rgba(191,111,68,.4); }
.btn-danger:hover { background: rgba(191,111,68,.1); }

/* Rates editor */
.rates-table td, .rates-table th { vertical-align: middle; }
.rates-table td.cname { font-weight: 600; color: var(--ink-1); }
.rates-table .rate-in { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper); padding: 0 12px; max-width: 150px; }
.rates-table .rate-in > span { color: var(--muted); font-weight: 700; }
.rates-table .rate-in input { width: 100%; border: none; background: transparent; padding: 10px 0; min-height: 42px; font: inherit; }
.rates-table .rate-in:focus-within { border-color: var(--green); box-shadow: 0 0 0 3px rgba(46,94,82,.16); background: #fff; }
.rates-table .rate-in input:focus { outline: none; }

/* Content / availability / seasons editors */
.setform .check { display: flex; align-items: center; gap: 10px; font-size: .92rem; font-weight: 600; color: var(--ink-1); margin-top: 4px; }
.setform .check input { width: auto; min-height: 0; }
.setgrid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; }
.setform select { width: 100%; padding: 11px 13px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper); font: inherit; min-height: 44px; }
.statusrow { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.statusrow .cid { flex: 0 0 46px; font-weight: 700; color: var(--muted); }
.statusrow input { flex: 1 1 auto; }
.avail-block { border: 1px solid var(--line-soft); border-radius: var(--radius-sm); padding: 12px 14px; margin-top: 12px; background: var(--paper); }
.avail-block__title { margin: 0 0 8px; font-weight: 700; font-size: .9rem; }
.daterow { display: inline-flex; align-items: center; gap: 8px; margin: 4px 10px 4px 0; }
.daterow input { padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: #fff; font: inherit; min-height: 40px; }
.daterow span { color: var(--muted); font-size: .82rem; }
.season-block { border: 1px solid var(--line-soft); border-radius: var(--radius-sm); padding: 12px 14px; margin-top: 12px; background: var(--paper); }
.season-block__head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-bottom: 8px; }
.season-block__head > input[type=text] { flex: 1 1 200px; }
.season-rates { margin-top: 6px; }
.season-rates .rate-in { max-width: 130px; }
@media (max-width: 640px) { .setgrid2 { grid-template-columns: 1fr; } }

/* Inbox delete button */
.inbox__del { margin-left: 10px; width: 30px; height: 30px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 8px; background: var(--white); color: var(--muted); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: color .15s, background .15s, border-color .15s; }
.inbox__del svg { width: 15px; height: 15px; }
.inbox__del:hover { color: #9a5226; border-color: rgba(191,111,68,.45); background: rgba(191,111,68,.08); }

/* Inbox management: card bar, unread badge, status chips, notes */
.card__bar { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 6px; }
.card__bar h2 { margin: 0; }
.unread-badge { display: inline-block; margin-left: 8px; vertical-align: middle; font-size: .68rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--cream); background: var(--clay); border-radius: var(--pill); padding: 3px 9px; }
.btn-ghost { background: transparent; color: var(--green-deep); border: 1px solid var(--line); flex: 0 0 auto; text-decoration: none; }
.btn-ghost:hover { background: rgba(46,94,82,.08); }
.inbox__row--new { border-left-color: var(--clay); }
.inbox__row--replied { border-left-color: #b9965c; }
.inbox__row--booked { border-left-color: #2e5e52; }
.inbox__row--passed { border-left-color: var(--line); opacity: .72; }
.inbox__manage { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 12px; border-top: 1px dashed var(--line); padding-top: 12px; }
.statuschips { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.chip { border: 1px solid var(--line); background: var(--white); color: var(--ink-2); border-radius: var(--pill); padding: 5px 12px; font-size: .78rem; font-weight: 600; cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.chip:hover { border-color: var(--green); }
.chip.is-active { color: var(--cream); border-color: transparent; }
.chip--new.is-active { background: var(--clay); }
.chip--replied.is-active { background: #b9965c; }
.chip--booked.is-active { background: var(--green); }
.chip--passed.is-active { background: var(--muted); }
.inbox__note { display: inline-flex; align-items: center; gap: 8px; flex: 1 1 260px; }
.inbox__note .note-input { flex: 1 1 auto; min-width: 140px; padding: 8px 11px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper); font: inherit; min-height: 38px; }
.inbox__note .note-input:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(46,94,82,.16); background: #fff; }
.note-status { font-size: .78rem; color: var(--green-deep); font-weight: 600; }

/* Confirm modal */
.modal { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 20px; }
.modal[hidden] { display: none; }
.modal__backdrop { position: absolute; inset: 0; background: rgba(24,53,46,.55); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.modal__card { position: relative; z-index: 1; width: min(420px, 100%); background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow); padding: 30px 28px; text-align: center; animation: modalPop .16s ease-out; }
@keyframes modalPop { from { transform: translateY(8px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
.modal__icon { width: 58px; height: 58px; margin: 0 auto 14px; border-radius: 50%; display: grid; place-items: center; background: rgba(176,71,46,.12); color: #b0472e; }
.modal__icon svg { width: 27px; height: 27px; }
.modal__card h3 { font-family: Fraunces, serif; font-size: 1.4rem; margin: 0 0 8px; }
.modal__card p { color: var(--muted); margin: 0 0 22px; line-height: 1.55; }
.modal__actions { display: flex; gap: 12px; justify-content: center; }
.modal__btn { border: none; border-radius: var(--pill); padding: 12px 24px; font-weight: 600; cursor: pointer; font-size: .95rem; }
.modal__btn--ghost { background: var(--paper); border: 1px solid var(--line); color: var(--ink); }
.modal__btn--ghost:hover { background: var(--sand); }
.modal__btn--danger { background: #b0472e; color: #fff; }
.modal__btn--danger:hover { background: #8f3823; }
.modal__btn:disabled { opacity: .6; cursor: default; }

.adm-note { color: var(--muted); font-size: .82rem; margin-top: 26px; text-align: center; line-height: 1.6; }
.adm-note a { color: var(--green-deep); font-weight: 600; }

@media (max-width: 1000px) {
  .adm-kpis { grid-template-columns: repeat(2, 1fr); }
  .col-8, .col-7, .col-6, .col-5, .col-4 { grid-column: span 12; }
}
@media (max-width: 560px) {
  .adm-kpis { grid-template-columns: 1fr; }
  .adm-top__in { padding: 12px 16px; }
  .adm-main { padding: 20px 16px 50px; }
}
