/*
Theme Name: Virtual Mobile 3D Shop
Theme URI: https://example.com/virtual-mobile-3d-shop
Author: Skywellwise LLP
Description: A futuristic, mobile-first WooCommerce theme built around a walkable 3D phone showroom. Works with the companion plugin "Virtual 3D Showroom Manager". Includes a custom homepage, product category navigation, Customizer colours and logo, and a full-screen 3D Showroom page template.
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vm3d
Tags: e-commerce, dark, custom-colors, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, wide-blocks, block-styles
WC requires at least: 7.0
*/

:root{
  --vm-primary:#27c5ff;--vm-secondary:#ff8a1f;--vm-bg:#070b18;--vm-text:#e8f1ff;
  --vm-surface:#0e1630;--vm-surface2:#16224a;--vm-muted:#9db4e0;--vm-line:rgba(120,160,255,.22);
  --vm-radius:14px;--vm-max:1200px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--vm-bg);color:var(--vm-text);font-family:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;line-height:1.6;font-size:16px}
img{max-width:100%;height:auto}
a{color:var(--vm-primary)}
a:hover{color:#fff}
:focus-visible{outline:3px solid var(--vm-secondary);outline-offset:2px}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}
.screen-reader-text:focus{background:#fff;color:#000;clip:auto;clip-path:none;height:auto;width:auto;left:8px;top:8px;padding:12px 18px;z-index:100000}
.vm-wrap{width:100%;max-width:var(--vm-max);margin:0 auto;padding-inline:max(16px,env(safe-area-inset-left,0px)) max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3,h4{line-height:1.2;text-wrap:balance}

/* header */
.vm-header{position:sticky;top:0;z-index:50;background:rgba(7,11,24,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--vm-line)}
.admin-bar .vm-header{top:32px}
@media (max-width:782px){.admin-bar .vm-header{top:46px}}
.vm-header-in{display:flex;align-items:center;gap:16px;min-height:64px}
.vm-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:18px}
.vm-brand img{max-height:40px;width:auto}
.vm-nav{margin-left:auto}
.vm-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;flex-wrap:wrap}
.vm-nav a{display:block;padding:10px 12px;color:var(--vm-text);text-decoration:none;border-radius:10px}
.vm-nav a:hover,.vm-nav .current-menu-item>a{background:var(--vm-surface2);color:#fff}
.vm-tools{display:flex;gap:8px;align-items:center}
.vm-tool{display:inline-flex;align-items:center;gap:6px;padding:9px 13px;border:1px solid var(--vm-line);border-radius:10px;color:var(--vm-text);text-decoration:none;min-height:42px}
.vm-tool:hover{border-color:var(--vm-primary);color:#fff}
.vm-count{background:var(--vm-secondary);color:#111;font-weight:800;font-size:12px;border-radius:999px;padding:1px 7px}
.vm-burger{display:none;background:none;border:1px solid var(--vm-line);color:var(--vm-text);border-radius:10px;min-height:42px;padding:0 12px;font:inherit;cursor:pointer}
.vm-catbar{background:var(--vm-surface);border-bottom:1px solid var(--vm-line)}
.vm-catbar ul{list-style:none;margin:0;padding:6px 0;display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin}
.vm-catbar a{white-space:nowrap;display:block;padding:6px 14px;border-radius:999px;border:1px solid var(--vm-line);color:var(--vm-muted);text-decoration:none;font-size:14px}
.vm-catbar a:hover,.vm-catbar .current>a{color:#111;background:var(--vm-primary);border-color:var(--vm-primary)}
@media (max-width:860px){
  .vm-burger{display:inline-block;margin-left:auto}
  .vm-nav{position:absolute;left:0;right:0;top:100%;background:var(--vm-surface);border-bottom:1px solid var(--vm-line);display:none;margin:0}
  .vm-nav.is-open{display:block}
  .vm-nav ul{flex-direction:column;padding:8px 16px}
  .vm-header-in{flex-wrap:wrap}
}

/* buttons */
.vm-btn,.button,button.button,input[type=submit],.wp-block-button__link,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--vm-primary);background:transparent;color:var(--vm-text);padding:12px 22px;border-radius:12px;font:inherit;font-weight:700;cursor:pointer;text-decoration:none;min-height:46px;line-height:1.2}
.vm-btn:hover,.button:hover,.woocommerce a.button:hover,.woocommerce button.button:hover{background:var(--vm-surface2);color:#fff}
.vm-btn-pri,.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,.woocommerce #respond input#submit.alt,.single_add_to_cart_button{background:linear-gradient(135deg,var(--vm-secondary),#ff5d1f)!important;border-color:transparent!important;color:#111!important}

/* hero */
.vm-hero{position:relative;overflow:hidden;background:radial-gradient(1200px 500px at 70% 0%,rgba(39,197,255,.22),transparent 60%),radial-gradient(900px 400px at 10% 100%,rgba(255,138,31,.18),transparent 60%);padding-block:clamp(40px,8vw,96px)}
.vm-hero h1{font-size:clamp(32px,6vw,64px);margin:0 0 14px;max-width:16em}
.vm-hero p{font-size:clamp(16px,2vw,20px);color:var(--vm-muted);max-width:36em;margin:0 0 24px}
.vm-hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.vm-section{padding-block:clamp(32px,5vw,64px)}
.vm-section>.vm-wrap>h2{font-size:clamp(24px,3.5vw,36px);margin:0 0 20px}
.vm-showroom{padding:0}
.vm-showroom .v3ds-embed{border-block:1px solid var(--vm-line)}
.vm-placeholder{padding:40px 16px;text-align:center;background:var(--vm-surface);border-block:1px solid var(--vm-line);color:var(--vm-muted)}

/* category grid */
.vm-cats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:14px}
.vm-cat a{display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center;padding:18px;border:1px solid var(--vm-line);border-radius:var(--vm-radius);background:var(--vm-surface);color:var(--vm-text);text-decoration:none;height:100%}
.vm-cat a:hover{border-color:var(--vm-secondary);transform:translateY(-2px)}
.vm-cat img{width:96px;height:96px;object-fit:cover;border-radius:12px;background:var(--vm-surface2)}
.vm-cat .vm-ph{width:96px;height:96px;border-radius:12px;background:linear-gradient(135deg,var(--vm-primary),var(--vm-secondary));opacity:.8}
.vm-cat span{font-weight:700}
.vm-cat small{color:var(--vm-muted)}

/* content */
.vm-main{padding-block:32px;min-height:50vh}
.vm-article{max-width:780px;margin-inline:auto}
.vm-article h1.entry-title{font-size:clamp(28px,4vw,44px)}
.entry-content>*{max-width:100%}
.entry-content img{border-radius:10px}
.vm-posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:18px}
.vm-card{background:var(--vm-surface);border:1px solid var(--vm-line);border-radius:var(--vm-radius);padding:18px}
.vm-card h2{font-size:20px;margin:0 0 8px}
.vm-card h2 a{color:#fff;text-decoration:none}

/* footer */
.vm-footer{border-top:1px solid var(--vm-line);background:var(--vm-surface);color:var(--vm-muted);padding-block:28px;margin-top:40px}
.vm-footer-in{display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;align-items:center}
.vm-footer ul{list-style:none;margin:0;padding:0;display:flex;gap:14px;flex-wrap:wrap}

/* forms */
input[type=text],input[type=email],input[type=tel],input[type=url],input[type=password],input[type=search],input[type=number],textarea,select,.select2-container--default .select2-selection--single{background:var(--vm-surface2);color:var(--vm-text);border:1px solid var(--vm-line);border-radius:10px;padding:11px 12px;font:inherit;max-width:100%;min-height:44px}
.select2-container--default .select2-selection--single .select2-selection__rendered{color:var(--vm-text);line-height:22px}
::placeholder{color:var(--vm-muted)}

/* WooCommerce */
.woocommerce-breadcrumb{color:var(--vm-muted);font-size:14px;margin-bottom:16px}
.woocommerce ul.products{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:18px;margin:0 0 24px!important;padding:0}
.woocommerce ul.products::before,.woocommerce ul.products::after{display:none!important}
.woocommerce ul.products li.product{width:auto!important;float:none!important;margin:0!important;background:var(--vm-surface);border:1px solid var(--vm-line);border-radius:var(--vm-radius);padding:14px;display:flex;flex-direction:column;gap:6px}
.woocommerce ul.products li.product a{color:var(--vm-text);text-decoration:none}
.woocommerce ul.products li.product img{border-radius:10px;margin:0 0 8px!important}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:16px;padding:0}
.woocommerce ul.products li.product .button{margin-top:auto}
.woocommerce .price,.woocommerce ul.products li.product .price{color:var(--vm-secondary)!important;font-weight:800}
.woocommerce span.onsale{background:var(--vm-secondary);color:#111;border-radius:999px;min-height:0;min-width:0;line-height:1.6;padding:2px 12px;top:10px;left:10px}
.woocommerce div.product div.images{margin-bottom:20px}
.woocommerce div.product .product_title{font-size:clamp(26px,4vw,40px)}
.woocommerce div.product form.cart .variations select{min-width:180px}
.woocommerce div.product form.cart .variations th,.woocommerce div.product form.cart .variations td{display:block;text-align:left;padding:4px 0;background:none}
.woocommerce-tabs ul.tabs{padding:0;margin:0 0 16px;display:flex;gap:6px;flex-wrap:wrap;list-style:none}
.woocommerce-tabs ul.tabs::before,.woocommerce-tabs ul.tabs::after{display:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li{background:var(--vm-surface);border:1px solid var(--vm-line);border-radius:10px;margin:0;padding:0}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:var(--vm-surface2);border-color:var(--vm-primary)}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{color:var(--vm-text);padding:10px 16px;display:block}
.woocommerce table.shop_table,.woocommerce-cart table.cart td,.woocommerce table.shop_table td,.woocommerce table.shop_table th{border-color:var(--vm-line)!important;background:transparent;color:var(--vm-text)}
.woocommerce table.shop_table{border-radius:var(--vm-radius);border:1px solid var(--vm-line)}
.woocommerce-cart .cart-collaterals .cart_totals,.woocommerce-checkout #order_review,.woocommerce-checkout #payment,.woocommerce-account .woocommerce-MyAccount-content{background:var(--vm-surface);border:1px solid var(--vm-line);border-radius:var(--vm-radius);padding:18px}
.woocommerce-checkout #payment div.payment_box{background:var(--vm-surface2);color:var(--vm-text)}
.woocommerce-checkout #payment div.payment_box::before{border-bottom-color:var(--vm-surface2)}
.woocommerce-checkout #payment ul.payment_methods{border-color:var(--vm-line)}
.woocommerce-message,.woocommerce-info,.woocommerce-error{background:var(--vm-surface);color:var(--vm-text);border-top-color:var(--vm-primary)}
.woocommerce-error{border-top-color:#ff6b6b}
.woocommerce-message::before,.woocommerce-info::before{color:var(--vm-primary)}
.woocommerce-MyAccount-navigation ul{list-style:none;padding:0;margin:0 0 16px;display:flex;flex-wrap:wrap;gap:6px}
.woocommerce-MyAccount-navigation a{display:block;padding:8px 14px;border:1px solid var(--vm-line);border-radius:10px;text-decoration:none}
.woocommerce-MyAccount-navigation .is-active a{background:var(--vm-primary);color:#111}
@media (min-width:769px){.woocommerce-account .woocommerce-MyAccount-navigation{float:left;width:24%}.woocommerce-account .woocommerce-MyAccount-content{float:right;width:73%}}
.woocommerce form .form-row label{color:var(--vm-text)}
.woocommerce form.checkout_coupon,.woocommerce form.login,.woocommerce form.register,.woocommerce form.woocommerce-form-track-order{border-color:var(--vm-line);border-radius:var(--vm-radius);background:var(--vm-surface)}
.woocommerce nav.woocommerce-pagination ul{border:0}
.woocommerce nav.woocommerce-pagination ul li{border:0;margin:0 3px}
.woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{background:var(--vm-surface);color:var(--vm-text);border-radius:10px;border:1px solid var(--vm-line)}
.woocommerce nav.woocommerce-pagination ul li span.current{background:var(--vm-primary);color:#111}

/* full-screen showroom template */
.vm-showroom-page .vm-footer{margin-top:0}
.vm-default-logo{height:44px;width:auto;display:block}
