/* Phone layout for the table-based pages.
   Loaded after the section stylesheets; only active on narrow screens.
   A layout table is either marked class="m-stack" or recognised by the
   usual fixed-width side columns (144/168px left, 146/196px right).
   Its rows are stacked vertically, with the main content first. */

@media (max-width: 760px) {
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body { margin: 0 !important; overflow-x: hidden; }
  center { display: block; }

  /* Layout tables: stack the columns */
  table.m-stack, table.m-stack > tbody,
  table:has(> tbody > tr > td:is([width="144"], [width="146"], [width="168"], [width="196"])),
  table:has(> tbody > tr > td:is([width="144"], [width="146"], [width="168"], [width="196"])) > tbody {
    display: block;
    width: 100% !important;
  }
  table.m-stack > tbody > tr,
  table:has(> tbody > tr > td:is([width="144"], [width="146"], [width="168"], [width="196"])) > tbody > tr {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  table.m-stack > tbody > tr > td,
  table:has(> tbody > tr > td:is([width="144"], [width="146"], [width="168"], [width="196"])) > tbody > tr > td {
    display: block;
    width: auto !important;
    max-width: 100%;
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
  }
  /* Main content first, navigation and side boxes after it */
  td:is([width="144"], [width="168"]) { order: 2; }
  td:is([width="146"], [width="196"]) { order: 3; }
  table.m-stack > tbody > tr > td.navbar { order: 2; }
  td[nowrap] { white-space: normal !important; }
  tr[height], td[height] { height: auto !important; }
  td:is([width="144"], [width="168"], [width="146"], [width="196"]) > table { width: 100% !important; }

  /* Spacer cells and spacer GIFs only push things sideways */
  td:has(> img[src*="space.gif"]:only-child),
  td:is([width="10"], [width="20"]):not(:has(> :not(img, br))):not(:has(> img:not([src*="space.gif"]))) { display: none !important; }
  img[src*="space.gif"] { display: none !important; }

  /* Nothing wider than the screen */
  img, iframe, embed, object, video { max-width: 100% !important; height: auto !important; }
  table { max-width: 100% !important; }
  td, th { word-wrap: break-word; overflow-wrap: anywhere; }
  pre { white-space: pre-wrap; }
  ins.adsbygoogle { max-width: 100%; }

  /* Readable text: at least 15px, keeping the larger heading styles */
  :is(body, td, th, p, li, dd, dt, div, span, a, font, b, strong, i, em, input, select, textarea, label)
  :not(.t12, .t14, .nota, .titulo12, .titulo12blue, .titulo12brown, .titulo12red, .titulo12violet,
       .titulo16blue, .titulo18, .titulo18brown, .titulo18violet,
       font[size="3"], font[size="4"], font[size="5"], font[size="6"], font[size="7"], font[size^="+"]) {
    font-size: max(15px, 1em) !important;
    line-height: 1.45;
  }
  .seccao { font-size: 18px !important; }

  /* Comfortable tap targets in the menus */
  a.navbar { display: inline-block; padding: 4px 0; }
  input[type="text"], input[type="email"], select, textarea { max-width: 100%; box-sizing: border-box; }
  input[type="text"][size], textarea { width: 100% !important; min-width: 0; }
}
