/* =====================================================================
   Owners Portal pages (dashboard / bookings / request) - Tide Line.
   Ported from ownersportal/mockups. Loaded after tideline-owners.css by
   Views/Shared/_LayoutOwners.cshtml. Everything is scoped under
   body.tl-owners so staff screens are unaffected. The layout also loads
   Materialize 0.100, whose bare element rules (inputs, select, label,
   table, radio) are neutralised here with higher-specificity selectors.
   ===================================================================== */
.tl-owners {
  --op-tenant:#17A2B8; --op-owner:#28418C; --op-maint:#8A94A6; --op-pipe:#F2C037;
}

/* ---- signed-in sub navigation (works at phone width) ---------------- */
/* body{overflow-x:hidden} (tideline-owners.css) turns body into a scroll container and silently disables position:sticky for the header and this nav; clip does not. height:100% from the site css also capped body at one viewport, so sticky children stopped sticking after one screen. */
body.tl-owners { overflow-x:clip; height:auto; min-height:100%; }
/* Sticky: sits directly under the sticky site header (96px, 78px below 1000px) so it stays visible while scrolling. */
.tl-owners .op-subnav { background:#fff; border-bottom:1px solid var(--hairline); height:auto; min-height:0; position:sticky; top:96px; z-index:55; }
@media (max-width:1000px) { .tl-owners .op-subnav { top:78px; } }
.tl-owners .op-range { display:flex; flex-wrap:wrap; align-items:center; gap:.6rem .8rem; padding:1rem 1.4rem; border-bottom:1px solid var(--hairline); }
.tl-owners .op-range label { font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:#8592a8; }
.tl-owners .op-range .op-field { width:auto; margin:0; }
.tl-owners .op-range-hint { flex-basis:100%; order:9; font-size:.78rem; color:#6b7690; }
.tl-owners .op-range-reset { font-size:.8rem; color:var(--navy); text-decoration:underline; }
.tl-owners .op-subnav-in { display:flex; align-items:flex-end; gap:1.9rem; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:nowrap; scrollbar-width:none; margin-bottom:-1px; }
.tl-owners .op-subnav-in::-webkit-scrollbar { display:none; }
.tl-owners .op-subnav a {
  display:block; line-height:1.2;
  font-size:.76rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--ink);
  padding:1rem 0 .85rem; border-bottom:2px solid transparent; flex:none;
}
.tl-owners .op-subnav a:hover { color:var(--navy); border-bottom-color:var(--wave); }
.tl-owners .op-subnav a[aria-current] { color:var(--navy); border-bottom-color:var(--gold); }
@media (max-width:560px) { .tl-owners .op-subnav-in { gap:1.4rem; } .tl-owners .op-subnav a { letter-spacing:.12em; } }

.tl-owners .op { color:var(--ink); }
.tl-owners .op h2, .tl-owners .op h3, .tl-owners .op h4 { font-family:var(--tl-display); color:var(--ink); }

/* ---- stats ------------------------------------------------------------ */
.tl-owners .op-stats { display:grid; gap:1rem; margin:0 0 .6rem; }
.tl-owners .op-stats-3 { grid-template-columns:repeat(3,1fr); }
.tl-owners .op-stats-4 { grid-template-columns:repeat(4,1fr); }
.tl-owners .op-stats-5 { grid-template-columns:repeat(5,1fr); margin-top:1.6rem; }
@media (max-width:1000px) { .tl-owners .op-stats-5 { grid-template-columns:repeat(3,1fr); } }
@media (max-width:820px) { .tl-owners .op-stats-4 { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px) { .tl-owners .op-stats-5 { grid-template-columns:repeat(2,1fr); } .tl-owners .op-stats-3 { grid-template-columns:1fr; } }
.tl-owners .op-stat { background:#fff; border:1px solid var(--hairline); border-radius:6px; padding:1.15rem 1.15rem 1.2rem; position:relative; overflow:hidden; min-width:0; }
.tl-owners .op-stat::before { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--accent,var(--navy)); }
.tl-owners .op-stat .k { font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:#6b7690; }
.tl-owners .op-stat .v { font-family:var(--tl-display); font-weight:600; font-size:2.1rem; line-height:1; margin-top:.5rem; color:var(--ink); }
.tl-owners .op-stat .v small { font-family:var(--tl-body); font-weight:400; font-size:.9rem; color:#6b7690; }
.tl-owners .op-stat .sub { font-size:.74rem; color:#7a869c; margin-top:.35rem; line-height:1.35; }

/* ---- section head ------------------------------------------------------ */
.tl-owners .op-section-head { display:flex; align-items:baseline; justify-content:space-between; margin:2.4rem 0 1rem; gap:1rem; flex-wrap:wrap; }
.tl-owners .op-section-head h2 { font-weight:600; font-size:1.75rem; margin:0; }
.tl-owners .op-section-head a { font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--navy); }

/* ---- buttons ------------------------------------------------------------ */
.tl-owners .op-btn, .tl-owners a.op-btn, .tl-owners button.op-btn {
  display:inline-flex; align-items:center; gap:.5rem; font-family:var(--tl-body); font-size:.74rem; font-weight:500; letter-spacing:.14em;
  text-transform:uppercase; line-height:1.2; padding:.75rem 1.15rem; border-radius:3px; border:1px solid var(--hairline);
  background:#fff; color:var(--ink); cursor:pointer; height:auto; box-shadow:none; transition:.2s;
}
.tl-owners .op-btn:hover { border-color:var(--navy); color:var(--navy); }
.tl-owners .op-btn.primary { background:var(--navy); color:#fff; border-color:var(--navy); }
.tl-owners .op-btn.primary:hover { background:var(--ink); border-color:var(--ink); color:#fff; }
.tl-owners .op-btn.wa { border-color:#25D366; color:#128C4B; }
.tl-owners .op-actions { display:flex; gap:.7rem; flex-wrap:wrap; margin-top:auto; }

/* ---- property cards (dashboard) ---------------------------------------- */
.tl-owners .op-props { display:grid; grid-template-columns:1fr; gap:1.4rem; }
.tl-owners .op-prop { background:#fff; border:1px solid var(--hairline); border-radius:10px; overflow:hidden; display:grid; grid-template-columns:300px 1fr; box-shadow:0 1px 2px rgba(13,27,62,.05); transition:box-shadow .3s, transform .3s; }
.tl-owners .op-prop:hover { box-shadow:0 18px 44px -20px rgba(13,27,62,.28); transform:translateY(-2px); }
@media (max-width:760px) { .tl-owners .op-prop { grid-template-columns:1fr; } }
.tl-owners .op-prop-photo { position:relative; min-height:210px; background:linear-gradient(135deg,var(--foam),var(--wave)); }
.tl-owners .op-prop-photo img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; max-width:none; }
.tl-owners .op-prop-photo .ref { position:absolute; left:14px; top:14px; max-width:calc(100% - 28px); background:rgba(13,27,62,.82); color:#fff; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; padding:.4rem .7rem; border-radius:100px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tl-owners .op-prop-body { padding:1.4rem 1.5rem 1.5rem; display:flex; flex-direction:column; min-width:0; }
.tl-owners .op-prop-body h3 { font-weight:600; font-size:1.65rem; line-height:1.1; margin:0; }
.tl-owners .op-prop-body .loc { font-size:.82rem; letter-spacing:.06em; color:#7a869c; margin-top:.2rem; }
.tl-owners .op-mini { display:flex; gap:1.6rem; margin:1.1rem 0 1.2rem; flex-wrap:wrap; }
.tl-owners .op-mini .n { font-family:var(--tl-display); font-weight:600; font-size:1.5rem; line-height:1; }
.tl-owners .op-mini .n small { font-family:var(--tl-body); font-size:.8rem; font-weight:400; color:#8592a8; }
.tl-owners .op-mini .l { font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:#8592a8; margin-top:.2rem; }
.tl-owners .op-mini .pipe .n { color:#9a7400; }
.tl-owners .op-spark { display:flex; gap:3px; align-items:flex-end; height:34px; margin-bottom:1.1rem; }
.tl-owners .op-spark i { flex:1; background:var(--foam); border-radius:2px; position:relative; overflow:hidden; min-height:4px; height:100%; }
.tl-owners .op-spark i b { position:absolute; left:0; right:0; bottom:0; background:var(--op-tenant); display:block; }
.tl-owners .op-spark i.now { outline:1.5px solid var(--navy); outline-offset:1px; }

/* ---- cards / toolbar ---------------------------------------------------- */
.tl-owners .op-card { background:#fff; border:1px solid var(--hairline); border-radius:8px; overflow:hidden; margin-top:1.6rem; box-shadow:none; max-width:none; padding:0; }
.tl-owners .op-card-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.15rem 1.4rem; border-bottom:1px solid var(--hairline); flex-wrap:wrap; }
.tl-owners .op-card-head h2 { font-weight:600; font-size:1.5rem; margin:0; }
.tl-owners .op-card-body { padding:1.5rem; }
.tl-owners .op-empty { padding:2.4rem 1.4rem; text-align:center; color:#8592a8; }
.tl-owners .op-legend { display:flex; flex-wrap:wrap; gap:1rem; }
.tl-owners .op-legend span { display:inline-flex; align-items:center; gap:.45rem; font-size:.78rem; color:#42506e; }
.tl-owners .op .dot { width:12px; height:12px; border-radius:3px; flex:none; display:inline-block; }
.tl-owners .op .dot.tenant { background:var(--op-tenant); }
.tl-owners .op .dot.owner { background:var(--op-owner); }
.tl-owners .op .dot.maint { background:var(--op-maint); }
.tl-owners .op .dot.pipe { background:repeating-linear-gradient(45deg,var(--op-pipe),var(--op-pipe) 3px,#fff 3px,#fff 6px); border:1px solid var(--op-pipe); }

.tl-owners .op-toolbar { display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between; }
.tl-owners .op-prop-select { display:flex; align-items:center; gap:.8rem; margin:0; flex:1 1 320px; min-width:0; }
.tl-owners .op-prop-select label { font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:#6b7690; margin:0; }
.tl-owners .op select.browser-default,
.tl-owners .op input.browser-default,
.tl-owners .op textarea.browser-default {
  display:block; width:100%; height:auto; margin:0; box-shadow:none; box-sizing:border-box;
  font-family:var(--tl-body); font-size:1rem; font-weight:400; color:var(--ink); background-color:#fff;
  border:1px solid var(--hairline); border-radius:4px; padding:.8rem 1rem; transition:border-color .2s, box-shadow .2s;
}
.tl-owners .op select.browser-default {
  -webkit-appearance:none; appearance:none; padding-right:2.4rem; max-width:100%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2328418C' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1rem center;
}
.tl-owners .op-prop-select select.browser-default { flex:1; min-width:0; }
.tl-owners .op textarea.browser-default { min-height:96px; resize:vertical; }
.tl-owners .op select.browser-default:focus,
.tl-owners .op input.browser-default:focus,
.tl-owners .op textarea.browser-default:focus { outline:0; border-color:var(--navy); box-shadow:0 0 0 3px rgba(40,65,140,.12); }

.tl-owners .op-year { display:inline-flex; align-items:center; gap:.4rem; background:#fff; border:1px solid var(--hairline); border-radius:4px; padding:.35rem; }
.tl-owners .op-year-btn { width:40px; height:40px; border-radius:3px; color:var(--navy); display:grid; place-items:center; font-size:1.6rem; line-height:1; transition:background .2s; }
.tl-owners a.op-year-btn:hover { background:var(--foam); color:var(--navy); }
.tl-owners .op-year-btn.disabled { color:var(--silver); cursor:not-allowed; }
.tl-owners .op-year .yr { min-width:132px; text-align:center; }
.tl-owners .op-year .num { display:block; font-family:var(--tl-display); font-weight:600; font-size:1.5rem; line-height:1; color:var(--ink); }
.tl-owners .op-year .tag { display:block; font-size:.6rem; letter-spacing:.24em; text-transform:uppercase; color:var(--op-tenant); margin-top:.2rem; }

/* ---- disclaimer --------------------------------------------------------- */
.tl-owners .op-disclaimer { margin:1.4rem 0 0; background:#FFFBEE; border:1px solid rgba(242,192,55,.5); border-left:4px solid var(--gold); border-radius:4px; padding:1rem 1.2rem; display:flex; gap:.85rem; align-items:flex-start; }
.tl-owners .op-disclaimer svg { flex:none; margin-top:2px; }
.tl-owners .op-disclaimer p { font-size:.92rem; color:#5b4b16; margin:0; }
.tl-owners .op-disclaimer b { font-weight:600; color:#7a5c00; }
.tl-owners .op-disclaimer.stacked { display:block; padding:1.1rem 1.3rem; border-radius:6px; }
.tl-owners .op-disclaimer.stacked h4 { font-family:var(--tl-body); font-weight:600; font-size:.9rem; color:#7a5c00; letter-spacing:.04em; margin:0 0 .4rem; display:flex; gap:.5rem; align-items:center; }
.tl-owners .op-disclaimer.stacked p { font-size:.86rem; }

/* ---- year at a glance --------------------------------------------------- */
.tl-owners .op-glance { padding:1.4rem 1.4rem 1.7rem; }
.tl-owners .op-months { display:grid; grid-template-columns:repeat(12,1fr); gap:.5rem; align-items:end; }
@media (max-width:820px) { .tl-owners .op-months { grid-template-columns:repeat(6,1fr); row-gap:1.1rem; } }
.tl-owners .op .mo { text-align:center; min-width:0; }
.tl-owners .op .mo .bar { height:130px; background:var(--foam); border-radius:5px 5px 3px 3px; display:flex; flex-direction:column-reverse; overflow:hidden; position:relative; }
.tl-owners .op .mo .seg { width:100%; flex:none; }
.tl-owners .op .mo .seg.tenant { background:var(--op-tenant); }
.tl-owners .op .mo .seg.owner { background:var(--op-owner); }
.tl-owners .op .mo .seg.maint { background:var(--op-maint); }
.tl-owners .op .mo .seg.pipe { background:repeating-linear-gradient(45deg,rgba(242,192,55,.9),rgba(242,192,55,.9) 4px,rgba(242,192,55,.35) 4px,rgba(242,192,55,.35) 8px); }
.tl-owners .op .mo .lbl { margin-top:.5rem; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:#6b7690; }
.tl-owners .op .mo .pct { font-size:.72rem; font-weight:500; color:var(--ink); }
.tl-owners .op .mo.now .lbl { color:var(--navy); font-weight:600; }
.tl-owners .op .mo.now .bar { outline:2px solid var(--navy); outline-offset:2px; }

/* ---- bookings table ------------------------------------------------------ */
.tl-owners .op-month-group { border-top:1px solid var(--hairline); }
.tl-owners .op-card-head + .op-month-group { border-top:0; }
.tl-owners .op-month-bar { display:flex; align-items:baseline; gap:.8rem; padding:1rem 1.4rem .4rem; background:linear-gradient(90deg,var(--salt),#fff); }
.tl-owners .op-month-bar h3 { font-weight:600; font-size:1.25rem; color:var(--navy); margin:0; }
.tl-owners .op-month-bar .mcount { font-size:.76rem; color:#7a869c; letter-spacing:.04em; }
.tl-owners table.op-bk { width:100%; border-collapse:collapse; margin:0; }
.tl-owners table.op-bk th { text-align:left; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:#8592a8; font-weight:500; padding:.5rem 1.4rem; border-bottom:1px solid var(--hairline); }
.tl-owners table.op-bk td { padding:.85rem 1.4rem; border-bottom:1px solid #eef2f7; border-radius:0; vertical-align:middle; font-size:.94rem; }
.tl-owners table.op-bk tr:last-child td { border-bottom:0; }
.tl-owners table.op-bk tr.pipeline td { background:rgba(242,192,55,.05); }
.tl-owners .op .dates { font-weight:500; color:var(--ink); white-space:nowrap; }
.tl-owners .op .dates .arw { color:var(--silver); margin:0 .35rem; }
.tl-owners .op .nights { color:#6b7690; font-size:.86rem; }
.tl-owners .op .guest { color:#42506e; }
.tl-owners .op-badge { display:inline-flex; align-items:center; font-size:.7rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase; padding:.32rem .7rem; border-radius:100px; white-space:nowrap; }
.tl-owners .op-badge.tenant { background:rgba(23,162,184,.12); color:#0f6b7a; }
.tl-owners .op-badge.owner { background:rgba(40,65,140,.12); color:var(--navy); }
.tl-owners .op-badge.maint { background:rgba(138,148,166,.16); color:#5c6577; }
.tl-owners .op-status { display:inline-flex; align-items:center; gap:.4rem; font-size:.8rem; }
.tl-owners .op-status.confirmed { color:#1f7a4d; }
.tl-owners .op-status.pipe { color:#9a7400; }
.tl-owners .op-status .sdot { width:8px; height:8px; border-radius:50%; flex:none; }
.tl-owners .op-status.confirmed .sdot { background:#2e9e63; }
.tl-owners .op-status.pipe .sdot { background:var(--gold); box-shadow:0 0 0 3px rgba(242,192,55,.25); }
.tl-owners .op-note { display:block; font-size:.78rem; color:#8592a8; margin-top:.2rem; }

/* phones: rows become labelled blocks instead of a sideways-scrolling table */
@media (max-width:700px) {
  .tl-owners table.op-bk, .tl-owners table.op-bk tbody, .tl-owners table.op-bk tr, .tl-owners table.op-bk td { display:block; width:100%; }
  .tl-owners table.op-bk thead { display:none; }
  .tl-owners table.op-bk tr { padding:.7rem 0; border-bottom:1px solid #eef2f7; }
  .tl-owners table.op-bk tr:last-child { border-bottom:0; }
  .tl-owners table.op-bk td { border:0; padding:.2rem 1.2rem; display:flex; justify-content:space-between; align-items:center; gap:1rem; text-align:right; background:transparent !important; }
  .tl-owners table.op-bk td::before { content:attr(data-label); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; color:#8592a8; text-align:left; flex:none; }
  .tl-owners .op .dates { white-space:normal; }
  .tl-owners .op-card-head { padding:1rem 1.2rem; }
  .tl-owners .op-month-bar { padding:1rem 1.2rem .4rem; }
}

/* ---- request page --------------------------------------------------------- */
.tl-owners .op-layout { display:grid; grid-template-columns:1fr 340px; gap:1.6rem; margin:1.8rem 0 0; align-items:start; }
@media (max-width:900px) { .tl-owners .op-layout { grid-template-columns:1fr; } }
.tl-owners .op-layout > .op-card { margin-top:0; }
.tl-owners .op-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:0 1.1rem; }
@media (max-width:560px) { .tl-owners .op-grid2 { grid-template-columns:1fr; } }
.tl-owners .op-fg { margin-bottom:1.15rem; min-width:0; }
.tl-owners .op-fg label, .tl-owners .op-fg .lab { display:block; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:#6b7690; margin-bottom:.5rem; font-weight:400; }
.tl-owners .op-fg .req { color:var(--op-tenant); }
.tl-owners .op-errors { background:#fdf0ee; border:1px solid #e3b4ae; border-left:4px solid #a6322b; border-radius:4px; padding:.9rem 1.1rem; margin-bottom:1.3rem; color:#7a211b; font-size:.92rem; }
.tl-owners .op-errors ul { margin:.4rem 0 0 1.1rem; padding:0; list-style:disc; }
.tl-owners .op-sent { display:flex; gap:1rem; align-items:flex-start; background:#eef8f2; border:1px solid #b8dfc8; border-left:4px solid #2e9e63; border-radius:6px; padding:1.2rem 1.4rem; color:#1f5a3a; }
.tl-owners .op-sent svg { flex:none; margin-top:3px; color:#2e9e63; }
.tl-owners .op-sent h3 { font-weight:600; font-size:1.35rem; margin:0 0 .25rem; }
.tl-owners .op-sent p { margin:0; font-size:.95rem; }

/* stay-type segmented control (labels wrap the radios; Materialize moves the radio off-screen) */
.tl-owners .op-seg { display:flex; gap:.6rem; flex-wrap:wrap; }
.tl-owners .op-seg label { flex:1 1 140px; margin:0; border:1px solid var(--hairline); border-radius:5px; padding:.8rem 1rem; cursor:pointer; display:flex; gap:.6rem; align-items:center; transition:.2s; color:var(--ink); }
.tl-owners .op-seg label .t { font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; font-weight:500; }
.tl-owners .op-seg label .sw { width:12px; height:12px; border-radius:3px; flex:none; }
.tl-owners .op-seg .owner .sw { background:var(--navy); }
.tl-owners .op-seg .tenant .sw { background:var(--teal); }
.tl-owners .op-seg .maint .sw { background:var(--silver); }
.tl-owners .op-seg label.on { border-color:var(--navy); background:var(--foam); box-shadow:0 0 0 2px rgba(40,65,140,.15); }
.tl-owners .op-seg label:focus-within { outline:2px solid var(--teal); outline-offset:2px; }

.tl-owners .op-aside .op-card { margin:0 0 1.4rem; }
.tl-owners .op-aside h3 { font-weight:600; font-size:1.3rem; padding:1.1rem 1.4rem .2rem; margin:0; }
.tl-owners .op-aside .body { padding:.4rem 1.4rem 1.3rem; font-size:.9rem; color:#42506e; }
.tl-owners .op-aside ul { list-style:none; margin:.4rem 0 0; padding:0; }
.tl-owners .op-aside li { display:flex; gap:.6rem; padding:.45rem 0; border-top:1px solid #eef2f7; font-size:.9rem; }
.tl-owners .op-aside li:first-child { border-top:0; }
.tl-owners .op-aside li svg { flex:none; margin-top:3px; color:var(--teal); }
.tl-owners .op-aside .op-disclaimer { margin-top:0; }
.tl-owners .op-recent { margin-top:1.6rem; }

/* =====================================================================
   Staff Admin section (/OwnersAdmin) - same look as the owner pages.
   ===================================================================== */
.tl-owners .op-subnav a.op-subnav-admin { display:inline-flex; align-items:center; gap:.45rem; color:#7a5c00; }
.tl-owners .op-subnav a.op-subnav-admin svg { flex:none; }
.tl-owners .op-subnav a.op-subnav-admin:hover, .tl-owners .op-subnav a.op-subnav-admin[aria-current] { color:var(--navy); }

.tl-owners .op-flash { display:flex; gap:1rem; align-items:flex-start; background:#eef8f2; border:1px solid #b8dfc8; border-left:4px solid #2e9e63; border-radius:6px; padding:1rem 1.3rem; color:#1f5a3a; margin-top:1.6rem; font-size:.95rem; }
.tl-owners .op-flash svg { flex:none; margin-top:2px; color:#2e9e63; }

.tl-owners .op-search-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0 1.1rem; }
@media (max-width:900px) { .tl-owners .op-search-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:560px) { .tl-owners .op-search-grid { grid-template-columns:1fr; } }
.tl-owners .op-count { font-size:.8rem; color:#6b7690; letter-spacing:.04em; }

.tl-owners .op-badge.on { background:rgba(46,158,99,.13); color:#1f7a4d; }
.tl-owners .op-badge.off { background:rgba(166,50,43,.1); color:#a6322b; }
.tl-owners .op-badge.warn { background:rgba(242,192,55,.2); color:#7a5c00; }
.tl-owners .op-badge.muted { background:rgba(138,148,166,.16); color:#5c6577; }
.tl-owners .op-badges { display:flex; gap:.4rem; flex-wrap:wrap; align-items:center; }

.tl-owners table.op-bk td .sub { display:block; font-size:.78rem; color:#8592a8; margin-top:.15rem; word-break:break-word; }
.tl-owners table.op-bk td .pno { color:#8592a8; font-size:.8rem; margin-left:.3rem; }
.tl-owners table.op-bk td.acts { white-space:nowrap; }
.tl-owners table.op-bk td.acts .op-btn { margin:.15rem .25rem .15rem 0; }
.tl-owners table.op-bk tr.dim td { opacity:.62; }
.tl-owners table.op-bk tr.dim td.acts { opacity:1; }
@media (max-width:700px) {
  .tl-owners table.op-bk td.acts { justify-content:flex-end; flex-wrap:wrap; white-space:normal; }
}

.tl-owners .op-btn.sm { padding:.5rem .8rem; font-size:.68rem; }
.tl-owners .op-btn.danger { border-color:#d9a6a1; color:#a6322b; }
.tl-owners .op-btn.danger:hover { border-color:#a6322b; background:#fdf0ee; color:#a6322b; }
.tl-owners .op-btn.ok { border-color:#9fd1b3; color:#1f7a4d; }
.tl-owners .op-btn.ok:hover { border-color:#1f7a4d; background:#eef8f2; color:#1f7a4d; }
.tl-owners form.op-inline { display:inline; margin:0; }

.tl-owners .op-owner-head { display:grid; grid-template-columns:1fr auto; gap:1rem 2rem; align-items:start; }
@media (max-width:700px) { .tl-owners .op-owner-head { grid-template-columns:1fr; } }
.tl-owners .op-owner-head h2 { font-weight:600; font-size:1.9rem; margin:0 0 .4rem; }
.tl-owners .op-facts { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:1rem 1.6rem; margin-top:1.1rem; }
.tl-owners .op-facts .k { font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:#8592a8; }
.tl-owners .op-facts .v { font-size:1rem; color:var(--ink); margin-top:.2rem; word-break:break-word; }
.tl-owners .op-hint { font-size:.82rem; color:#7a869c; margin:.4rem 0 0; }
.tl-owners .op-note-box { background:#FFFBEE; border:1px solid rgba(242,192,55,.5); border-left:4px solid var(--gold); border-radius:4px; padding:.85rem 1.1rem; font-size:.9rem; color:#5b4b16; margin-bottom:1.2rem; }
.tl-owners .op-propname { background:var(--foam); border-radius:4px; padding:.65rem .9rem; font-size:.95rem; color:var(--navy); margin-top:.5rem; }

.tl-owners .op-cred { background:var(--salt); border:1px solid var(--hairline); border-radius:8px; padding:1.3rem 1.5rem; margin:1.2rem 0; }
.tl-owners .op-cred dl { margin:0; display:grid; grid-template-columns:auto 1fr; gap:.7rem 1.4rem; align-items:center; }
@media (max-width:560px) { .tl-owners .op-cred dl { grid-template-columns:1fr; gap:.1rem; } .tl-owners .op-cred dd { margin-bottom:.8rem; } }
.tl-owners .op-cred dt { font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:#6b7690; }
.tl-owners .op-cred dd { margin:0; font-size:1.05rem; word-break:break-all; }
.tl-owners .op-cred .pw { font-family:Consolas,"Courier New",monospace; font-size:1.55rem; letter-spacing:.12em; color:var(--navy); background:#fff; border:1px dashed var(--navy); border-radius:4px; padding:.35rem .8rem; display:inline-block; user-select:all; }
@media print { .tl-owners .tlo-header, .tl-owners .op-subnav, .tl-owners .tlo-footer, .tl-owners .tlo-topbar { display:none; } }

/* ---- Request a Stay: availability calendars (2 months; half-day blocks mirror the guest website's .cal) ---- */
.tl-owners .op-cal { border:1px solid var(--hairline); border-radius:6px; padding:1rem 1.1rem 1.1rem; background:#fff; }
.tl-owners .op-cal .lab { margin-bottom:.6rem; }
.tl-owners .op-cal-legend { display:flex; flex-wrap:wrap; gap:.5rem 1.3rem; font-size:.78rem; letter-spacing:.05em; color:#39465F; }
.tl-owners .op-cal-legend span { display:inline-flex; align-items:center; gap:.45rem; }
.tl-owners .op-cal-legend .sw { width:14px; height:14px; border:1px solid var(--hairline); display:inline-block; }
.tl-owners .op-cal-legend .sw.avail { background:#fff; }
.tl-owners .op-cal-legend .sw.t-O { background:#ADD8E6; border-color:transparent; }
.tl-owners .op-cal-legend .sw.t-T { background:#FFC0CB; border-color:transparent; }
.tl-owners .op-cal-legend .sw.t-M { background:#000; border-color:transparent; }


.tl-owners .op-cal-hint { font-size:.8rem; color:#6b7690; margin:.55rem 0 0; }
.tl-owners .op-cal-warn { margin:.8rem 0 0; background:#FFFBEE; border:1px solid rgba(242,192,55,.6); border-left:4px solid var(--gold); border-radius:4px; padding:.7rem .9rem; font-size:.88rem; color:#5c4700; }
.tl-owners .op-cal-warn[hidden] { display:none; }
.tl-owners .op-cal-nav { display:flex; justify-content:space-between; align-items:center; margin:.9rem 0 .5rem; }
.tl-owners .op-cal-range { font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:#6b7690; }
.tl-owners .op-cal-btn { width:44px; height:44px; border:1px solid var(--navy); background:transparent; color:var(--navy); border-radius:50%; font-size:1.5rem; line-height:1; cursor:pointer; padding:0; display:grid; place-items:center; transition:background .2s,color .2s,opacity .2s; }
.tl-owners .op-cal-btn:hover:not(:disabled) { background:var(--navy); color:#fff; }
.tl-owners .op-cal-btn:disabled { opacity:.3; cursor:default; }
.tl-owners .op-cal-months { display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; transition:opacity .15s; }
.tl-owners .op-cal-months.is-loading { opacity:.45; }
@media (max-width:700px) { .tl-owners .op-cal-months { grid-template-columns:1fr; } }
.tl-owners .op-cal-title { font-family:var(--tl-display); font-weight:600; font-size:1.25rem; color:var(--ink); text-align:center; margin-bottom:.5rem; }
.tl-owners .op-cal-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; }
.tl-owners .op-cal-grid .dow { font-size:.62rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:#5B6880; text-align:center; padding:.3rem 0 .4rem; }
.tl-owners .op-cal .cal-day { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:2.7rem; min-width:0; padding:.3rem .1rem; border:1px solid var(--hairline); color:var(--ink); background:#fff; text-align:center; }
.tl-owners .op-cal .cal-day[data-d] { cursor:pointer; }
.tl-owners .op-cal .cal-day[data-d]:hover { border-color:var(--navy); }
.tl-owners .op-cal .cal-day:focus-visible { outline:2px solid var(--navy); outline-offset:1px; }
.tl-owners .op-cal .cal-num { font-family:var(--tl-display); font-weight:500; font-size:1rem; line-height:1; }
.tl-owners .op-cal .cal-day.booked { background:var(--ct); color:var(--ink); border-color:transparent; }
.tl-owners .op-cal .cal-day.booked.dark { color:#fff; }
/* changeover day: the leaving booking is the top-left half, the arriving booking the bottom-right half */
.tl-owners .op-cal .cal-day.booked.change { background:linear-gradient(to bottom right, var(--cd) calc(50% - .5px), var(--ct) calc(50% + .5px)); }
.tl-owners .op-cal .cal-day.booked.change .cal-num { background:rgba(255,255,255,.85); color:var(--ink); border-radius:3px; padding:0 3px; }

.tl-owners .op-cal .cal-day.past { color:#C3CAD6; background:#fff; }
.tl-owners .op-cal .cal-day.past .cal-num { opacity:.5; }
.tl-owners .op-cal .cal-day.empty { border:0; background:transparent; min-height:0; }
/* arrival day of a booking = check-out only: free top-left / booked bottom-right */
.tl-owners .op-cal .cal-day.half { background:linear-gradient(to bottom right, #fff calc(50% - .5px), var(--ct) calc(50% + .5px)); align-items:flex-start; justify-content:flex-start; padding:.3rem .35rem; }
/* departure day of a booking = check-in possible: booked top-left / free bottom-right */
.tl-owners .op-cal .cal-day.halfout { background:linear-gradient(to bottom right, var(--cd) calc(50% - .5px), #fff calc(50% + .5px)); align-items:flex-end; justify-content:flex-end; padding:.3rem .35rem; }
.tl-owners .op-cal .cal-day.half .cal-num, .tl-owners .op-cal .cal-day.halfout .cal-num { font-size:.88rem; }
/* selected stay */
.tl-owners .op-cal .cal-day.sel { background:var(--navy); border-color:var(--navy); color:#fff; }
.tl-owners .op-cal .cal-day.half.sel { background:linear-gradient(to bottom right, var(--navy) calc(50% - .5px), var(--ct) calc(50% + .5px)); }
.tl-owners .op-cal .cal-day.halfout.sel { background:linear-gradient(to bottom right, var(--cd) calc(50% - .5px), var(--navy) calc(50% + .5px)); }
.tl-owners .op-cal .cal-day.sel.sel-start:not(.half):not(.halfout) { background:linear-gradient(to bottom right, #fff calc(50% - .5px), var(--navy) calc(50% + .5px)); align-items:flex-end; justify-content:flex-end; padding:.3rem .35rem; }
.tl-owners .op-cal .cal-day.sel.sel-end:not(.half):not(.halfout) { background:linear-gradient(to bottom right, var(--navy) calc(50% - .5px), #fff calc(50% + .5px)); align-items:flex-start; justify-content:flex-start; padding:.3rem .35rem; }
.tl-owners .op-cal .cal-day.sel .cal-num { color:#fff; }
.tl-owners .op-cal .cal-day.sel.sel-start:not(.half):not(.halfout) .cal-num, .tl-owners .op-cal .cal-day.sel.sel-end:not(.half):not(.halfout) .cal-num { font-size:.88rem; }
.tl-owners .op-cal-err { grid-column:1/-1; font-size:.82rem; color:#5B6880; text-align:center; margin:0; }
@media (max-width:700px) {
  .tl-owners .op-cal { padding:.8rem .6rem .9rem; }
  .tl-owners .op-cal-months { gap:1.1rem; }
  .tl-owners .op-cal-grid { gap:3px; }
  .tl-owners .op-cal .cal-day { min-height:2.5rem; padding:.2rem 0; }
}

/* ---- busy / loading screen: same look as the guest website's splash (gradient band, logo, animated waves, "Loading ...") ---- */
.tl-owners .op-busy { display:none; position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%; z-index:9999; background:#fff; overflow:hidden; opacity:1; flex-direction:column; justify-content:center; align-items:center; transition:opacity 1s; }
.tl-owners .op-busy.on { display:flex; }
.tl-owners .op-busy.fading { opacity:0; pointer-events:none; }
.tl-owners .op-busy-header { position:absolute; top:0; left:0; width:100%; text-align:center; overflow:hidden; background:linear-gradient(60deg, rgba(84,58,183,1) 0%, rgba(0,172,193,1) 100%); color:#fff; }
.tl-owners .op-busy-logo { height:35vh; width:100%; display:flex; justify-content:center; align-items:center; text-align:center; }
.tl-owners .op-busy-logo img { width:75%; max-width:450px; height:auto; }
.tl-owners .op-busy-waves { position:relative; display:block; width:100%; height:15vh; margin-bottom:-7px; min-height:100px; max-height:150px; }
.tl-owners .op-busy-parallax > use { animation:op-move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite; }
.tl-owners .op-busy-parallax > use:nth-child(1) { animation-delay:-2s; animation-duration:7s; }
.tl-owners .op-busy-parallax > use:nth-child(2) { animation-delay:-3s; animation-duration:10s; }
.tl-owners .op-busy-parallax > use:nth-child(3) { animation-delay:-4s; animation-duration:13s; }
.tl-owners .op-busy-parallax > use:nth-child(4) { animation-delay:-5s; animation-duration:20s; }
@keyframes op-move-forever { 0% { transform:translate3d(-90px,0,0); } 100% { transform:translate3d(85px,0,0); } }
.tl-owners .op-busy-text { position:relative; margin-top:25%; padding-top:2.2rem; text-align:center; color:#1861ac; font-size:3em; line-height:1.2; font-family:'Lato',var(--tl-body),sans-serif; }
@media (max-width:768px) { .tl-owners .op-busy-waves { height:40px; min-height:40px; } .tl-owners .op-busy-text { font-size:2.2em; } }
/* inline busy overlay for the availability calendars (same as the guest site's .book-busy / .book-spinner) */
.tl-owners .op-cal-wrap { position:relative; }
.tl-owners .op-cal-busy { position:absolute; top:0; right:0; bottom:0; left:0; z-index:5; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.8rem; background:rgba(255,255,255,.86); color:var(--navy); font-size:.72rem; font-weight:500; letter-spacing:.22em; text-transform:uppercase; }
.tl-owners .op-cal-busy[hidden] { display:none; }
.tl-owners .op-spinner { width:30px; height:30px; border-radius:50%; border:2px solid var(--hairline); border-top-color:var(--navy); animation:op-spin .8s linear infinite; }
@keyframes op-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .tl-owners .op-spinner { animation-duration:2.4s; } }
/* Request form: a single Send button - full width on phones */
@media (max-width:560px) { .tl-owners .op-card-body .op-actions .op-btn { flex:1 1 100%; text-align:center; } }