/* Calendar: a clear weekly planner, with a complete shelf for the selected day. */
#kalendarz { background: #f4e8e0; background-image: radial-gradient(ellipse at top left, #fbf4ee 0, transparent 60%); padding: 62px 0 46px; border-block: 1px solid #e8d8cc; scroll-margin-top: 20px; }
#kalendarz .section-heading { align-items: center; gap: 24px; margin-bottom: 30px; }
#kalendarz .section-heading h2 { font-size: clamp(38px, 4.2vw, 58px); }
#kalendarz .section-heading .eyebrow { color: #855d49; font-size: 10px; letter-spacing: .16em; margin-bottom: 10px; }
.calendar-intro { color: #765f51; font-size: 14px; margin-top: 12px; }
#kalendarz .calendar-help { background: #fffaf5; border: 1px solid #e3d2c5; border-radius: 24px; padding: 10px 16px; min-height: 44px; gap: 8px; margin: 0; white-space: nowrap; font-size: 12px; }
#kalendarz .calendar-help .icon { width: 16px; height: 16px; }
.calendar-planner { background: var(--paper); padding: 24px 26px 18px; border: 1px solid #e5d4c7; border-radius: 20px; box-shadow: 0 6px 30px #78452606; }
.calendar-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 18px; margin-bottom: 22px; }
.calendar-month { display: flex; align-items: center; gap: 13px; }
.calendar-month-icon { display: grid; place-items: center; width: 46px; height: 46px; background: #f4e8df; color: #8b5d46; border-radius: 14px; }
.calendar-month h3 { font-size: 29px; font-weight: 600; }
.calendar-month h3 span { color: #8b7060; font-weight: 400; }
.calendar-month p { font-size: 12px; color: #7c695b; margin-top: 4px; }
.calendar-date-controls { display: flex; align-items: center; gap: 18px; }
.calendar-today { min-height: 44px; border: 1px solid #d9c2b1; border-radius: 24px; background: #fffdfa; padding: 8px 16px; font-size: 12px; font-weight: 500; }
.calendar-date-controls .carousel-controls { gap: 6px; }
.calendar-date-controls .icon-button { width: 44px; height: 44px; border-color: #dfcfc3; background: #fffdfa; }
#kalendarz .calendar-days { grid-template-columns: repeat(7,minmax(0,1fr)); gap: 10px; margin: 0; padding: 5px 3px 10px; scroll-snap-type: x proximity; }
#kalendarz .calendar-day { min-height: 148px; padding: 16px 8px 10px; gap: 8px; border-radius: 12px; background: #faf6f1; border: 1px solid transparent; color: #6c5140; scroll-snap-align: center; }
.day-name { font-size: 12px; line-height: 1.3; font-weight: 500; white-space: nowrap; }
#kalendarz .day-number { font-size: 42px; line-height: 1; font-weight: 600; color: var(--chocolate); }
.day-count { font-size: 11px; line-height: 1.3; color: #7f6859; }
.day-status { min-height: 21px; font-size: 10px; line-height: 15px; padding: 3px 9px; border-radius: 20px; font-weight: 500; }
#kalendarz .calendar-day.is-today { border-color: #b98769; }
.calendar-day.is-today .day-status { color: #875234; background: #efdfd2; }
#kalendarz .calendar-day.is-selected { background: #593825; color: #fffaf2; border-color: #593825; box-shadow: 0 5px 12px #59382519; }
#kalendarz .calendar-day.is-selected .day-number { color: #fffaf2; }
.calendar-day.is-selected .day-count { color: #ecdbcc; }
.calendar-day.is-selected .day-status { background: #78543c; color: #fffaf2; }
.calendar-day > .icon { position: absolute; right: 8px; top: 8px; width: 13px; height: 13px; color: #f1d5bc; }
.calendar-legend { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 21px; font-size: 10px; color: #806a5b; margin-top: 7px; }
.calendar-legend > span { display: inline-flex; align-items: center; gap: 7px; }
.calendar-legend i { display: block; width: 7px; height: 7px; border-radius: 50%; }
.legend-selected { background: #593825; }
.legend-today { border: 1px solid #a5795a; background: transparent; }
.calendar-legend .calendar-snapshot { margin-left: auto; color: #8d7868; }
.calendar-swipe-note { display: none; }
#calendar-offer-panel { margin-top: 31px; outline-offset: 6px; }
#kalendarz .calendar-offer-heading { margin: 0 0 19px; gap: 20px; }
#kalendarz .offer-kicker { font-size: 10px; color: #89634d; letter-spacing: .13em; }
#kalendarz .calendar-offer-heading h3 { font-size: clamp(28px,3vw,36px); margin-top: 7px; max-width: none; line-height: 1.15; }
#kalendarz .calendar-offer-heading h3 em { color: #94624a; white-space: nowrap; }
#kalendarz #calendar-offer-caption { margin-top: 9px; font-size: 12px; color: #78604f; max-width: none; }
.calendar-offer-promo { display: flex; align-items: center; gap: 12px; flex-shrink: 0; background: #ead4c2; padding: 13px 18px; border: 1px solid #e0c5af; border-radius: 12px; color: #855035; }
.calendar-offer-promo strong { font: 600 29px/1 var(--serif); white-space: nowrap; }
.calendar-offer-promo span { font-size: 10px; line-height: 1.5; }
.calendar-filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.calendar-filter { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 8px 15px; border: 1px solid #dbc7b8; border-radius: 24px; background: transparent; font-size: 12px; }
.calendar-filter > span { background: #e9dace; border-radius: 20px; min-width: 21px; padding: 1px 6px; line-height: 18px; text-align: center; font-size: 10px; color: #6f513e; }
.calendar-filter.is-active { color: #fffaf3; background: #593825; border-color: #593825; }
.calendar-filter.is-active > span { background: #7e5c44; color: #fffaf3; }
#kalendarz .calendar-products { display: grid; grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; overflow: visible; margin: 0; padding: 0; scroll-snap-type: none; }
#kalendarz .product-card { border-radius: 16px; border-color: #e3d2c5; padding: 10px; box-shadow: 0 3px 12px #6a3e2504; }
#kalendarz .product-image-wrap { aspect-ratio: 1.75; border-radius: 10px; background: #f5ece2; }
#kalendarz .product-image-wrap > img { padding: 2px; }
#kalendarz .product-info { padding: 16px 9px 7px; }
#kalendarz .product-info h3 { font-size: 28px; margin-block: 7px 16px; min-height: 2.18em; }
#kalendarz .product-category { font-size: 9px; }
#kalendarz .product-price { min-height: 29px; gap: 6px; }
#kalendarz .product-price strong { font-size: 19px; }
#kalendarz .product-bottom { margin-top: 7px; padding-top: 12px; gap: 8px; }
#kalendarz .product-unit-short { font-size: 12px; }
#kalendarz .product-add { width: auto; min-height: 44px; height: auto; padding: 9px 14px; border-radius: 8px; gap: 14px; background: #f2e5da; border-color: #ddc4b1; font-size: 12px; font-weight: 500; }
#kalendarz .product-add .icon { width: 16px; height: 16px; }
.calendar-empty { padding: 40px 20px; border: 1px dashed #c9ad98; border-radius: 16px; text-align: center; background: #fffaf6a6; }
.calendar-empty > .icon { margin: 0 auto 14px; width: 30px; height: 30px; color: #a57960; }
.calendar-empty h4 { margin: 0; font: 500 28px/1.2 var(--serif); }
.calendar-empty p { margin-top: 8px; font-size: 13px; color: #816752; }
.calendar-empty button { margin-top: 20px; }
#kalendarz .calendar-bottom { margin-top: 23px; gap: 20px; flex-wrap: wrap; }
#kalendarz .calendar-bottom > p { max-width: none; display: flex; gap: 8px; align-items: flex-start; font-size: 11px; color: #7b6150; }
#kalendarz .calendar-bottom .icon { width: 15px; height: 15px; margin-top: 1px; }
.calendar-bottom > span { color: #8c7462; font-size: 10px; white-space: nowrap; }
@media (hover:hover) {
  #kalendarz .calendar-day:not(.is-selected):hover { background: #f1e4d8; border-color: #c7a88f; }
  .calendar-filter:not(.is-active):hover, .calendar-today:hover { background: #fff8f1; border-color: #ac8060; }
  #kalendarz .product-add:hover { background: #593825; color: #fffaf3; border-color: #593825; }
}
@media (max-width:1000px) {
  .calendar-planner { padding-inline: 18px; }
  #kalendarz .calendar-day { padding-inline: 4px; }
  .day-name { font-size: 11px; }
  #kalendarz .calendar-days { gap: 7px; }
  #kalendarz .calendar-products { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
}
@media (max-width:700px) {
  #kalendarz { padding-block: 36px 30px; }
  #kalendarz .section-heading { flex-wrap: wrap; gap: 12px; margin-bottom: 23px; }
  #kalendarz .section-heading .eyebrow { font-size: 9px; margin-bottom: 8px; }
  .calendar-intro { font-size: 13px; margin-top: 9px; }
  #kalendarz .calendar-help { font-size: 11px; padding-inline: 12px; }
  .calendar-planner { padding: 19px 14px 15px; border-radius: 16px; }
  .calendar-toolbar { flex-wrap: wrap; gap: 14px; margin-bottom: 12px; }
  .calendar-month-icon { display: none; }
  .calendar-month h3 { font-size: 27px; }
  .calendar-month p { font-size: 11px; }
  .calendar-date-controls { gap: 9px; }
  .calendar-today { font-size: 11px; padding-inline: 11px; }
  .calendar-date-controls .carousel-controls { gap: 4px; }
  #kalendarz .calendar-days { grid-template-columns: repeat(7,minmax(100px,1fr)); gap: 8px; padding-block: 5px 10px; }
  #kalendarz .calendar-day { min-height: 136px; gap: 6px; padding: 15px 5px 8px; }
  #kalendarz .day-number { font-size: 38px; }
  .day-name { font-size: 11px; }
  .calendar-swipe-note { display: flex; align-items: center; gap: 7px; margin: 4px 0 12px; font-size: 10px; color: #8c7261; }
  .calendar-swipe-note .icon { width: 15px; height: 15px; }
  .calendar-legend { gap: 7px 15px; font-size: 9px; margin-top: 0; }
  .calendar-legend .calendar-snapshot { font-size: 9px; }
  #calendar-offer-panel { margin-top: 25px; }
  #kalendarz .calendar-offer-heading { gap: 13px; align-items: flex-start; flex-wrap: wrap; }
  #kalendarz .calendar-offer-heading h3 { font-size: 30px; }
  .calendar-offer-promo { padding: 10px 13px; gap: 10px; border-radius: 10px; }
  .calendar-offer-promo strong { font-size: 25px; }
  .calendar-offer-promo br { display: none; }
  .calendar-offer-promo span { font-size: 10px; }
  .calendar-filter-row { gap: 7px; margin-bottom: 18px; }
  .calendar-filter { padding: 7px 11px; font-size: 11px; gap: 7px; }
  #kalendarz .product-info h3 { font-size: 25px; }
}
@media (max-width:480px) {
  #kalendarz .section-heading { display: block; }
  #kalendarz .calendar-help { margin-top: 14px; }
  .calendar-toolbar { display: grid; grid-template-columns: 1fr; gap: 12px; }
  .calendar-date-controls { justify-content: space-between; }
  .calendar-legend .calendar-snapshot { width: 100%; margin-left: 0; margin-top: 2px; }
  #kalendarz .calendar-offer-heading h3 { font-size: 29px; }
  #kalendarz .calendar-offer-heading h3 em { display: block; margin-top: 2px; }
  #kalendarz .calendar-products { grid-template-columns: 1fr; gap: 12px; }
  #kalendarz .product-card { display: grid; grid-template-columns: 112px minmax(0,1fr); gap: 12px; padding: 9px; border-radius: 13px; }
  #kalendarz .product-image-wrap { height: 100%; min-height: 183px; aspect-ratio: auto; border-radius: 8px; }
  #kalendarz .product-image-wrap > img { padding: 0; }
  #kalendarz .product-badges { left: 5px; right: 5px; top: 7px; }
  #kalendarz .product-badge { padding: 3px 6px; font-size: 10px; }
  #kalendarz .product-info { padding: 7px 1px; }
  #kalendarz .product-category { font-size: 8px; letter-spacing: .08em; }
  #kalendarz .product-info h3 { font-size: 23px; min-height: 0; margin: 6px 0 12px; display: block; overflow: visible; line-height: 1.06; }
  #kalendarz .product-price strong { font-size: 17px; }
  #kalendarz .product-price del { font-size: 10px; }
  #kalendarz .product-bottom { flex-wrap: wrap; margin-top: auto; padding-top: 8px; border: 0; gap: 8px; }
  #kalendarz .product-unit-short { font-size: 10px; }
  #kalendarz .product-add { width: 100%; justify-content: space-between; padding: 8px 12px; font-size: 11px; }
}
@media (max-width:359px) {
  #kalendarz .product-card { grid-template-columns: 89px minmax(0,1fr); gap: 9px; }
  #kalendarz .product-info h3 { font-size: 22px; }
}