/* =====================================================================
   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; }
/* Delete-a-property-link: native <details> confirm panel (works without JS, keyboard + screen-reader friendly) */
.tl-owners details.op-del { display:inline-block; vertical-align:top; position:relative; margin:.15rem .25rem .15rem 0; }
.tl-owners details.op-del > summary { list-style:none; margin:0; }
.tl-owners details.op-del > summary::-webkit-details-marker { display:none; }
.tl-owners details.op-del[open] > summary { background:#fdf0ee; border-color:#a6322b; }
.tl-owners details.op-del > summary:focus-visible { outline:2px solid #a6322b; outline-offset:2px; }
.tl-owners .op-delpanel { position:absolute; right:0; top:100%; z-index:20; white-space:normal; text-align:left; width:360px; max-width:min(360px, calc(100vw - 32px)); box-sizing:border-box; margin-top:.5rem; padding:.85rem 1rem; background:#fdf0ee; border:1px solid #d9a6a1; border-left:4px solid #a6322b; border-radius:4px; font-size:.86rem; color:#5b1d18; box-shadow:0 8px 24px rgba(13,27,62,.18); }
/* the card clips overflow; let an open confirm panel hang below the last row instead of being cut off */
.tl-owners .op-card:has(details.op-del[open]) { overflow:visible; }
.tl-owners .op-delpanel p { margin:0 0 .5rem; }
.tl-owners .op-btn.danger.solid { background:#a6322b; border-color:#a6322b; color:#fff; }
.tl-owners .op-btn.danger.solid:hover { background:#7f241f; border-color:#7f241f; color:#fff; }
@media (max-width:600px) {
  .tl-owners details.op-del[open] { position:static; flex:1 1 100%; display:block; }
  .tl-owners .op-delpanel { position:static; width:100%; max-width:none; box-shadow:none; }
  .tl-owners table.op-bk td.acts .op-btn.sm { min-height:40px; display:inline-flex; align-items:center; justify-content:center; }
}

.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; }
/* legend swatches for Available / Booked / Check-in only / Check-out only reuse the real .cal-day styling (neutral booked colour = tenant) */
.tl-owners .op-cal .op-cal-legend .sw.cal-day { --ct:#FFC0CB; --cd:#FFC0CB; width:16px; height:16px; min-width:16px; min-height:16px; padding:0; flex:0 0 16px; display:inline-block; box-sizing:border-box; }
.tl-owners .op-cal .op-cal-legend .sw.cal-day.booked { border-color:transparent; }
.tl-owners .op-cal .op-cal-legend-by { margin-top:.45rem; }
.tl-owners .op-cal .op-cal-legend-by b { font-weight:500; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:#6b7690; }
@media (max-width:480px) {
  .tl-owners .op-cal .op-cal-legend { display:grid; grid-template-columns:1fr 1fr; gap:.45rem 1rem; }
  .tl-owners .op-cal .op-cal-legend-by { grid-template-columns:repeat(3,auto); justify-content:start; }
  .tl-owners .op-cal .op-cal-legend-by b { grid-column:1 / -1; }
  .tl-owners .op-cal .op-cal-legend span { min-width:0; }
}


.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:not(.booked) { 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; } }

/* Admin owner page: change e-mail + set-a-new-password cards, co-users of a property */
.tl-owners .op-layout.op-layout-2 { grid-template-columns:1fr 1fr; }
@media (max-width:900px) { .tl-owners .op-layout.op-layout-2 { grid-template-columns:1fr; } }
.tl-owners .op-current { font-size:1rem; color:var(--ink); word-break:break-all; padding:.2rem 0; }
.tl-owners .op-pwrow { display:flex; gap:.5rem; align-items:stretch; }
.tl-owners .op-pwrow input { flex:1 1 auto; min-width:0; }
.tl-owners .op-pwrow .op-btn { flex:none; }
.tl-owners .op-rules { margin:0 0 .9rem 1.1rem; padding:0; list-style:disc; font-size:.82rem; color:#5c6577; }
.tl-owners .op-rules li { margin:.15rem 0; list-style:disc; }
.tl-owners .op-gen { background:var(--salt); border:1px solid var(--hairline); border-radius:8px; padding:.9rem 1.1rem; margin:0 0 1rem; display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; }
.tl-owners .op-gen[hidden] { display:none; }
.tl-owners .op-gen .lab { flex:1 1 100%; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:#6b7690; }
.tl-owners .op-gen .pw { font-family:Consolas,"Courier New",monospace; font-size:1.25rem; letter-spacing:.1em; color:var(--navy); background:#fff; border:1px dashed var(--navy); border-radius:4px; padding:.3rem .7rem; user-select:all; word-break:break-all; }
.tl-owners .op-gen .op-hint { flex:1 1 100%; margin:0; }
.tl-owners ul.op-cousers { margin:0; padding:0; list-style:none; }
.tl-owners ul.op-cousers li { margin:0 0 .35rem; list-style:none; }
.tl-owners .op-note-box ul.op-cousers { margin:.4rem 0 .6rem; }
.tl-owners a.op-addlink { display:inline-block; margin-top:.3rem; font-size:.78rem; letter-spacing:.06em; color:var(--navy); text-decoration:underline; }

/* ---- admin "View as owner" (impersonation) ------------------------------
   Banner: fixed to the bottom of the viewport on every page while an admin views as an owner (the header and sub-nav are
   already sticky at the top, so a bottom bar never fights their offsets). Gold = Tide Line accent, ink text. */
.tl-owners.op-viewing-as { padding-bottom:76px; }
.tl-owners .op-viewas { position:fixed; left:0; right:0; bottom:0; z-index:900; background:var(--gold); color:var(--ink); border-top:2px solid var(--ink); box-shadow:0 -6px 20px rgba(13,27,62,.18); }
.tl-owners .op-viewas-in { display:flex; align-items:center; gap:.9rem; padding-top:.7rem; padding-bottom:.7rem; }
.tl-owners .op-viewas-ico { flex:none; }
.tl-owners .op-viewas-txt { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; line-height:1.3; }
.tl-owners .op-viewas-who { font-size:1rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tl-owners .op-viewas-who b { font-weight:600; }
.tl-owners .op-viewas-meta { font-size:.78rem; color:rgba(13,27,62,.75); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tl-owners .op-viewas-stop { margin:0; flex:none; }
.tl-owners .op-viewas-stop button { font-family:var(--tl-body); font-size:.74rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; line-height:1.2; padding:.75rem 1.2rem; min-height:44px; border-radius:3px; border:1px solid var(--ink); background:var(--ink); color:#fff; cursor:pointer; }
.tl-owners .op-viewas-stop button:hover { background:var(--navy); border-color:var(--navy); }
@media (max-width:560px) {
  .tl-owners.op-viewing-as { padding-bottom:70px; }
  .tl-owners .op-viewas-in { gap:.6rem; }
  .tl-owners .op-viewas-ico, .tl-owners .op-viewas-long { display:none; }
  .tl-owners .op-viewas-who { font-size:.92rem; }
  .tl-owners .op-viewas-meta { font-size:.72rem; }
}
.tl-owners .op-viewas-note { display:block; flex-basis:100%; margin:.2rem 0 0; }
.tl-owners .op-btn[disabled] { opacity:.5; cursor:not-allowed; }
.tl-owners .op-owner-acts { display:flex; gap:.6rem; flex-wrap:wrap; justify-content:flex-end; }
@media (max-width:700px) { .tl-owners .op-owner-acts { justify-content:flex-start; } }

/* picker: type-to-search combobox (Views/OwnersAdmin/Index) */
.tl-owners .op-viewas-card { overflow:visible; }
.tl-owners .op-combo { max-width:640px; }
.tl-owners .op-combo-box { position:relative; }
.tl-owners .op-combo input[type=text] { width:100%; box-sizing:border-box; height:auto; padding:.75rem .9rem; border:1px solid var(--hairline); border-radius:4px; background:#fff; font-size:1rem; color:var(--ink); }
.tl-owners .op-combo input[type=text]:focus { border-color:var(--teal); box-shadow:0 0 0 3px rgba(23,162,184,.15); outline:none; }
.tl-owners .op-combo-list { position:absolute; left:0; right:0; top:100%; z-index:60; margin:.25rem 0 0; padding:.25rem 0; list-style:none; background:#fff; border:1px solid var(--hairline); border-radius:6px; box-shadow:0 12px 30px rgba(13,27,62,.16); max-height:min(380px, 60vh); overflow-y:auto; }
.tl-owners .op-combo-list li { list-style:none; padding:.6rem .9rem; border-bottom:1px solid rgba(13,27,62,.06); cursor:pointer; display:flex; flex-direction:column; gap:.1rem; }
.tl-owners .op-combo-list li:last-child { border-bottom:0; }
.tl-owners .op-combo-list li[aria-selected=true], .tl-owners .op-combo-list li[role=option]:hover { background:#eef4fb; }
.tl-owners .op-combo-list .n { font-weight:600; color:var(--ink); }
.tl-owners .op-combo-list .p { font-size:.85rem; color:var(--navy); }
.tl-owners .op-combo-list .c { font-size:.8rem; color:#6b7690; overflow-wrap:anywhere; }
.tl-owners .op-combo-list .op-combo-none { cursor:default; color:#6b7690; font-size:.88rem; }
.tl-owners .op-combo-status { min-height:1.2em; margin-top:.4rem; font-size:.82rem; color:#6b7690; }

/* ---- Owner statements (/OwnersPortal/Statements) ---- */
.tl-owners .op-stmt-picker { gap:.8rem 1.4rem; align-items:flex-end; margin-bottom:.2rem; }
.tl-owners .op-stmt-field { display:flex; flex-direction:column; gap:.35rem; flex:1 1 240px; min-width:0; }
.tl-owners .op-stmt-field label { font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:#6b7690; margin:0; }
.tl-owners .op-stmt-field select.browser-default { width:100%; }
.tl-owners .op-stmt-print { flex:0 0 auto; }
.tl-owners .op-stmt-sheet { padding:0; }
.tl-owners .op-stmt-head { padding:1.5rem 1.5rem 1.2rem; border-bottom:1px solid var(--hairline); }
.tl-owners .op-stmt-brand { font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:#8592a8; }
.tl-owners .op-stmt-head h2 { font-weight:600; font-size:1.9rem; margin:.2rem 0 1rem; }
.tl-owners .op-stmt-meta { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem 1.5rem; margin:0; }
.tl-owners .op-stmt-meta dt { font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:#6b7690; }
.tl-owners .op-stmt-meta dd { margin:.2rem 0 0; font-weight:600; color:var(--ink); overflow-wrap:anywhere; }
.tl-owners .op-stmt-sub { display:block; font-weight:400; font-size:.78rem; color:#7a869c; }
.tl-owners .op-stmt-row { display:grid; grid-template-columns:5.5rem minmax(7rem,1.1fr) 7rem 7rem 4.2rem repeat(3,minmax(7rem,1fr)); gap:.4rem .8rem; padding:.8rem 1.5rem; border-bottom:1px solid var(--hairline); align-items:baseline; font-size:.9rem; }
.tl-owners table.op-stmt-table, .tl-owners .op-stmt-table thead, .tl-owners .op-stmt-table tbody { display:block; width:100%; border:0; margin:0; border-collapse:collapse; }
.tl-owners .op-stmt-table tr.op-stmt-row { border-top:0; }
.tl-owners .op-stmt-table td, .tl-owners .op-stmt-table th { display:block; padding:0; border:0; border-radius:0; text-align:left; vertical-align:baseline; font-weight:inherit; letter-spacing:inherit; text-transform:inherit; }
.tl-owners .op-stmt-table tbody tr:nth-child(odd), .tl-owners .op-stmt-table tbody tr:nth-child(even) { background:transparent; }
.tl-owners .op-stmt-table tbody tr.op-stmt-total { background:#f4f7fb; }
.tl-owners .op-stmt-table td.op-stmt-guest, .tl-owners .op-stmt-table td.op-stmt-due { font-weight:600; }
.tl-owners .op-stmt-row .num { text-align:right; font-variant-numeric:tabular-nums; }
.tl-owners .op-stmt-th { background:#f4f7fb; font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:#6b7690; font-weight:600; }
.tl-owners .op-stmt-no { color:#6b7690; }
.tl-owners .op-stmt-guest { font-weight:600; }
.tl-owners .op-stmt-due { font-weight:600; color:var(--ink); }
.tl-owners .op-stmt-total { background:#f4f7fb; font-weight:600; border-bottom:0; }
.tl-owners .op-stmt-adhoc { grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:.3rem 1.2rem; font-size:.78rem; color:#6b7690; }
.tl-owners .op-stmt-adhoc-h { text-transform:uppercase; letter-spacing:.12em; font-size:.64rem; }
.tl-owners .op-stmt-adhoc-i b { color:var(--ink); font-weight:600; }
.tl-owners .op-stmt-payable { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin:1.4rem 1.5rem 0; padding:1.1rem 1.3rem; border:1px solid var(--hairline); border-left:3px solid var(--gold); border-radius:6px; background:#fff; }
.tl-owners .op-stmt-payable .k { font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:#6b7690; }
.tl-owners .op-stmt-payable .sub { font-size:.78rem; color:#7a869c; margin-top:.3rem; max-width:34rem; }
.tl-owners .op-stmt-payable .v { font-family:var(--tl-display); font-weight:600; font-size:2.2rem; line-height:1; color:var(--ink); }
.tl-owners .op-stmt-foot { margin:1.2rem 1.5rem 1.5rem; font-size:.78rem; color:#7a869c; line-height:1.5; }
@media (max-width:900px) {
  .tl-owners .op-stmt-meta { grid-template-columns:1fr; }
  .tl-owners .op-stmt-th { display:none; }
  .tl-owners .op-stmt-row { grid-template-columns:1fr 1fr; padding:1rem 1.1rem; gap:.45rem 1rem; }
  .tl-owners .op-stmt-row > [data-l]::before { content:attr(data-l); display:block; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:#8592a8; font-weight:400; }
  .tl-owners .op-stmt-row .num { text-align:left; }
  .tl-owners .op-stmt-total .op-stmt-tl { grid-column:1 / -1; }
  .tl-owners .op-stmt-total > td:empty { display:none; }
  .tl-owners .op-stmt-head { padding:1.2rem 1.1rem 1rem; }
  .tl-owners .op-stmt-payable { margin:1.2rem 1.1rem 0; }
  .tl-owners .op-stmt-foot { margin:1.2rem 1.1rem 1.4rem; }
  .tl-owners .op-stmt-print { flex:1 1 100%; }
}
.tl-owners .op-stmt-short { display:none; }
.tl-owners button.op-btn.op-stmt-print { font-size:.85rem; }
@media (max-width:900px) { .tl-owners .op-stmt-field select.browser-default { font-size:16px; } }
@media print {
  @page { size:A4 portrait; margin:12mm; }
  html, body, body.tl-owners { background:#fff !important; background-image:none !important; height:auto !important; overflow:visible !important; }
  .tl-owners .tlo-tide, .tl-owners .op-stmt-picker, .tl-owners .tlo-hero, .tl-owners .tlo-header, .tl-owners .tlo-footer, .tl-owners .tlo-topbar,
  .tl-owners .op-subnav, .tl-owners .op-viewas, .tl-owners .op-busy, .tl-owners [class*="op-busy"], .tl-owners .op-stmt-print { display:none !important; }
  .tl-owners .op-card, .tl-owners .tlo-main, .tl-owners main, .tl-owners .op { overflow:visible !important; }
  .tl-owners .op, .tl-owners .tlo-wrap, .tl-owners main { max-width:none !important; width:auto !important; margin:0 !important; padding:0 !important; }
  .tl-owners .op-stmt-sheet { border:0; box-shadow:none; margin:0; background:#fff; overflow:visible; }
  .tl-owners .op-stmt-head { padding:0 0 3mm; }
  .tl-owners .op-stmt-head h2 { font-size:18pt; margin:1mm 0 3mm; }
  .tl-owners .op-stmt-meta { grid-template-columns:repeat(3,1fr) !important; gap:2mm 5mm; font-size:9pt; }
  .tl-owners table.op-stmt-table { display:table; width:100%; table-layout:fixed; }
  .tl-owners .op-stmt-table thead.op-stmt-thead { display:table-header-group; }
  .tl-owners .op-stmt-table tbody.op-stmt-body { display:table-row-group; }
  .tl-owners .op-stmt-total .op-stmt-tl { grid-column:auto !important; }
  .tl-owners .op-stmt-total > td:empty { display:block !important; }
  .tl-owners .op-stmt-th { display:grid !important; font-size:7pt; letter-spacing:.06em; }
  .tl-owners .op-stmt-long { display:none; }
  .tl-owners .op-stmt-short { display:inline; }
  .tl-owners .op-stmt-row { grid-template-columns:15mm minmax(0,1fr) 20mm 20mm 11mm 25mm 23mm 25mm !important; gap:1mm 2mm !important; padding:2mm 1.5mm; font-size:8.5pt; break-inside:avoid; page-break-inside:avoid; }
  .tl-owners .op-stmt-row > * { min-width:0; }
  .tl-owners .op-stmt-row > [data-l]::before { display:none !important; }
  .tl-owners .op-stmt-row .num, .tl-owners .op-stmt-row > :nth-child(3), .tl-owners .op-stmt-row > :nth-child(4), .tl-owners .op-stmt-no { white-space:nowrap; }
  .tl-owners .op-stmt-row .num { text-align:right !important; font-variant-numeric:tabular-nums; }
  .tl-owners .op-stmt-adhoc { font-size:7.5pt; }
    .tl-owners .op-stmt-total { break-inside:avoid; }
  .tl-owners .op-stmt-payable { display:block; position:relative; margin:5mm 0 0; padding:3mm 4mm; break-inside:avoid; page-break-inside:avoid; }
  .tl-owners .op-stmt-payable > div:first-child { margin-right:60mm; }
  .tl-owners .op-stmt-payable .v { position:absolute; right:4mm; top:50%; transform:translateY(-50%); font-size:18pt; white-space:nowrap; }
  .tl-owners .op-stmt-foot { margin:4mm 0 0; font-size:7.5pt; break-inside:avoid; }
  .tl-owners .op-stmt-th, .tl-owners .op-stmt-total { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}

/* ---- Xero-backed Statement (Views/OwnersPortal/Statement.cshtml) ---------- */
.tl-owners .op-xs-filter input[type=date].op-field { min-height:2.9rem; }
.tl-owners .op-xs-stats { margin-top:1.4rem; margin-bottom:0; }
.tl-owners .op-xs-contact { font-size:1.15rem !important; line-height:1.3 !important; overflow-wrap:anywhere; }
.tl-owners table.op-xs-table { width:100%; border-collapse:collapse; margin:0; border:0; font-size:.9rem; }
.tl-owners .op-xs-table th { text-align:left; font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:#6b7690; font-weight:600; padding:.7rem .7rem; background:#f4f7fb; border:0; border-radius:0; }
.tl-owners .op-xs-table td { padding:.75rem .7rem; border:0; border-bottom:1px solid var(--hairline); border-radius:0; vertical-align:top; }
.tl-owners .op-xs-table tbody tr, .tl-owners .op-xs-table tbody tr:nth-child(odd), .tl-owners .op-xs-table tbody tr:nth-child(even) { background:transparent; border-top:0; }
.tl-owners .op-xs-table th:first-child, .tl-owners .op-xs-table td:first-child { padding-left:1.5rem; }
.tl-owners .op-xs-table th:last-child, .tl-owners .op-xs-table td:last-child { padding-right:1.5rem; }
.tl-owners .op-xs-table .num { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.tl-owners .op-xs-date { white-space:nowrap; }
.tl-owners .op-xs-ref b { font-weight:600; color:var(--ink); }
.tl-owners .op-xs-ref span { display:block; font-size:.8rem; color:#7a869c; overflow-wrap:anywhere; }
.tl-owners .op-xs-bal { font-weight:600; color:var(--ink); }
.tl-owners .op-xs-bal.neg { color:#b03a2e; }
.tl-owners .op-xs-pdf a { white-space:nowrap; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--navy); }
.tl-owners .op-xs-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.tl-owners .op-xs-pill { display:inline-block; padding:.18rem .6rem; border-radius:999px; font-size:.7rem; font-weight:500; letter-spacing:.04em; white-space:nowrap; border:1px solid transparent; }
.tl-owners .op-xs-pill.paid { background:#e6f5ec; color:#1f7a49; border-color:#bfe3cd; }
.tl-owners .op-xs-pill.await { background:#fff6dc; color:#8a6410; border-color:#f2dc93; }
.tl-owners .op-xs-pill.overdue { background:#fdeceb; color:#a8322a; border-color:#f3c3bf; }
.tl-owners .op-xs-pill.applied { background:#eaf0fa; color:#34507f; border-color:#c5d3ec; }
.tl-owners .op-xs-pill.other { background:#f1f3f7; color:#5a6679; border-color:#dde2ea; }
.tl-owners .op-xs-legend { margin:1.2rem 1.5rem 0; padding:.9rem 1.1rem; background:#f4f7fb; border-left:3px solid var(--gold); border-radius:4px; font-size:.8rem; line-height:1.5; color:#4a566c; }
@media (max-width:600px) {
  .tl-owners .op-xs-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .tl-owners .op-xs-table, .tl-owners .op-xs-table tbody { display:block; width:100%; }
  .tl-owners .op-xs-table tbody tr { display:grid; grid-template-columns:1fr 1fr; gap:.5rem 1rem; padding:1rem 1.1rem; border-bottom:1px solid var(--hairline); }
  .tl-owners .op-xs-table td, .tl-owners .op-xs-table td:first-child, .tl-owners .op-xs-table td:last-child { display:block; padding:0; border:0; min-width:0; }
  .tl-owners .op-xs-table td[data-l]::before { content:attr(data-l); display:block; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:#8592a8; font-weight:400; }
  .tl-owners .op-xs-table .num { text-align:left; }
  .tl-owners .op-xs-table td.op-xs-ref { grid-column:1 / -1; }
  .tl-owners .op-xs-table td.op-xs-pdf { grid-column:1 / -1; }
  .tl-owners .op-xs-legend { margin:1.2rem 1.1rem 0; }
}
@media print {
  .tl-owners .op-xs-filter { display:none !important; }
  .tl-owners .op-xs-stats { margin:0 0 4mm; grid-template-columns:repeat(3,1fr) !important; gap:3mm; }
  .tl-owners .op-xs-stats .op-stat { padding:3mm; break-inside:avoid; }
  .tl-owners .op-xs-stats .op-stat .v { font-size:14pt; }
  .tl-owners .op-xs-table thead { position:static; width:auto; height:auto; clip:auto; overflow:visible; display:table-header-group; }
  .tl-owners table.op-xs-table { display:table; table-layout:auto; font-size:8.5pt; }
  .tl-owners .op-xs-table tbody { display:table-row-group; }
  .tl-owners .op-xs-table tbody tr { display:table-row; padding:0; }
  .tl-owners .op-xs-table td, .tl-owners .op-xs-table th { display:table-cell; padding:1.5mm 1.5mm !important; }
  .tl-owners .op-xs-table tr { break-inside:avoid; page-break-inside:avoid; }
  .tl-owners .op-xs-table td[data-l]::before { display:none !important; }
  .tl-owners .op-xs-table .num { text-align:right !important; }
  .tl-owners .op-xs-pdf { display:none !important; }
  .tl-owners .op-xs-table th:last-child { display:none; }
  .tl-owners .op-xs-pill, .tl-owners .op-xs-table th, .tl-owners .op-xs-legend { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .tl-owners .op-xs-legend { margin:4mm 0 0; font-size:7.5pt; break-inside:avoid; }
}