/*
 * PlantUp — «برنامهٔ کودی» (batch 86; look and placement batch 88): crop tabs,
 * a stage slider with a step bar, method chips, product rows and whole-season
 * baskets. Loaded only where the section renders (the front page, the
 * /fertilizer-programs/ page, pages that embed [plantup_programs]).
 * Tokens come from plantup.css (:root). RTL-first; logical properties only.
 *
 * Batch 88: the section is a green band again — the series band it replaced
 * was one, and without it the programs ran into the products above and the
 * articles below. Crops and heading sit on the green; the program itself is a
 * light card. On the page the band is the header and the card overlaps it.
 */
.programs{--pg-band:radial-gradient(900px 420px at 88% -12%,rgba(76,154,90,.38),transparent 62%),radial-gradient(760px 380px at 4% 108%,rgba(201,118,45,.16),transparent 60%),linear-gradient(180deg,var(--deep) 0%,var(--deep-2) 100%);position:relative}
.programs--home,.programs--full{padding-block:var(--sec-gap);background:var(--pg-band);color:#eaf3ec}
.programs--page{padding-block:0 8px}
.programs--page .pg-band{background:var(--pg-band);color:#eaf3ec;padding-block:44px 112px}

/* ---- heading on the band ---- */
.pg-band .sec-head{margin-bottom:26px;max-width:760px}
.pg-band .sec-head .kicker{background:rgba(255,255,255,.1);color:#d6ead9;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.pg-intro__title{margin:0 0 10px;color:#fff}
.programs--page .pg-intro__title{font-size:clamp(26px,3.4vw,38px);line-height:1.45}
.pg-band .sec-head p{margin:0;color:#c6d6c9;line-height:1.9}

/* ---- crop tabs ---- */
.pg-crops{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,290px);gap:12px;margin:0;padding:4px 2px 6px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}
.pg-crops::-webkit-scrollbar{display:none}
.pg-crop{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:14px;align-items:center;min-width:0;padding:10px 12px;border:1.5px solid rgba(255,255,255,.16);border-radius:18px;background:rgba(255,255,255,.06);color:#eaf3ec;text-decoration:none;scroll-snap-align:start;transition:background-color .18s,border-color .18s,box-shadow .18s,transform .18s}
.pg-crop:hover{background:rgba(255,255,255,.11);border-color:rgba(255,255,255,.34);transform:translateY(-1px)}
.pg-crop:focus-visible{outline:2px solid #fff;outline-offset:3px}
.pg-crop[aria-selected="true"]{background:var(--surface);border-color:var(--surface);color:var(--deep);box-shadow:0 10px 28px rgba(6,24,14,.28)}
.pg-crop__media{width:64px;height:64px;border-radius:14px;overflow:hidden;display:grid;place-items:center;font-size:30px;background:rgba(255,255,255,.12)}
.pg-crop__media img{width:100%;height:100%;object-fit:cover}
.pg-crop__text{display:grid;gap:2px;min-width:0}
.pg-crop__name{font-weight:800;font-size:18px;line-height:1.35}
.pg-crop__meta{font-size:12.5px;color:#b9cdbd}
.pg-crop[aria-selected="true"] .pg-crop__meta{color:var(--muted)}
.pg-crop__now{font-size:12px;font-weight:700;color:#f2c48d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-crop__now[hidden]{display:none}
.pg-crop[aria-selected="true"] .pg-crop__now{color:var(--accent)}

/* ---- the program card ---- */
.pg-main{margin-top:24px}
.programs--page .pg-main{position:relative;margin-top:-84px}
.pg-panel{position:relative;background:var(--surface);color:var(--fg);border-radius:22px;padding:28px;box-shadow:0 22px 50px rgba(6,24,14,.22)}
.programs--page .pg-panel{box-shadow:0 18px 44px rgba(6,24,14,.16)}
.pg-panel[hidden]{display:none}
.pg-anchor{position:relative;top:-110px;display:block;height:0}

/* ---- panel head ---- */
.pg-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px 24px;margin-bottom:14px}
.pg-head__text{max-width:720px;min-width:0}
.pg-head__title{margin:0 0 6px;font-size:22px;color:var(--deep)}
.pg-head__intro{margin:0;color:var(--fg);line-height:1.9}
.pg-head__unit{margin:6px 0 0;font-size:13.5px;color:var(--muted)}
.pg-methods{display:flex;flex-wrap:wrap;gap:8px}
.pg-chip{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:6px 14px;border:1.5px solid var(--border);border-radius:var(--r-pill);background:var(--surface);color:var(--fg);font:inherit;font-size:13.5px;font-weight:600;white-space:nowrap;cursor:pointer}
.pg-chip span{font-size:12px;color:var(--muted);font-weight:500}
.pg-chip:hover{border-color:var(--primary)}
.pg-chip[aria-pressed="true"]{background:var(--deep);border-color:var(--deep);color:#fff}
.pg-chip[aria-pressed="true"] span{color:#cfe6d5}
.pg-chip:focus-visible{outline:2px solid var(--primary);outline-offset:2px}

/* ---- «این ماه» ---- */
.pg-now{display:flex;align-items:center;gap:10px;width:100%;margin:0 0 14px;padding:10px 14px;border:0;border-radius:12px;background:#fff4e2;color:#7a4b1f;font:inherit;font-size:14px;font-weight:600;line-height:1.7;text-align:start;cursor:pointer}
.pg-now[hidden]{display:none}
.pg-now:hover{background:#ffedd2}
.pg-now:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pg-now__dot{flex:0 0 auto;width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(201,118,45,.2)}
.pg-now.is-next .pg-now__dot{background:#b98a52;box-shadow:0 0 0 4px rgba(185,138,82,.18)}
.pg-now__text{flex:1 1 auto;min-width:0}
.pg-now__go{flex:0 0 auto;font-weight:800}

/* ---- step bar (one scrolling row on phones; every stage in view on wide screens) ---- */
.pg-steps{list-style:none;margin:0 0 16px;padding:0 0 6px;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;counter-reset:none}
@media (min-width:900px){.pg-steps{flex-wrap:wrap;overflow:visible}}
.pg-steps::-webkit-scrollbar{display:none}
.pg-steps li{flex:0 0 auto}
.pg-steps li[hidden]{display:none}
.pg-steps a{position:relative;display:flex;align-items:center;gap:8px;padding:6px 12px 6px 14px;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--border);color:var(--fg);text-decoration:none;font-size:13px;white-space:nowrap}
.pg-steps a:hover{border-color:var(--primary)}
.pg-steps__n{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--surface-alt);font-weight:700;font-size:12px}
.pg-steps a[aria-current="step"]{background:var(--primary-hover);border-color:var(--primary-hover);color:#fff}
.pg-steps a[aria-current="step"] .pg-steps__n{background:#fff;color:var(--primary-hover)}
.pg-steps li.is-now a::after,.pg-steps li.is-next a::after{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.pg-steps li.is-next a::after{background:#b98a52}
.pg-steps li.is-now a[aria-current="step"]::after{background:#ffd29c}

/* ---- slider ---- */
.pg-slider{position:relative}
/* Each slide keeps its own height (align-items:start) and the track follows the
   one in view (height set by plantup-programs.js) — otherwise every stage is as
   tall as the longest one and a two-row stage shows a big empty card. */
.pg-track{display:grid;grid-auto-flow:column;grid-auto-columns:100%;gap:16px;align-items:start;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;scrollbar-width:none;border-radius:18px;transition:height .25s ease}
.pg-track::-webkit-scrollbar{display:none}
.pg-track:focus-visible{outline:2px solid var(--primary);outline-offset:4px}
.pg-slide{scroll-snap-align:start;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);min-width:0;background:var(--surface);border:1px solid var(--border);border-radius:18px;overflow:hidden}
.pg-slide[hidden]{display:none}
.pg-slide.is-now{border-color:rgba(201,118,45,.55)}
.pg-slide__media{position:relative;margin:0;min-height:340px;background:var(--surface-alt)}
.pg-slide__media .pg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pg-slide__media figcaption{position:absolute;inset-inline:12px;inset-block-end:12px;display:flex;flex-wrap:wrap;gap:6px}
.pg-slide__num,.pg-slide__when,.pg-slide__now{display:inline-block;padding:5px 12px;border-radius:var(--r-pill);font-size:12.5px;font-weight:700;backdrop-filter:blur(4px)}
.pg-slide__num{background:rgba(31,81,51,.9);color:#fff}
.pg-slide__now{background:var(--accent);color:#fff}
.pg-slide__now[hidden]{display:none}
.pg-slide.is-next .pg-slide__now{background:rgba(122,75,31,.92)}
.pg-slide__when{background:rgba(253,251,246,.92);color:var(--deep)}
.pg-slide__body{padding:22px 24px;min-width:0}
.pg-slide__title{margin:0 0 6px;font-size:21px;color:var(--deep)}
.pg-slide__desc{margin:0 0 12px;color:var(--muted);line-height:1.9;font-size:14px}
.pg-slide__empty{margin:12px 0 0;color:var(--muted);font-size:14px}

/* ---- product rows ---- */
.pg-items{list-style:none;margin:0;padding:0}
.pg-item{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--border)}
.pg-item[hidden]{display:none}
.pg-item__media{width:48px;height:48px;border-radius:var(--r-in);background:var(--surface-alt);overflow:hidden}
.pg-item__media img{width:100%;height:100%;object-fit:cover}
.pg-item.is-farmer .pg-item__media{background:repeating-linear-gradient(135deg,#efe7da 0 6px,#f6f1e8 6px 12px)}
.pg-item__main{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;min-width:0}
.pg-item__name{font-weight:700;font-size:14.5px;line-height:1.6}
.pg-item__name a{color:inherit;text-decoration:none}
.pg-item__name a:hover{color:var(--primary-hover);text-decoration:underline;text-underline-offset:3px}
.pg-item__dose{flex-basis:100%;font-size:13.5px;line-height:1.8;color:var(--fg)}
.pg-item__note{flex-basis:100%;font-size:12.5px;color:var(--muted)}
.pg-tag{display:inline-block;padding:2px 9px;border-radius:var(--r-pill);font-size:11.5px;font-weight:700;white-space:nowrap}
.pg-tag--fertigation{background:#e2eff5;color:#21566e}
.pg-tag--foliar{background:#e5f2e7;color:#2b6638}
.pg-tag--soil{background:#f4ebdd;color:#7a4b1f}
.pg-buy{display:inline-flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:6px 10px;text-align:end}
.pg-buy__product{font-size:12.5px;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.pg-buy .price-toman{font-weight:700;font-size:14px;color:var(--deep);white-space:nowrap}
.pg-buy .price-toman small{font-weight:500;color:var(--muted);margin-inline-end:3px}
.pg-buy__form{margin:0}
.pg-buy .p-add{width:40px;height:40px;font-size:20px}
.pg-state{display:inline-block;padding:4px 10px;border-radius:var(--r-pill);background:var(--surface-alt);color:var(--muted);font-size:12px;font-weight:600;white-space:nowrap;text-decoration:none}
.pg-state--farmer{background:#f4ebdd;color:#7a4b1f}
.pg-item__main .pg-state{padding:2px 9px;font-size:11.5px;font-weight:700}
.pg-state--phone{background:#fff4e2;color:#8a5a00}

/* ---- nav row ---- */
.pg-navrow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}
.pg-nav{min-height:44px;padding:8px 18px;border:1.5px solid var(--deep);border-radius:var(--r-pill);background:var(--surface);color:var(--deep);font:inherit;font-weight:700;cursor:pointer}
.pg-nav:hover:not([disabled]){background:var(--deep);color:#fff}
.pg-nav[disabled]{opacity:.38;cursor:default}
.pg-nav:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.pg-counter{margin:0;font-weight:700;color:var(--deep);font-size:14px}

/* ---- homepage: on to the page ---- */
.pg-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;margin-top:20px;padding:16px 20px;border-radius:16px;background:linear-gradient(90deg,#eef5ef,#f7f1e5);border:1px solid #dfe8dc}
.pg-cta__text{display:grid;gap:2px;margin:0;min-width:0}
.pg-cta__text strong{color:var(--deep);font-size:16px;line-height:1.7}
.pg-cta__text span{color:var(--muted);font-size:13.5px}
.pg-cta__text .price-toman{font-weight:800;color:var(--deep);white-space:nowrap}
.pg-cta__text .price-toman small{font-weight:500;color:var(--muted);margin-inline-end:3px}
.pg-cta__btn{flex:0 0 auto}

/* ---- notes ---- */
.pg-notes{margin-top:22px;padding:14px 20px;border-radius:var(--r-card);background:#fff8ea;border:1px solid #f0dfb8}
.pg-notes summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:700;color:#7a4b1f;list-style:none}
.pg-notes summary::-webkit-details-marker{display:none}
/* A chevron: down when closed, up when open (physical sides: it must not flip in RTL). */
.pg-notes summary::after{content:"";margin-inline-start:auto;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.pg-notes[open] summary::after{transform:translateY(2px) rotate(-135deg)}
.pg-notes summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:4px}
.pg-notes ul{margin:8px 0 0;padding-inline-start:20px;line-height:2;font-size:14px}

/* ---- baskets ---- */
.pg-baskets{margin-top:28px;scroll-margin-top:96px}
.pg-baskets__title{margin:0 0 14px;font-size:19px;color:var(--deep)}
.pg-baskets__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.pg-basket{display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:var(--r-xl);background:#fff;border:1.5px solid var(--border)}
.pg-basket__title{margin:0;font-size:17px;color:var(--deep)}
.pg-basket__note{margin:0;font-size:13px;color:var(--muted);line-height:1.8}
.pg-basket__list summary{cursor:pointer;font-weight:600;color:var(--primary-hover);font-size:14px}
.pg-basket__list ul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px;font-size:13.5px}
.pg-basket__list li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;padding-block:4px;border-bottom:1px dashed var(--border)}
.pg-basket__list li.is-missing{color:var(--muted)}
.pg-basket__list em{font-style:normal;font-size:12px;color:#8a5a00}
.pg-basket__qty{font-weight:700;color:var(--deep)}
.pg-basket__price .price-toman{font-size:13px;white-space:nowrap}
.pg-basket__total{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:auto 0 0;padding-top:10px;border-top:1px solid var(--border);font-size:14px}
.pg-basket__total .price-toman{font-size:19px;font-weight:800;color:var(--deep)}
.pg-basket__form{margin:0}
.pg-basket__form .btn{width:100%}
.pg-basket__status{margin:8px 0 0;font-size:13.5px;min-height:1em}
.pg-basket__status:empty{display:none}
.pg-basket__status a{font-weight:700;color:var(--primary-hover)}
.pg-basket__missing{margin:0;font-size:12.5px;color:#8a5a00;line-height:1.8}
.pg-basket__missing a{color:inherit;font-weight:700}

/* ---- the page: how to use, help ---- */
.pgp{padding-bottom:var(--sec-gap)}
.pgp-how{padding-top:56px}
.pgp-how h2,.pgp-help h2{margin:0 0 18px;font-size:22px;color:var(--deep)}
.pgp-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pgp-steps li{display:grid;gap:6px;align-content:start;padding:20px;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--border)}
.pgp-steps__n{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--deep);color:#fff;font-weight:800}
.pgp-steps strong{font-size:16px;color:var(--deep)}
.pgp-steps span:last-child{color:var(--muted);font-size:14px;line-height:1.9}
.pgp-content{margin-top:32px}
.pgp-help{margin-top:32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;padding:24px 28px;border-radius:20px;background:var(--deep);color:#eaf3ec}
.pgp-help h2{margin:0 0 4px;font-size:19px;color:#fff}
.pgp-help p{margin:0;color:#c6d6c9;line-height:1.9;max-width:640px}
.pgp-help__actions{display:flex;flex-wrap:wrap;gap:10px}

/* ---- tablet / phone ---- */
@media (max-width:899px){
	.pg-slide{grid-template-columns:minmax(0,1fr)}
	.pg-slide__media{aspect-ratio:16/10;min-height:0}
	.pg-slide__body{padding:16px}
	.pg-slide__title{font-size:19px}
	.pgp-steps{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:767px){
	.pg-panel{padding:20px 16px}
	.pg-methods{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;max-width:100%}
	.pg-methods::-webkit-scrollbar{display:none}
}
@media (max-width:560px){
	.programs--home,.programs--full{padding-block:48px}
	.programs--page .pg-band{padding-block:28px 100px}
	.pg-band .sec-head{margin-bottom:20px}
	.pg-band .sec-head h2{font-size:23px}
	.pg-crops{grid-auto-columns:minmax(164px,1fr);gap:10px}
	.pg-crop{grid-template-columns:48px minmax(0,1fr);column-gap:10px;padding:8px 10px;border-radius:16px}
	.pg-crop__media{width:48px;height:48px;border-radius:12px;font-size:24px}
	.pg-crop__name{font-size:16px}
	.pg-crop__meta,.pg-crop__now{font-size:11.5px}
	.pg-crop__baskets{display:none}
	.pg-crop__now{white-space:normal;line-height:1.6}
	.pg-main{margin-top:18px}
	.programs--page .pg-main{margin-top:-80px}
	.pg-panel{padding:16px 14px;border-radius:18px}
	.pg-head__title{font-size:19px}
	.pg-now{font-size:13.5px;padding:9px 12px}
	.pg-item{grid-template-columns:44px minmax(0,1fr);grid-template-areas:"media main" "buy buy";row-gap:8px}
	.pg-item__media{grid-area:media;width:44px;height:44px}
	.pg-item__main{grid-area:main}
	.pg-buy{grid-area:buy;justify-content:flex-start;padding-inline-start:56px}
	.pg-nav{padding:8px 14px}
	.pg-cta{padding:14px}
	.pg-cta__btn{width:100%}
	.pg-basket{padding:16px}
	.pgp-how{padding-top:40px}
	.pgp-help{padding:20px}
	.pgp-help__actions,.pgp-help__actions .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
	.pg-track{scroll-behavior:auto;transition:none}
	.pg-crop,.pg-crop:hover{transition:none;transform:none}
	.pg-notes summary::after{transition:none}
}