/**
 * Pizza Pipeline Online Ordering — design tokens
 * Breakpoints align with Bootstrap 3 grid: sm 480, md 768, lg 992, xl 1200
 */
:root {
	--pp-breakpoint-sm: 480px;
	--pp-breakpoint-md: 768px;
	--pp-breakpoint-lg: 992px;
	--pp-breakpoint-xl: 1200px;

	--pp-color-brand: #008a5e;
	--pp-color-brand-dark: #006b49;
	--pp-color-danger: #a94442;
	--pp-color-price: #c00;
	--pp-color-text: #000;
	--pp-color-muted-bg: #f7f7f7;
	--pp-color-border: #ccc;

	--pp-nav-height: 66px;
	--pp-nav-height-mobile: 50px;

	/* Buttons */
	--pp-btn-radius: 10px;
	--pp-btn-radius-sm: 8px;
	--pp-btn-radius-pill: 999px;
	--pp-btn-font-weight: 600;
	--pp-btn-font-size: 1.50rem;
	--pp-btn-font-size-sm: 1.15rem;
	--pp-btn-font-size-lg: 1.25rem;
	--pp-btn-padding-y: 8px;
	--pp-btn-padding-x: 12px;
	--pp-btn-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
	--pp-btn-shadow-hover: 0 4px 12px rgba(0, 0, 0, 0.12);
	--pp-btn-shadow-brand: 0 4px 14px rgba(0, 138, 94, 0.35);
	--pp-btn-shadow-danger: 0 4px 14px rgba(196, 30, 58, 0.35);
	--pp-btn-transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.12s ease;
	--pp-color-checkout: #d91f3f;
	--pp-color-checkout-hover: #b01832;
	--pp-color-checkout-bright: #ff3d5c;
	--pp-btn-shadow-checkout: 0 4px 18px rgba(217, 31, 63, 0.5);
	--pp-btn-shadow-checkout-hover: 0 6px 22px rgba(217, 31, 63, 0.55);

	/* Sticky footer — Main Menu / Checkout pair */
	--pp-sticky-footer-btn-width-mobile: calc(50% - 10px);
	--pp-sticky-footer-btn-width-desktop: 25vw;
	--pp-sticky-footer-btn-gap: 10px;

	--pp-color-surface: #ffffff;
	--pp-color-surface-muted: #f4f6f5;
	--pp-color-border-strong: #b8c4be;

	/* Dropdowns & selects */
	--pp-dropdown-radius: 12px;
	--pp-dropdown-shadow: 0 12px 32px rgba(0, 0, 0, 0.14), 0 2px 8px rgba(0, 0, 0, 0.08);
	--pp-dropdown-font-size: 1.35rem;
	--pp-dropdown-item-padding-y: 12px;
	--pp-dropdown-item-padding-x: 20px;
	--pp-select-font-size: 1.3rem;
	--pp-select-font-size-sm: 1.15rem;
	--pp-select-min-height: 48px;
	--pp-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath fill='%23006b49' d='M3.5 5.25 7 8.75l3.5-3.5' stroke='%23006b49' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");

	/* Checkout page fields (slightly larger type, slightly tighter padding) */
	--pp-checkout-field-font-size: 1.4rem;
	--pp-checkout-field-font-size-sm: 1.25rem;
	--pp-checkout-field-min-height: 46px;
	--pp-checkout-field-min-height-sm: 42px;
	--pp-checkout-field-padding-y: 10px;
	--pp-checkout-field-padding-left: 20px;
	--pp-checkout-field-padding-right: 14px;
	--pp-checkout-field-padding-left-sm: 14px;
	--pp-checkout-field-padding-right-sm: 10px;
	--pp-checkout-select-padding-right: 40px;
	--pp-checkout-select-padding-right-sm: 32px;

	/* Headings */
	--pp-heading-radius: 6px;
}
