/* Packminder results-page and print polish. */

/* Clear, conventional undo / redo icons instead of ambiguous curly arrows. */
#packingView .history-actions .icon-btn{
  position:relative;
  font-size:0!important;
  display:grid!important;
  place-items:center!important;
}
#packingView #undoBtn::before,
#packingView #redoBtn::before{
  display:block;
  color:currentColor;
  font-size:1.45rem;
  line-height:1;
  font-weight:700;
}
#packingView #undoBtn::before{content:'↩'}
#packingView #redoBtn::before{content:'↪'}

/* Results hero: flag, destination and countdown should feel like one balanced row. */
#packingView .trip-theme-bar{
  align-items:center!important;
  gap:16px!important;
  padding:18px 20px!important;
}
#packingView .trip-identity{
  align-items:center!important;
  gap:14px!important;
  min-width:0;
}
#packingView .destination-flag{
  width:58px!important;
  height:58px!important;
  flex:0 0 58px!important;
  border-radius:16px!important;
}
#packingView .trip-identity>div{min-width:0}
#packingView .trip-meta{
  display:block;
  font-size:.8rem!important;
  line-height:1.35!important;
}
#packingView .trip-theme-bar h2{
  font-size:clamp(2rem,4.4vw,3.25rem)!important;
  line-height:.95!important;
  margin:5px 0 0!important;
}

/* Real-trip calendar stays secondary to the destination. */
#packingView .countdown-card{
  width:58px!important;
  min-width:58px!important;
  max-width:58px!important;
  height:70px!important;
  min-height:70px!important;
  flex:0 0 58px!important;
  filter:drop-shadow(0 3px 0 var(--cal-shadow)) drop-shadow(0 4px 5px rgba(16,33,59,.11))!important;
}
#packingView .countdown-card::before{
  width:5px!important;
  height:14px!important;
  top:-6px!important;
  left:5px!important;
  box-shadow:
    0 2px 0 rgba(74,84,94,.72),
    11px 0 0 #f8f8f8,11px 2px 0 rgba(74,84,94,.72),
    22px 0 0 #f8f8f8,22px 2px 0 rgba(74,84,94,.72),
    33px 0 0 #f8f8f8,33px 2px 0 rgba(74,84,94,.72),
    44px 0 0 #f8f8f8,44px 2px 0 rgba(74,84,94,.72)!important;
}
#packingView .countdown-card span{height:22px!important}
#packingView .countdown-card span::after{font-size:7.4px!important}
#packingView .countdown-card strong{
  height:48px!important;
  min-height:48px!important;
  font-size:30px!important;
  padding-bottom:2px!important;
}
#packingView .countdown-card::after{border-width:0 0 10px 10px!important}

/* Desktop packing cards should line up cleanly in each grid row. */
@media (min-width:901px){
  #packingView .checklist-grid{align-items:stretch}
  #packingView .category-card{align-self:stretch;display:flex;flex-direction:column;height:100%}
  #packingView .category-card.collapsed{align-self:start;height:auto}
  #packingView .category-body{display:flex;flex-direction:column;flex:1}
  /* Keep every checklist row at its normal compact height. The outer cards still match
     the tallest card in each desktop grid row; spare height stays as blank space instead
     of being distributed between the shorter card's items. */
  #packingView .category-items{
    flex:0 0 auto;
    align-content:start;
    grid-auto-rows:max-content;
  }
  #packingView .inline-add{margin-top:auto}
}

@media (max-width:680px){
  #packingView .trip-theme-bar{
    padding:15px 16px!important;
    gap:11px!important;
    align-items:center!important;
  }
  #packingView .trip-identity{gap:10px!important;align-items:center!important}
  #packingView .destination-flag{
    width:52px!important;
    height:52px!important;
    flex-basis:52px!important;
    border-radius:14px!important;
    background-size:34px 21px!important;
  }
  #packingView .trip-meta{font-size:.72rem!important;line-height:1.3!important}
  #packingView .trip-theme-bar h2{
    font-size:2rem!important;
    line-height:.95!important;
    margin-top:4px!important;
  }
  #packingView .countdown-card{
    width:48px!important;
    min-width:48px!important;
    max-width:48px!important;
    height:58px!important;
    min-height:58px!important;
    flex-basis:48px!important;
  }
  #packingView .countdown-card::before{
    width:4px!important;height:12px!important;top:-5px!important;left:4px!important;
    box-shadow:
      0 2px 0 rgba(74,84,94,.72),
      9px 0 0 #f8f8f8,9px 2px 0 rgba(74,84,94,.72),
      18px 0 0 #f8f8f8,18px 2px 0 rgba(74,84,94,.72),
      27px 0 0 #f8f8f8,27px 2px 0 rgba(74,84,94,.72),
      36px 0 0 #f8f8f8,36px 2px 0 rgba(74,84,94,.72)!important;
  }
  #packingView .countdown-card span{height:18px!important}
  #packingView .countdown-card span::after{font-size:6.2px!important}
  #packingView .countdown-card strong{height:40px!important;min-height:40px!important;font-size:25px!important;padding-bottom:1px!important}
  #packingView .countdown-card::after{border-width:0 0 8px 8px!important}
}

/* Reliable local image flags for results where platform emoji renders as letters. */
.destination-flag.flag-image{
  font-size:0!important;
  background-color:var(--surface);
  background-position:center;
  background-repeat:no-repeat;
  background-size:36px 22px;
}

/* A printout should be a compact paper checklist, not a screenshot of the app. */
@media print{
  @page{size:A4 portrait;margin:10mm}
  *{-webkit-print-color-adjust:economy!important;print-color-adjust:economy!important;box-shadow:none!important;text-shadow:none!important}
  html,body{background:#fff!important;color:#000!important}
  body{font-family:Arial,Helvetica,sans-serif!important;font-size:10pt!important}
  .app-shell{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
  #packingView{display:block!important;padding:0!important}

  .ambient,.site-header,
  #packingView .trip-action-row,
  #packingView .pm-workspace-tabs,
  #packingView .weather-card,
  #packingView .notices,
  #packingView .progress-card,
  #packingView .list-toolbar,
  #packingView .brain-dump-card,
  #packingView .custom-section-tools,
  #packingView .ready-card,
  #packingView .inline-add,
  #packingView .remove-item,
  #packingView .info-btn,
  #packingView .item-reason,
  #packingView .countdown-card,
  #packingView .destination-flag,
  #packingView .trip-theme-bar::after,
  #packingView .airline-card,
  #packingView .pm-quick-review,
  #packingView .site-footer,
  #packingView .pm-shared-footer,
  .pm-reviews-shell{display:none!important}
  body.pm-printing-checklist #packingView .trip-action-row,
  body.pm-printing-checklist #packingView .pm-quick-review,
  body.pm-printing-checklist #packingView .site-footer,
  body.pm-printing-checklist #packingView .pm-shared-footer{display:none!important}

  .trip-theme-bar{
    display:block!important;
    background:#fff!important;
    border:0!important;
    border-bottom:2px solid #000!important;
    border-radius:0!important;
    padding:0 0 5mm!important;
    margin:0 0 5mm!important;
    overflow:visible!important;
  }
  .trip-identity{display:block!important}
  .trip-theme-bar h2{font-size:23pt!important;line-height:1!important;letter-spacing:-.02em!important;margin:0 0 2mm!important;color:#000!important}
  .trip-meta{font-size:9pt!important;font-weight:600!important;color:#333!important}

  .checklist-grid{margin:0!important}
  .category-card{
    display:inline-block!important;
    width:100%!important;
    height:auto!important;
    margin:0 0 5mm!important;
    border:1px solid #777!important;
    border-radius:3mm!important;
    background:#fff!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
    overflow:hidden!important;
  }
  #packingView #pmTabChecklistPanel{display:block!important}
  #packingView #checklist{display:block!important;columns:2;column-gap:7mm}
  #packingView .category-card,
  #packingView .category-card.collapsed{display:inline-block!important;height:auto!important;visibility:visible!important}
  #packingView .category-card.collapsed{height:auto!important}
  .category-head{
    min-height:0!important;
    padding:2.5mm 3mm!important;
    background:#fff!important;
    color:#000!important;
    border-bottom:1px solid #aaa!important;
  }
  .category-title-wrap{gap:0!important}
  .category-icon,.category-count,.collapse-btn{display:none!important}
  .category-title-wrap h3{font-size:12pt!important;margin:0!important;color:#000!important}
  .category-body,.category-card.collapsed .category-body{display:block!important;padding:1.5mm 3mm 2mm!important;background:#fff!important}
  .category-items{display:block!important}
  .category-empty{display:none!important}
  .check-item{
    display:grid!important;
    grid-template-columns:5mm 1fr!important;
    gap:2mm!important;
    min-height:7mm!important;
    padding:1.2mm 0!important;
    border-bottom:1px solid #ddd!important;
    color:#000!important;
  }
  .check-item:last-child{border-bottom:0!important}
  .check-item[hidden]{display:grid!important}
  .check-item input[type="checkbox"]{
    appearance:none!important;
    -webkit-appearance:none!important;
    width:4.2mm!important;
    height:4.2mm!important;
    margin:0!important;
    border:1.2px solid #000!important;
    border-radius:.7mm!important;
    background:#fff!important;
    align-self:center!important;
  }
  .check-item input[type="checkbox"]:checked::after{
    content:"✓";
    display:block;
    font-size:9pt;
    line-height:3.5mm;
    text-align:center;
    color:#000;
  }
  .item-copy{display:block!important;min-width:0!important}
  .item-label{display:block!important}
  .item-label label{font-size:10pt!important;line-height:1.25!important;color:#000!important;text-decoration:none!important}
  .check-item.done label{color:#444!important;text-decoration:line-through!important;text-decoration-thickness:1.2px!important}
  .check-item.done{opacity:.78!important}

  body:has(#packingView.active) > .site-footer,
  body:has(#packingView.active) .app-shell > .site-footer,
  #packingView.active ~ .site-footer{display:none!important}

  #packingView::after{
    content:"Packminder · Nothing left to remember.";
    display:block;
    margin-top:4mm;
    padding-top:3mm;
    border-top:1px solid #bbb;
    color:#666;
    font-size:8pt;
    text-align:center;
  }
}
