/* ============================================================
   HoggerVR — Product Placeholder Images (SVG data URIs)
   These generate inline SVGs for demo products
   ============================================================ */

/* Used only as fallback; real images go via <img src="..."> */
.ph-laptop    { background: #e8f4fc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'%3E%3Crect x='10' y='10' width='100' height='55' rx='4' fill='%23334'/%3E%3Crect x='15' y='15' width='90' height='45' fill='%230d6efd' opacity='.3'/%3E%3Crect x='5' y='65' width='110' height='8' rx='3' fill='%23222'/%3E%3C/svg%3E") center/65% no-repeat; }
.ph-router    { background: #edfaee url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'%3E%3Crect x='20' y='35' width='80' height='22' rx='5' fill='%23222'/%3E%3Ccircle cx='35' cy='46' r='4' fill='%2300c853'/%3E%3Ccircle cx='50' cy='46' r='4' fill='%2300c853'/%3E%3Cline x1='60' y1='36' x2='50' y2='15' stroke='%23555' stroke-width='2'/%3E%3Cline x1='70' y1='36' x2='70' y2='12' stroke='%23555' stroke-width='2'/%3E%3Cline x1='80' y1='36' x2='90' y2='15' stroke='%23555' stroke-width='2'/%3E%3C/svg%3E") center/65% no-repeat; }
.ph-camera    { background: #fff5f5 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'%3E%3Crect x='30' y='25' width='60' height='40' rx='6' fill='%23333'/%3E%3Ccircle cx='60' cy='45' r='14' fill='%23555'/%3E%3Ccircle cx='60' cy='45' r='8' fill='%23222'/%3E%3Ccircle cx='60' cy='45' r='3' fill='%23f04066'/%3E%3Crect x='38' y='22' width='14' height='8' rx='2' fill='%23333'/%3E%3C/svg%3E") center/55% no-repeat; }
.ph-solar     { background: #fffbe6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'%3E%3Crect x='10' y='20' width='100' height='50' rx='4' fill='%231a237e' opacity='.8'/%3E%3Cline x1='43' y1='20' x2='43' y2='70' stroke='%23fff' stroke-width='1' opacity='.3'/%3E%3Cline x1='77' y1='20' x2='77' y2='70' stroke='%23fff' stroke-width='1' opacity='.3'/%3E%3Cline x1='10' y1='42' x2='110' y2='42' stroke='%23fff' stroke-width='1' opacity='.3'/%3E%3C/svg%3E") center/65% no-repeat; }
.ph-desktop   { background: #f3e8ff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'%3E%3Crect x='10' y='8' width='100' height='52' rx='4' fill='%23334'/%3E%3Crect x='15' y='13' width='90' height='42' fill='%237c3aed' opacity='.3'/%3E%3Crect x='50' y='60' width='20' height='8' fill='%23333'/%3E%3Crect x='35' y='68' width='50' height='4' rx='2' fill='%23222'/%3E%3C/svg%3E") center/65% no-repeat; }
.ph-ups       { background: #e8f5e9 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'%3E%3Crect x='25' y='15' width='70' height='55' rx='6' fill='%23212529'/%3E%3Crect x='35' y='28' width='50' height='28' rx='3' fill='%23343a40'/%3E%3Crect x='40' y='33' width='18' height='8' rx='2' fill='%2300c853'/%3E%3Ccircle cx='72' cy='37' r='5' fill='%2300c853' opacity='.6'/%3E%3C/svg%3E") center/55% no-repeat; }