:root{--farm-green:#1f6f3f;--farm-green-dark:#154d2c;--farm-earth:#8a5a2b;--farm-bg:#f6f8f4;--farm-ink:#1e2a22;--farm-muted:#5e6b63;--farm-card:#fff;--farm-line:#dfe6e0}
body{background:var(--farm-bg);color:var(--farm-ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;margin:0}
.farm-nav{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;background:#fff;border-bottom:1px solid var(--farm-line);flex-wrap:wrap;gap:10px}
.farm-brand{font-weight:700;font-size:1.25rem;color:var(--farm-green);text-decoration:none}
.farm-nav nav{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.farm-nav a{color:var(--farm-ink);text-decoration:none}
.farm-btn{background:var(--farm-green);color:#fff!important;padding:10px 18px;border-radius:8px;border:0;font-weight:600;cursor:pointer;display:inline-block}
.farm-btn:hover{background:var(--farm-green-dark)}
.farm-btn.secondary{background:#fff;color:var(--farm-green)!important;border:1px solid var(--farm-green)}
.farm-btn[disabled]{opacity:.6;cursor:not-allowed}
/* Frappe's website.bundle.css puts `body{display:flex;flex-direction:column}` (for the sticky
   footer), making this element a stretched flex item. Chromium's stretch sizing for a block flex
   item with width:auto can land wider than the container when a descendant (like the budget/plan
   tables here) has any horizontal scroll affordance, even though that descendant itself fits fine
   - explicit width:100% (capped by max-width, still centered by the auto margins) sidesteps it. */
.farm-main{width:100%;max-width:1080px;margin:0 auto;padding:24px 16px;box-sizing:border-box}
.farm-hero{padding:48px 0 32px;text-align:center}
.farm-hero h1{font-size:2.2rem;margin:0 0 12px;color:var(--farm-green-dark)}
.farm-hero p{max-width:640px;margin:0 auto 24px;color:var(--farm-muted);font-size:1.1rem}
.farm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.farm-grid>.farm-card{max-width:560px}
.farm-card{background:var(--farm-card);border:1px solid var(--farm-line);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:8px}
.farm-card img{width:100%;height:140px;object-fit:cover;border-radius:8px;background:#e6efe8}
.farm-card h3{margin:0;color:var(--farm-green-dark)}
.farm-price{font-weight:700;font-size:1.1rem}
.farm-price small{display:block;font-weight:400;color:var(--farm-muted)}
.farm-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:24px 0}
.farm-step{background:#fff;border-radius:12px;padding:16px;border:1px solid var(--farm-line)}
.farm-step b{display:block;color:var(--farm-green);margin-bottom:6px}
.farm-wizard{background:#fff;border:1px solid var(--farm-line);border-radius:12px;padding:24px;max-width:760px;margin:0 auto}
.farm-progress{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.farm-progress span{flex:1;min-width:90px;text-align:center;padding:8px;border-radius:8px;background:#eef3ef;color:var(--farm-muted);font-size:.9rem}
.farm-progress span.active{background:var(--farm-green);color:#fff}
.farm-progress span.done{background:#cfe6d7;color:var(--farm-green-dark)}
.farm-field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.farm-field input,.farm-field select,.farm-field textarea{padding:10px;border:1px solid var(--farm-line);border-radius:8px;font-size:1rem}
select,input:not([type=checkbox]):not([type=radio]){width:100%;max-width:100%;min-width:0}
.farm-row{display:flex;gap:14px;flex-wrap:wrap}.farm-row>*{flex:1 1 140px;min-width:0}
.farm-hint{font-size:.85rem}
.farm-total{background:var(--farm-bg);border-radius:10px;padding:14px;margin:14px 0;font-size:1.1rem}
.farm-total b{font-size:1.4rem;color:var(--farm-green-dark)}
table.farm-table{width:100%;border-collapse:collapse;margin:8px 0}
table.farm-table td,table.farm-table th{padding:8px;border-bottom:1px solid var(--farm-line);text-align:left}
table.farm-table td:last-child,table.farm-table th:last-child{text-align:right;white-space:nowrap}
table.farm-table .farm-muted{font-weight:400;display:block}
.farm-actions{display:flex;justify-content:space-between;gap:10px;margin-top:18px;flex-wrap:wrap}
.farm-error{background:#fdecea;color:#8a1c1c;padding:10px;border-radius:8px;margin:10px 0;display:none}
.farm-terms{max-height:260px;overflow:auto;border:1px solid var(--farm-line);padding:12px;border-radius:8px;background:#fafcfa}
.farm-timeline{list-style:none;padding:0;margin:0}
.farm-timeline li{display:grid;grid-template-columns:28px 1fr auto;gap:10px;padding:10px 0;border-bottom:1px solid var(--farm-line);align-items:start}
.farm-dot{width:14px;height:14px;border-radius:50%;background:#cbd5cf;margin-top:4px}
.farm-dot.done{background:var(--farm-green)}.farm-dot.progress{background:#e0a020}
.farm-badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:.8rem;background:#eef3ef;color:var(--farm-muted)}
.farm-badge.active{background:#cfe6d7;color:var(--farm-green-dark)}
.farm-crop-select{cursor:pointer;border:2px solid var(--farm-line);position:relative;font:inherit;color:inherit;text-align:left;width:100%;min-width:0;box-sizing:border-box}
.farm-crop-select:hover:not([disabled]),.farm-crop-select:focus-visible{border-color:var(--farm-green)}
.farm-crop-select:focus-visible{outline:3px solid #9fd0b0;outline-offset:2px}
.farm-crop-select.selected{border-color:var(--farm-green);background:#f1f8f3}
.farm-crop-select[disabled]{cursor:not-allowed;opacity:.6}
.farm-card-title{font-weight:700;font-size:1.17rem;color:var(--farm-green-dark);padding-right:36px}
.farm-tick{position:absolute;top:12px;right:12px;width:26px;height:26px;border-radius:50%;border:2px solid var(--farm-line);background:#fff;color:transparent;display:flex;align-items:center;justify-content:center;font-weight:700;line-height:1}
.farm-crop-select.selected .farm-tick{background:var(--farm-green);border-color:var(--farm-green);color:#fff}
.farm-select-label{font-weight:600;color:var(--farm-green)}
.farm-line{border:1px solid var(--farm-line);border-radius:12px;padding:16px;margin:0 0 16px;min-width:0}
.farm-line-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.farm-line-head h3{margin:0;color:var(--farm-green-dark);min-width:0;overflow-wrap:anywhere}
.farm-link-btn{background:none;border:0;color:#8a1c1c;font:inherit;font-size:.9rem;cursor:pointer;padding:6px 4px;text-decoration:underline;flex:none}
.farm-line-total{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;background:var(--farm-bg);border-radius:8px;padding:10px 12px}
.farm-line-total b{font-size:1.15rem;color:var(--farm-green-dark)}
.farm-line-error{color:#8a1c1c}
.farm-line-error:empty{display:none}
.farm-details{border-top:1px solid var(--farm-line);padding:8px 0 0;margin-top:8px}
.farm-details summary{cursor:pointer;font-weight:600;color:var(--farm-green-dark);padding:4px 0}
.farm-scroll{overflow-x:auto}
/* the basket's budget/plan tables must fit without sideways scrolling: the first column wraps
   (even long words), the amount/when column never wraps and is never clipped */
.farm-details table.farm-table{table-layout:auto}
.farm-details table.farm-table td:first-child,.farm-details table.farm-table th:first-child{overflow-wrap:anywhere;word-break:break-word;width:100%}
.farm-details table.farm-table td:last-child,.farm-details table.farm-table th:last-child{white-space:nowrap;padding-left:8px}
.farm-currency{max-width:220px}
.farm-basket-total{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.farm-basket-total>span:first-child{font-weight:600;flex:1 0 100%}
.farm-summary{font-size:1rem}
.farm-summary-lines{list-style:none;padding:0;margin:0 0 10px}
.farm-summary-lines li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;padding:6px 0;border-bottom:1px solid var(--farm-line)}
.farm-summary-lines li b{font-size:1rem;color:var(--farm-green-dark)}
.farm-summary-what{min-width:0;overflow-wrap:anywhere}
.farm-summary-amount{font-weight:600;white-space:nowrap}
.farm-summary-total{margin-bottom:8px}
.farm-contracts{list-style:none;padding:0;margin:10px 0}
.farm-contracts li{padding:8px 0;border-bottom:1px solid var(--farm-line);overflow-wrap:anywhere}
.farm-footer{padding:24px 16px;text-align:center;color:var(--farm-muted);font-size:.9rem;border-top:1px solid var(--farm-line);margin-top:40px}
.farm-muted{color:var(--farm-muted)}
.farm-quicklinks{margin-top:-8px}
.farm-nav-compact{display:none}
.farm-login-links .farm-sep{display:inline}
@media (max-width:719px){
	.farm-nav{flex-wrap:nowrap;padding:12px 14px;gap:8px}
	.farm-nav nav{gap:10px;flex-wrap:nowrap}
	.farm-brand{font-size:1.05rem}
	.farm-btn-start{padding:8px 14px}
	.farm-nav-full{display:none}
	.farm-nav-compact{display:inline}
	/* one row whatever the nav holds (Log in/Start, or My farm/Manage/Log out): the links never
	   wrap, the brand gives way and truncates instead */
	.farm-brand{min-width:0;flex:0 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
	.farm-nav nav{flex:none}
	.farm-nav nav a{white-space:nowrap}
}
@media (max-width:399px){
	.farm-nav{padding:10px 10px;gap:6px}
	.farm-nav nav{gap:8px;font-size:.9rem}
	.farm-brand{font-size:.95rem}
	.farm-btn-start{padding:7px 10px}
}
@media (max-width:640px){
	.farm-hero h1{font-size:1.6rem}
	.farm-wizard{padding:16px}
	.farm-actions .farm-btn,.farm-hero .farm-btn,.farm-card .farm-btn{width:100%;text-align:center}
	.farm-field input,.farm-field select,.farm-field textarea{font-size:16px}
	.farm-progress span{flex:1 1 calc(50% - 4px)}
	table.farm-table{font-size:.875rem}
	table.farm-table td,table.farm-table th{padding:6px}
	.farm-login-links{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
	.farm-login-links .farm-sep{display:none}
	.farm-line{padding:12px}
	.farm-currency{max-width:none}
}
