/* Food Waste Calculator — front-end styles (all selectors prefixed .fwc-) */

.fwc-wrap{
	--fwc-green:#3c8c4e;
	--fwc-green-dark:#2f7d43;
	--fwc-green-soft:#e7f2ea;
	--fwc-ink:#2b2b2b;
	--fwc-muted:#9a9182;
	--fwc-line:#efece5;
	--fwc-field:#fbfaf8;
	--fwc-field-border:#ece8e1;
	--fwc-page:#f6f6f3;
	--fwc-shadow:0 1px 2px rgba(43,43,43,.03),0 18px 40px rgba(43,43,43,.05);
	max-width:960px;margin:0 auto;color:var(--fwc-ink);line-height:1.4;
	font-family:inherit;box-sizing:border-box;
}
.fwc-wrap *,.fwc-wrap *::before,.fwc-wrap *::after{box-sizing:border-box;}

.fwc-card{
	background:#fff;border:1px solid var(--fwc-line);border-radius:22px;
	padding:clamp(20px,4vw,36px);box-shadow:var(--fwc-shadow);
}

/* Header */
.fwc-header{display:flex;align-items:center;gap:14px;margin-bottom:22px;}
.fwc-icon{width:46px;height:46px;flex:none;display:flex;align-items:center;justify-content:center;line-height:0;}
.fwc-icon svg{display:block;}
.fwc-title{margin:0;font-size:16px;font-weight:400;color:var(--fwc-ink);letter-spacing:-.01em;line-height:1.3;}

/* Rows */
.fwc-rows{display:flex;flex-direction:column;}
.fwc-row{padding:20px 0;border-top:1px solid var(--fwc-line);}
.fwc-row:first-child{border-top:none;padding-top:4px;}

.fwc-label{
	display:block;font-size:11px;font-weight:700;letter-spacing:.07em;
	text-transform:uppercase;color:var(--fwc-muted);margin-bottom:6px;
}
.fwc-field{min-width:0;}

.fwc-row-inputs{display:grid;grid-template-columns:1fr 1fr 1.5fr;gap:14px;}
.fwc-row-calc{display:flex;align-items:flex-end;gap:20px;margin-top:14px;flex-wrap:wrap;}
.fwc-amount-unit{display:flex;gap:14px;flex:0 0 auto;align-items:flex-end;}
.fwc-field-amount{width:120px;flex:none;}
.fwc-field-unit{width:96px;flex:none;}

/* Selects & inputs */
.fwc-select-wrap{position:relative;}
.fwc-select,.fwc-input{
	width:100%;font-family:inherit;font-size:15px;color:var(--fwc-ink);
	background:var(--fwc-field);border:1px solid var(--fwc-field-border);border-radius:12px;
	padding:12px 14px;outline:none;transition:border-color .15s,box-shadow .15s,background .15s;
	-webkit-appearance:none;-moz-appearance:none;appearance:none;
}
.fwc-select{
	padding-right:38px;cursor:pointer;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239a9182' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat:no-repeat;background-position:right 13px center;
	text-overflow:ellipsis;
}
.fwc-select:disabled{opacity:.55;cursor:not-allowed;background:#f3f1ec;}
.fwc-input::-webkit-outer-spin-button,.fwc-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.fwc-input[type=number]{-moz-appearance:textfield;}
.fwc-select:focus,.fwc-input:focus{border-color:var(--fwc-green);background:#fff;box-shadow:0 0 0 3px rgba(60,140,78,.15);}

/* Metrics readout */
.fwc-metrics{display:flex;gap:22px;flex:1 1 auto;justify-content:space-between;flex-wrap:wrap;align-items:flex-end;padding-bottom:2px;}
.fwc-metric{display:flex;flex-direction:column;gap:3px;min-width:0;}
.fwc-metric-label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fwc-muted);}
.fwc-metric-val{font-size:18px;font-weight:800;color:var(--fwc-green-dark);font-variant-numeric:tabular-nums;line-height:1;}
.fwc-metric-unit{font-size:11px;color:var(--fwc-muted);}
.fwc-metric-val,.fwc-metric-unit{display:inline;}
.fwc-metric-val{margin-right:4px;}

/* Remove */
.fwc-remove{
	width:34px;height:34px;flex:none;display:flex;align-items:center;justify-content:center;
	border:none;background:transparent;color:#c0392b;line-height:0;cursor:pointer;border-radius:8px;
	opacity:0;pointer-events:none;margin-left:10px;
	transition:opacity .15s,background .15s,color .15s;
}
.fwc-row:hover .fwc-remove{opacity:1;pointer-events:auto;}
.fwc-remove:hover{color:#a5281c;background:#faf2f0;}
.fwc-remove:focus-visible{opacity:1;pointer-events:auto;outline:2px solid var(--fwc-green);outline-offset:2px;}
.fwc-rows[data-single] .fwc-remove{opacity:0 !important;pointer-events:none !important;}

/* Actions */
.fwc-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:24px;padding-top:20px;border-top:1px solid var(--fwc-line);}
.fwc-add{display:inline-flex;align-items:center;gap:9px;background:none;border:none;cursor:pointer;padding:6px 2px;font-family:inherit;font-size:16px;font-weight:600;color:var(--fwc-green);transition:opacity .15s;}
.fwc-add:hover{opacity:.75;}
.fwc-add-icon{display:inline-flex;}
.fwc-calc{font-family:inherit;font-size:16px;font-weight:600;color:#fff;background:#2e7d32;border:none;cursor:pointer;padding:16px 30px;border-radius:999px;transition:background .15s,transform .05s;}
.fwc-calc:hover{background:#276b2b;}
.fwc-calc:active{transform:translateY(1px);}
.fwc-add:focus-visible,.fwc-calc:focus-visible{outline:2px solid var(--fwc-green);outline-offset:2px;}

/* Result cards */
.fwc-results{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:24px;}
.fwc-result-card{background:#fff;border:1px solid var(--fwc-line);border-radius:22px;padding:clamp(18px,3vw,26px);box-shadow:var(--fwc-shadow);}
.fwc-pill{display:inline-flex;align-items:center;gap:7px;background:var(--fwc-green-soft);color:var(--fwc-green);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:7px 13px;border-radius:999px;}
.fwc-pill svg{flex:none;}
.fwc-result-title{margin-top:22px;font-size:16px;font-weight:700;color:var(--fwc-ink);}
.fwc-result-number{margin-top:10px;font-size:34px;font-weight:800;color:var(--fwc-green-dark);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;}
.fwc-result-unit{font-size:16px;font-weight:500;color:var(--fwc-muted);}
.fwc-divider{height:1px;background:var(--fwc-line);margin:22px 0 15px;}
.fwc-result-info{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:#7d766a;}
.fwc-result-info svg{flex:none;margin-top:1px;color:#b6ad9d;}
.fwc-result-info b{color:var(--fwc-ink);font-weight:600;}

.fwc-pulse{animation:fwc-pulse .45s ease;}
@keyframes fwc-pulse{0%{transform:scale(1);}40%{transform:scale(1.06);}100%{transform:scale(1);}}

/* Responsive */
@media (max-width:860px){
	.fwc-results{grid-template-columns:1fr;}
}
@media (max-width:680px){
	.fwc-row-inputs{grid-template-columns:1fr;}
	.fwc-row-calc{gap:14px;}
	.fwc-amount-unit{width:100%;gap:12px;}
	.fwc-field-amount{flex:1 1 auto;width:auto;}
	.fwc-field-unit{width:96px;flex:none;}
	.fwc-metrics{flex-basis:100%;justify-content:flex-start;gap:20px;margin-top:2px;}
	.fwc-remove{position:absolute;top:16px;right:0;opacity:1;pointer-events:auto;}
	.fwc-row{position:relative;}
	.fwc-actions{flex-direction:column-reverse;align-items:stretch;}
	.fwc-calc{width:100%;text-align:center;}
	.fwc-add{justify-content:center;}
}
@media (prefers-reduced-motion:reduce){.fwc-pulse{animation:none;}.fwc-calc,.fwc-select,.fwc-input{transition:none;}}
