/* Shared layout rules loaded after the theme and login styles. */
.main { margin-left:264px; }
.content > *, .stats > *, .card-grid > *, .form-grid > * { min-width:0; }
.router-card p, .hint, .form-error, footer, .event, dd { overflow-wrap:anywhere; }
.router-actions, .plan-actions { display:flex; flex-wrap:wrap; gap:8px; }
dialog { max-height:calc(100dvh - 32px); overflow:auto; }

.settings-grid { grid-template-columns: minmax(0,1fr) 340px; align-items: start; }
.settings-grid .right-stack { width: 100%; min-width: 0; }
.settings-grid input[type=file] { max-width: 100%; }
.logo-preview-box { flex-wrap: wrap; overflow-wrap: anywhere; }
#preview-payment-methods, #preview-contact-lines { overflow-wrap: anywhere; }

.table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  display: block;
}
.table-wrap table {
  width: 100%;
  min-width: 680px;
}

@media(max-width:1300px) {
  .settings-grid { grid-template-columns: 1fr; }
}

@media(max-width:1050px) {
  .overview-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .right-stack {
    width: 100%;
  }
}

@media(max-width:900px) {
  .shell { display:block; }
  .sidebar { position:static; width:100%; padding:12px 16px; border-right:0; border-bottom:1px solid var(--ui-border); overflow:visible; }
  .sidebar .brand { display:none; }
  .sidebar nav { display:flex; gap:6px; margin:0; overflow-x:auto; padding:3px 0 8px; }
  .sidebar .nav-item { flex:0 0 auto; width:auto; margin:0; font-size:12px; padding:10px 12px; min-height:44px; white-space:nowrap; }
  .sidebar .nav-item > span { font-size:18px; }
  .sidebar .sidebar-bottom { display:block; padding:0; }
  .sidebar .profile { margin:0; padding:4px 0 0; display:flex; justify-content:flex-end; border:0; }
  .sidebar .profile > div { display:none; }
  .sidebar .profile button { width:auto; min-width:44px; min-height:44px; padding:8px 12px; font-size:13px; }
  .main { margin-left:0; width:100%; }
  .content { padding:24px 18px; }
  .stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  input, select, textarea, #auth-form input:not([type=hidden]) { font-size:16px; }
  .manage-button, .action-button, .secondary, .text-button, .tabs button { min-height:44px; }
  .table-wrap { overscroll-behavior-x:contain; }
  .topbar { gap:12px; height:auto; min-height:57px; padding:14px 18px; flex-wrap:wrap; }
  .form-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
}
@media(max-width:600px) {
  .content { padding:20px 12px; }
  .sidebar { padding:8px 12px; }
  .card-grid, .right-stack, .form-grid { grid-template-columns:minmax(0,1fr); }
  .page-heading, .panel-heading, .resource-heading { flex-wrap:wrap; }
  .page-heading .primary { white-space:normal; }
  .stats article { padding:14px 12px; }
  .stats .money { font-size:20px; overflow-wrap:anywhere; }
  .notice { flex-wrap:wrap; }
  .notice button { display:block; margin-left:0; min-height:44px; white-space:normal; }
  .table-toolbar { padding:12px; }
  .table-toolbar input { width:100%; max-width:none; }
  footer { gap:12px; flex-wrap:wrap; margin:0 12px; }
  dialog { padding:18px; width:calc(100% - 20px); max-height:calc(100dvh - 20px); }
  .dialog-actions { flex-wrap:wrap; }
  .dialog-actions button { flex:1; min-height:44px; white-space:normal; }
  .service-detail { flex-wrap:wrap; }
  .auth-form > div { padding:24px 18px; }
  .invoice-actions-group { flex-wrap: wrap; }
}

/* Comfortable management card interiors. */
[hidden] { display:none !important; }
.settings-grid #settings-form { padding:0 24px 24px; }
.settings-grid .right-stack .panel > p { margin:16px 24px; }
.settings-grid .panel-heading h2 { line-height:1.5; }
.settings-grid label { line-height:1.6; }
.settings-grid .form-grid { column-gap:20px; }
.padded-panel,.panel-body { padding:24px; }
.padded-panel h2 { margin:10px 0 12px; }
.padded-panel p { line-height:1.7; }
.hotspot-workspace { display:grid; gap:24px; min-width:0; }
.hotspot-workspace .page-heading,.hotspot-workspace .stats { margin:0; }
.section-nav { display:flex; gap:8px; overflow-x:auto; padding:6px; background:#edf2ed; border:1px solid #dce5dc; border-radius:12px; }
.section-nav button { flex:0 0 auto; padding:12px 16px; border:0; border-radius:8px; background:transparent; color:#53665a; font:inherit; font-weight:600; cursor:pointer; }
.section-nav button[aria-current=page] { background:#fff; color:#214d35; box-shadow:0 2px 7px #18301b12; }
.section-nav button:focus-visible { outline:2px solid #326f45; outline-offset:-2px; }
.hotspot-panel th,.hotspot-panel td { padding:18px 22px; line-height:1.6; }
.hotspot-panel td small { max-width:280px; white-space:normal; overflow-wrap:anywhere; }
.voucher-actions { display:flex; flex-wrap:wrap; gap:8px; min-width:180px; }
.hotspot-entry { padding:18px 0; border-bottom:1px solid #e4eae4; }
.hotspot-entry:last-child { border-bottom:0; }
#hotspot-sessions { margin-top:20px; }
.sidebar .nav-item > span { flex:0 0 22px; width:22px; text-align:center; font-size:18px; }
.content > .panel > .empty { padding:24px; }
@media(max-width:600px) {
 .settings-grid #settings-form { padding:0 18px 20px; }
 .padded-panel,.panel-body { padding:18px; }
 .hotspot-workspace { gap:18px; }
 .hotspot-panel th,.hotspot-panel td { padding:14px 16px; }
 .section-nav button { padding:11px 13px; font-size:13px; }
}

.settings-grid #preview-payment-methods { padding:0 24px 24px; }
.settings-grid .print-area { margin:0 24px; }
.settings-grid #settings-form .panel-heading { padding:20px 0 12px; }
.hotspot-panel table:has(td.empty) { min-width:0; }
.hotspot-panel table:has(td.empty) thead { display:none; }
.hotspot-panel td.empty { white-space:normal; padding:32px 24px; text-align:left; }

.saas-invoice-brand p,.saas-invoice-payment p { margin:6px 0; line-height:1.6; overflow-wrap:anywhere; }
.saas-invoice-payment { padding:18px 0; border-bottom:1px solid #dce5dc; }
.invoice-note { white-space:pre-wrap; }
.sms-message { white-space:normal; min-width:240px; max-width:500px; line-height:1.7; }
@media print { body:has(dialog[open] #print-saas-invoice) #app, #close-saas-invoice, #toast { display:none !important; } #modal { max-height:none !important; overflow:visible !important; } }

/* Keep dashboard navigation visible without sideways scrolling. */
.dashboard-theme .sidebar nav{overflow-x:hidden}.dashboard-theme .tabs{display:flex;flex-wrap:wrap;overflow:visible;max-width:100%}.dashboard-theme .tabs button{white-space:normal;overflow-wrap:anywhere;max-width:100%}.dashboard-theme .settings-tabs button{flex:1 1 130px}
@media(max-width:900px){.dashboard-theme .sidebar nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:6px;overflow:visible;flex:none}.dashboard-theme .sidebar .nav-item{width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere;margin:0;padding:10px 12px;align-items:center}.dashboard-theme .sidebar .nav-item small{margin-left:auto}}

/* Subtle navigation scrollbar, still usable by mouse and keyboard. */
.dashboard-theme .sidebar,.dashboard-theme .sidebar nav{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--owner-nav-text,#fff) 24%,transparent) transparent}.dashboard-theme .sidebar:hover,.dashboard-theme .sidebar nav:hover{scrollbar-color:color-mix(in srgb,var(--owner-nav-text,#fff) 42%,transparent) transparent}.dashboard-theme .sidebar::-webkit-scrollbar,.dashboard-theme .sidebar nav::-webkit-scrollbar{width:5px;height:5px}.dashboard-theme .sidebar::-webkit-scrollbar-track,.dashboard-theme .sidebar nav::-webkit-scrollbar-track{background:transparent}.dashboard-theme .sidebar::-webkit-scrollbar-thumb,.dashboard-theme .sidebar nav::-webkit-scrollbar-thumb{background:#ffffff40;border-radius:8px}.dashboard-theme .sidebar::-webkit-scrollbar-button,.dashboard-theme .sidebar nav::-webkit-scrollbar-button{display:none}

/* Compact account and sign-out area. */
.dashboard-theme .sidebar .profile { gap:6px; margin-top:4px; padding:8px 0; }
.dashboard-theme .sidebar .profile .avatar { width:28px; height:28px; flex-shrink:0; font-size:12px; }
.dashboard-theme .sidebar .profile strong { font-size:11px; }
.dashboard-theme .sidebar .profile small { font-size:10px; overflow:hidden; text-overflow:ellipsis; max-width:160px; }
.dashboard-theme .sidebar .profile .logout-button { min-width:0; width:auto; height:30px; min-height:30px; padding:4px 8px; font-size:11px; border-radius:6px; }
@media(max-width:760px) { .dashboard-theme .sidebar .profile .logout-button { min-height:36px; height:36px; padding:6px 10px; } }
