/* EstateSail — small-viewport fluid layer (after theme + pro dashboard CSS; no new palette/type families). */

/* Main column: container queries for in-flow page chrome (keeps global header/footer media queries intact) */
body.is-dashboard-shell .main.shell {
  min-width: 0;
  container-type: inline-size;
  container-name: es-content;
}

.form-panel,
.config-settings-page,
.pro-dash-placeholder {
  min-width: 0;
}

/* Contract configuration CTA: short label on mobile only (Estate Manager, contracts, generate) */
.es-contract-cfg-label--short {
  display: none;
}
@media (max-width: 768px) {
  /* Keep the 30% mobile downscale only for the Professional dashboard shell. */
  html.is-pro-dashboard-shell {
    font-size: 70%;
  }
  .es-contract-cfg-label--full {
    display: none;
  }
  .es-contract-cfg-label--short {
    display: inline;
  }
}

/* Pro dashboard: fluid header gutter */
body.is-dashboard-shell.is-pro-dashboard .site-header > .shell.header-inner {
  padding-inline: clamp(0.65rem, 3.2vw, 2rem) !important;
  column-gap: clamp(0.5rem, 2.5vw, 1.25rem) !important;
}

@media (max-width: 768px) {
  body.is-dashboard-shell .main.shell {
    padding-block: clamp(1.5rem, 4vw, 2.5rem) clamp(2.5rem, 6vw, 5.5rem);
  }
  body.is-dashboard-shell.is-pro-dashboard .main.shell {
    padding-inline: clamp(0.75rem, 3.5vw, 1.5rem) !important;
  }
}

/* Dashboard page title block: scale down smoothly on narrow columns (identity unchanged) */
body.is-dashboard-shell .dh-page-title {
  font-size: clamp(1.3rem, 1.1rem + 1.1vw, 1.875rem);
  line-height: 1.2;
  word-break: break-word;
  overflow-wrap: anywhere;
}
body.is-dashboard-shell.is-pro-dashboard .dh-page-title {
  font-size: clamp(1.45rem, 1.1rem + 1.4vw, 2.25rem);
  line-height: 1.12;
}
body.is-dashboard-shell .dh-page-subtitle {
  max-width: 100%;
  font-size: clamp(0.9rem, 0.4rem + 0.8vw, 1rem);
}
body.is-dashboard-shell .dh-breadcrumb {
  min-width: 0;
  font-size: clamp(0.8rem, 0.2rem + 0.5vw, 0.875rem);
}

@container es-content (max-width: 36rem) {
  .dh-page-header {
    flex-direction: column;
    align-items: stretch;
  }
  .dh-page-header__left {
    max-width: 100%;
  }
  /* pro-dashboard-figma uses flex-shrink:0 on actions — with nowrap .btn, row overflowed the viewport */
  .dh-page-header__actions {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    flex: 1 1 100% !important;
    align-self: stretch;
    box-sizing: border-box;
    justify-content: flex-start;
  }
  .dh-page-header__actions .btn,
  .dh-page-header__actions a {
    min-height: 44px;
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    text-align: center;
    justify-content: center;
  }

  /* Estate Manager: keep header CTAs on the right when the header stacks (tablet / narrow main column) */
  .estate-manager-page .dh-page-header__actions {
    align-self: flex-end;
    width: auto;
    flex: 0 0 auto !important;
    justify-content: flex-end;
  }
}

/* Pro header: brand */
body.is-dashboard-shell .logo,
body.is-dashboard-shell .footer-logo {
  min-width: 0;
  max-width: 100%;
}
body.is-dashboard-shell .logo {
  font-size: clamp(1.05rem, 0.85rem + 0.5vw, 1.25rem);
  line-height: 1.2;
}
/* Fluid mark size: beats fixed 42px/28px in theme/pro at narrow widths */
body .logo .logo-es-mark,
body .footer-logo .logo-es-mark,
.logo-es-mark {
  width: clamp(32px, 7vw, 42px) !important;
  height: clamp(32px, 7vw, 42px) !important;
}
body .footer-logo .logo-es-mark {
  width: clamp(24px, 5vw, 28px) !important;
  height: clamp(24px, 5vw, 28px) !important;
}

/* ≤480px: minimum tap size; stack-friendly gaps */
@media (max-width: 480px) {
  .form-panel,
  .form-panel--auth,
  .form-panel--register,
  .config-settings-page,
  .estate-contracts-page.pro-dash-placeholder {
    padding: clamp(1rem, 4vw, 1.5rem) !important;
  }

  .form-control,
  .form-group select,
  input[type="text"],
  input[type="search"],
  input[type="email"],
  input[type="tel"],
  input[type="url"],
  input[type="number"],
  input[type="password"] {
    min-height: 44px;
  }

  .btn {
    min-height: 44px;
  }
  .btn-sm {
    min-height: 2.5rem;
  }
  .admin-subnav__link,
  .admin-toolbar a {
    min-height: 2.75rem;
  }
  .footer-bottom__one-line {
    white-space: normal;
    overflow-x: visible;
  }
  .pro-dash-bell,
  .pro-dash-header-actions .site-header-account-menu__trigger {
    min-width: 44px;
    min-height: 44px;
  }
  .admin-table th,
  .admin-table td {
    padding: clamp(0.5rem, 2.5vw, 1rem) clamp(0.5rem, 2.5vw, 1.25rem);
  }
  .admin-table td:has(> a.btn) {
    vertical-align: top;
  }
  .admin-table td:has(> a.btn) .btn {
    margin: 0.2rem 0.35rem 0.2rem 0;
  }
}

@container es-content (max-width: 30rem) {
  /* table-layout:fixed + overflow was clipping wide action toolbars — keep auto layout, wrap text only */
  .admin-table th,
  .admin-table td {
    word-break: break-word;
  }
}

/* /dashboard/estates — desktop: button row; mobile: single Actions <details> (see breakpoints below) */
.estate-list-actions--desktop {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
  align-items: center;
  min-width: 0;
}
.estate-list-actions--desktop,
.estate-list-actions--desktop .estate-list-actions__delete {
  min-width: 0;
  max-width: 100%;
}
body.is-dashboard-shell .form-panel .estate-list-actions--desktop .btn.btn-sm,
body.is-dashboard-shell .form-panel .estate-list-actions--desktop .estate-list-actions__delete .btn {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  white-space: normal;
  text-align: center;
  justify-content: center;
  line-height: 1.25;
}

/* Mobile: hide inline actions, show native <details> menu */
@media (min-width: 769px) {
  .estate-list-actions--mobile {
    display: none !important;
  }
}
@media (max-width: 768px) {
  .estate-list-actions--desktop {
    display: none !important;
  }
  .estate-table-actions-cell {
    vertical-align: top;
  }
  .estate-actions-dropdown {
    min-width: 0;
    max-width: 100%;
  }
  .estate-actions-dropdown__summary {
    list-style: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    width: 100%;
    max-width: 18rem;
    box-sizing: border-box;
  }
  .estate-actions-dropdown__summary::-webkit-details-marker,
  .estate-actions-dropdown__summary::marker {
    display: none;
  }
  .estate-actions-dropdown[open] .estate-actions-dropdown__summary svg {
    transform: rotate(180deg);
  }
  .estate-actions-dropdown__summary svg {
    flex-shrink: 0;
    transition: transform 0.15s ease;
  }
  .estate-actions-dropdown__panel {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
    margin-top: 0.5rem;
    padding: 0.75rem;
    border: 1px solid var(--border, #e2e8f0);
    border-radius: 0.625rem;
    background: var(--surface, #fff);
  }
  .estate-actions-dropdown__item,
  .estate-actions-dropdown__delete {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .estate-actions-dropdown__item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 2.5rem;
    text-align: center;
  }
  .estate-actions-dropdown__item .estate-actions-dropdown__label {
    text-align: center;
  }
  .estate-actions-dropdown__delete {
    margin: 0;
  }
  .estate-actions-dropdown__delete .btn {
    width: 100%;
  }
}

/* /dashboard/estates: desktop keeps Name | Address | Actions; mobile stacks address under name */
@media (min-width: 769px) {
  .admin-table--estate-list .estate-td-name__address--stack {
    display: none !important;
  }
}
@media (max-width: 768px) {
  .admin-table--estate-list .estate-th-address,
  .admin-table--estate-list .estate-td-address {
    display: none !important;
  }
  .admin-table--estate-list .estate-td-name {
    vertical-align: top;
  }
  .admin-table--estate-list .estate-td-name__primary {
    color: var(--primary, #0f172b);
    font-weight: 600;
    line-height: 1.3;
  }
  .admin-table--estate-list .estate-td-name__address--stack {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.8125rem;
    line-height: 1.4;
    font-weight: 400;
  }
}

/* Long titles in card surfaces */
.card h2,
.card h3,
.sale-listing-card__title,
.sales-page__listing-title {
  min-width: 0;
  overflow-wrap: anywhere;
  word-wrap: break-word;
}

/* Market LP grids: prefer auto-fit over fixed 2-col breakpoints (still one override block) */
@media (max-width: 1200px) {
  .lp-stats-grid,
  .lp-feat-grid,
  .lp-val-grid,
  .lp-test-grid,
  .lp-how-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)) !important;
  }
}

@media (max-width: 640px) {
  .lp-hero-ctas,
  .form-actions,
  .sales-page__listing-actions {
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  .form-actions .btn,
  .sales-page__listing-actions .btn,
  .lp-hero-ctas a {
    flex: 1 1 auto;
    min-height: 44px;
    min-width: min(100%, 8rem);
  }
}

/* Card grids: one column on very narrow screens (avoids two squeezed columns) */
@media (max-width: 480px) {
  .card-grid {
    grid-template-columns: 1fr;
  }
}