/* ============================================================
   Printable Weather
   Screen: button only. Print: layout + borders, nothing else.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&family=IM+Fell+English:ital@0;1&family=Crimson+Pro:ital,wght@0,400;1,400&display=swap');

/* --- Variables (mirrors ledger.css) --- */
:root {
  --ink:          #2b1d0e;
  --ink-faded:    #5c4530;
  --gold:         #c9920a;
  --gold-bright:  #e8b02a;

  --font-italic:  'IM Fell English', Georgia, serif;
}

/* ============================================================
   Screen — button only
   ============================================================ */

/* Button styled to match ledger.css .create-button */
.send-printer {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 0.88rem;
  border-radius: 1px;
  border: 1px solid var(--gold);
  padding: 0.3rem 0.9rem;
  cursor: pointer;
  letter-spacing: 0.03em;
  background: var(--ink);
  color: var(--gold-bright);
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.3);
  margin-bottom: 1.25rem;
  display: inline-block;
  transition: background 0.15s, transform 0.1s, box-shadow 0.15s;
}

.send-printer:hover {
  background: var(--ink-faded);
  box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.35);
  transform: translateY(-1px);
}

.send-printer:active {
  transform: translateY(1px);
  box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
}


  /* --- Page setup: landscape 8.5×11 --- */
  @page {
    size: 11in 8.5in landscape;
    margin: 0.45in 0.5in;
  }

  body {
      background: #fff;
      color: #000
    padding: 0;
    margin: 0;
  }

  /* --- Printable section wrapper --- */
  .printable-section {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(8.5in - 0.9in); /* full page height minus top+bottom margins */
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* --- Header: spans full grid width --- */
  .printable-weather-header {
    border-bottom: 1px solid black;
    padding-bottom: 0.3rem;
    margin-bottom: 0.45rem;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 2.5rem;
    flex-shrink: 0;
  }

  /* --- Cell grid: 7 columns × 5 rows --- */
  .printable-weather-cells {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(5, 1fr);
    /* Collapse borders: outer border on the container, inner borders on cells */
    border-top: 1px solid black;
    border-left: 1px solid black;
    width: 100%;
    flex: 1; /* fill remaining height after header */
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* --- Individual weather cell --- */
  .printable-weather-cell {
    border-right: 1px solid black;
    border-bottom: 1px solid black;
    padding: 0.2rem 0.3rem;
    font-size: 0.9rem;
    line-height: 1.35;
    overflow: hidden;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* --- dl label/value alignment --- */
  .printable-weather-cell dl {
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 0.3rem;
    row-gap: 0;
    align-items: baseline;
  }

  .printable-weather-cell dt,
  .printable-weather-cell dd {
    margin: 0;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .printable-weather-cell dt {
    font-weight: normal; /* label column */
  }

  .printable-weather-cell dd {
    font-style: normal; /* value column */
  }

/* ============================================================
   Print styles
   ============================================================ */

@media print {

  /* --- Page setup: landscape 8.5×11 --- */
  @page {
    size: 11in 8.5in landscape;
    margin: 0.45in 0.5in;
  }

  /* Hide everything outside the printable section */
  body > *:not(.printable-section) {
    display: none !important;
  }

  body {
    padding: 0;
    margin: 0;
  }

  /* --- Printable section wrapper --- */
  .printable-section {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(8.5in - 0.9in); /* full page height minus top+bottom margins */
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* --- Header: spans full grid width --- */
  .printable-weather-header {
    border-bottom: 1px solid black;
    padding-bottom: 0.3rem;
    margin-bottom: 0.45rem;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 2.5rem;
    flex-shrink: 0;
  }

  /* --- Cell grid: 7 columns × 5 rows --- */
  .printable-weather-cells {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(5, 1fr);
    /* Collapse borders: outer border on the container, inner borders on cells */
    border-top: 1px solid black;
    border-left: 1px solid black;
    width: 100%;
    flex: 1; /* fill remaining height after header */
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* --- Individual weather cell --- */
  .printable-weather-cell {
    border-right: 1px solid black;
    border-bottom: 1px solid black;
    padding: 0.2rem 0.3rem;
    font-size: 0.9rem;
    line-height: 1.35;
    overflow: hidden;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* --- dl label/value alignment --- */
  .printable-weather-cell dl {
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 0.3rem;
    row-gap: 0;
    align-items: baseline;
  }

  .printable-weather-cell dt,
  .printable-weather-cell dd {
    margin: 0;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .printable-weather-cell dt {
    font-weight: normal; /* label column */
  }

  .printable-weather-cell dd {
    font-style: normal; /* value column */
  }
}
