/* v965 — Price Lists table/layout root fix
   Scope: price-lists.html only via body.price-list-table-layout-rootfix-v965
   Goal: stop the old v871/v905/v918/v929/v935/v951 chain from fighting over the page.
   Fixes:
   1) wider price-list shell so the 5-column fee table does not feel squeezed;
   2) compact table rhythm so the matrix is easier to scan vertically;
   3) restored right-side table edge/border so the matrix no longer looks cut off;
   4) no global sidebar edits, no spillover to other pages.
*/

@media (min-width: 981px){
  html body.price-list-table-layout-rootfix-v965{
    --price-shell-v965: 1360px;
    --price-sidebar-v965: 320px;
    --price-gap-v965: 24px;
    --price-table-border-v965: #c8d7e6;
    --price-table-blue-v965: #1379bd;
    --price-table-left-v965: #dbe4ee;
    --price-table-soft-v965: #f7fafd;
    --price-table-red-v965: #ee1f55;
  }

  /* Own the outer page rail. v935 was forcing the page to 1180px, which left the
     main column too narrow for a 5-column price matrix. */
  html body.price-list-table-layout-rootfix-v965 .price-xxx-layout-v871.container,
  html body.price-list-table-layout-rootfix-v965 .price-xxx-layout-v871{
    display:grid !important;
    grid-template-columns:minmax(0, calc(var(--price-shell-v965) - var(--price-sidebar-v965) - var(--price-gap-v965))) var(--price-sidebar-v965) !important;
    gap:var(--price-gap-v965) !important;
    width:min(var(--price-shell-v965), calc(100vw - 72px)) !important;
    max-width:min(var(--price-shell-v965), calc(100vw - 72px)) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    align-items:start !important;
    overflow:visible !important;
  }

  html body.price-list-table-layout-rootfix-v965 .price-xxx-main-v871{
    min-width:0 !important;
    max-width:100% !important;
    width:100% !important;
    grid-column:1 !important;
    overflow:visible !important;
  }

  html body.price-list-table-layout-rootfix-v965 .price-xxx-sidebar-v871,
  html body.price-list-table-layout-rootfix-v965 .price-sidebar-emergency-standard-v889,
  html body.price-list-table-layout-rootfix-v965 .price-sidebar-v917,
  html body.price-list-table-layout-rootfix-v965 aside.emergency-sidebar-v787FR{
    grid-column:2 !important;
    width:var(--price-sidebar-v965) !important;
    min-width:var(--price-sidebar-v965) !important;
    max-width:var(--price-sidebar-v965) !important;
    justify-self:end !important;
    align-self:start !important;
    position:sticky !important;
    top:104px !important;
    transform:none !important;
  }

  /* Remove the second centering rail inside the left column. That inner .container
     used to create invisible side padding and made the table look narrower than the lane. */
  html body.price-list-table-layout-rootfix-v965 .price-xxx-main-v871 .fees-main-rail-v438G,
  html body.price-list-table-layout-rootfix-v965 .price-xxx-main-v871 #visa-service-fees,
  html body.price-list-table-layout-rootfix-v965 .price-xxx-main-v871 #visa-service-fees > .container{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    overflow:visible !important;
  }

  /* Table shell: clear full-width box with a permanent right edge. */
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-wrap-v787DN{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:18px 0 0 0 !important;
    border:2px solid var(--price-table-border-v965) !important;
    border-radius:0 !important;
    overflow:hidden !important;
    background:#fff !important;
    box-shadow:0 8px 22px rgba(16,54,96,.06), inset -2px 0 0 var(--price-table-border-v965) !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-compact-v787EP{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    table-layout:fixed !important;
    border-collapse:separate !important;
    border-spacing:0 !important;
    background:#fff !important;
    font-size:16px !important;
  }

  /* Stable 5-column proportions. Wider first column, four equal price columns. */
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN thead th:first-child,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN tbody th.fees-matrix-processing-v787EP{
    width:28% !important;
    min-width:0 !important;
    max-width:none !important;
    white-space:normal !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN thead th:nth-child(n+2),
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN tbody td{
    width:18% !important;
    min-width:0 !important;
    max-width:none !important;
  }

  /* Compact vertical rhythm. This overrides v929 and v951 oversized padding/font rules. */
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN th,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN td{
    padding:12px 14px !important;
    line-height:1.24 !important;
    vertical-align:middle !important;
    border-right:2px solid var(--price-table-border-v965) !important;
    border-bottom:2px solid var(--price-table-border-v965) !important;
    height:auto !important;
    min-height:0 !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN thead th{
    padding-top:16px !important;
    padding-bottom:16px !important;
    font-size:17px !important;
    line-height:1.22 !important;
    font-weight:900 !important;
    text-align:center !important;
    color:#fff !important;
    background:var(--price-table-blue-v965) !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN thead th:first-child{
    color:#0b2f54 !important;
    text-align:left !important;
    background:var(--price-table-left-v965) !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN tbody th,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN tbody th.fees-matrix-processing-v787EP{
    font-size:16px !important;
    line-height:1.24 !important;
    font-weight:900 !important;
    color:#0b2f54 !important;
    background:var(--price-table-left-v965) !important;
    text-align:left !important;
    position:static !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN tbody td,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN .fees-matrix-cell-v787EP{
    text-align:center !important;
    background:#fbfdff !important;
    font-size:20px !important;
    line-height:1.15 !important;
    position:static !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN tbody tr:nth-child(even) td{
    background:var(--price-table-soft-v965) !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN .fees-matrix-total-v787DN{
    font-size:22px !important;
    line-height:1.05 !important;
    font-weight:900 !important;
    color:var(--price-table-red-v965) !important;
    white-space:nowrap !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN .fees-matrix-quote-v787DN{
    font-size:15px !important;
    line-height:1.22 !important;
    font-weight:900 !important;
    color:#0c5f9f !important;
  }

  /* Restore the missing right border. Older themes intentionally set last-child
     border-right:0; with the current wrapper this made the table look cut off. */
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN tr > *:last-child,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN th:last-child,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN td:last-child{
    border-right:2px solid var(--price-table-border-v965) !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN tbody tr:last-child > *{
    border-bottom:0 !important;
  }

  /* Keep the blue note aligned with the table width. */
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .nationality-fee-note-v598U,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-consolidated-intro-v787DN{
    max-width:100% !important;
  }
}

/* Medium desktop/narrow laptop: keep sidebar, but allow a horizontal scroll only if truly needed. */
@media (min-width:981px) and (max-width:1240px){
  html body.price-list-table-layout-rootfix-v965{
    --price-shell-v965: calc(100vw - 48px);
    --price-sidebar-v965: 300px;
    --price-gap-v965: 20px;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-wrap-v787DN{
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN{
    min-width:900px !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN thead th{
    font-size:16px !important;
    padding:15px 12px !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN th,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN td{
    padding:11px 12px !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN .fees-matrix-total-v787DN{
    font-size:21px !important;
  }
}

/* Tablet/mobile: stack the sidebar and use a controlled scrollable matrix. */
@media (max-width:980px){
  html body.price-list-table-layout-rootfix-v965 .price-xxx-layout-v871.container,
  html body.price-list-table-layout-rootfix-v965 .price-xxx-layout-v871{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:min(100%, calc(100vw - 32px)) !important;
    max-width:min(100%, calc(100vw - 32px)) !important;
    gap:22px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    overflow:visible !important;
  }

  html body.price-list-table-layout-rootfix-v965 .price-xxx-main-v871,
  html body.price-list-table-layout-rootfix-v965 .price-xxx-main-v871 .fees-main-rail-v438G,
  html body.price-list-table-layout-rootfix-v965 .price-xxx-main-v871 #visa-service-fees,
  html body.price-list-table-layout-rootfix-v965 .price-xxx-main-v871 #visa-service-fees > .container{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-wrap-v787DN{
    width:100% !important;
    max-width:100% !important;
    border:2px solid #c8d7e6 !important;
    border-radius:14px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    box-shadow:0 8px 20px rgba(16,54,96,.06), inset -2px 0 0 #c8d7e6 !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN{
    min-width:860px !important;
    table-layout:fixed !important;
    border-collapse:separate !important;
    border-spacing:0 !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN th,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN td{
    padding:11px 12px !important;
    line-height:1.22 !important;
    border-right:2px solid #c8d7e6 !important;
    border-bottom:2px solid #c8d7e6 !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN thead th{
    font-size:15px !important;
    line-height:1.2 !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN tbody th{
    font-size:15px !important;
    white-space:normal !important;
    position:static !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN .fees-matrix-total-v787DN{
    font-size:20px !important;
  }

  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN tr > *:last-child,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN th:last-child,
  html body.price-list-table-layout-rootfix-v965 #visa-service-fees .fees-matrix-v787DN td:last-child{
    border-right:2px solid #c8d7e6 !important;
  }
}
