/* Template 01 page composition / responsive rules. Component primitives live in app/UI/Template01/components.css. */
#xentra-customer-app {
  width: 100vw;
  max-width: none;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  background: var(--x-bg);
  overflow-x: clip;
}
#xentra-customer-app .x-ui__page { width: 100%; max-width: none; margin: 0; }
#xentra-app-root { width: 100%; min-height: 100vh; }

.x-template01-header-bg { background-color: var(--x-lime); background-image: var(--x-header-image); background-size: cover; background-position: center top; }
.x-template01-mobile-content { width: 100%; }
.x-template01-home { min-height:100vh; background:#fff; }
.x-template01-note { font-size:11px; color:var(--x-muted); }
.x-sheet-form-field { width:100%; border:1px solid #dfe3dc; border-radius:14px; padding:12px 14px; background:#fff; outline:none; }
.x-sheet-form-field:focus { border-color:#a4bd63; box-shadow:0 0 0 3px rgba(200,255,0,.22); }
.x-sheet-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px; }
.x-option-grid { display:grid; grid-template-columns:1fr; gap:10px; padding-bottom:6px; }
.x-option-card { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px; border:1px solid #e1e5df; border-radius:16px; background:#fff; text-align:left; }
.x-option-card.is-selected { border-color:#b7d85a; background:#f5ffd9; }
.x-option-card__copy { min-width:0; }
.x-option-card__title { display:block; font-size:13px; font-weight:900; }
.x-option-card__desc { display:block; margin-top:4px; font-size:11px; line-height:1.4; color:var(--x-muted); }
.x-radio { width:20px; height:20px; border-radius:50%; border:2px solid #b9beb6; flex:0 0 auto; position:relative; }
.x-option-card.is-selected .x-radio { border-color:#91aa00; }
.x-option-card.is-selected .x-radio::after { content:''; width:8px; height:8px; border-radius:50%; background:#91aa00; position:absolute; inset:4px; }

.x-cart-page__footer-spacer { height: 96px; }
.x-page-cta { position:fixed; left:0; right:0; bottom:0; z-index:5900; background:#fff; border-top:1px solid #e3e6df; padding:10px 16px calc(10px + env(safe-area-inset-bottom)); }
.x-page-cta button { width:100%; }

@media (min-width: 720px) {
  #xentra-customer-app .x-mobile-max,
  #xentra-customer-app .x-product-list,
  #xentra-customer-app .x-page__body,
  #xentra-customer-app .x-checkout-section,
  #xentra-customer-app .x-section-head,
  #xentra-customer-app .x-category-scroller { max-width:none; }
}


/* Xentra MVP interaction rules */
html.xentra-sheet-open, body.xentra-sheet-open { overflow: hidden; }
.x-bottom-shell { position: fixed !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 9000 !important; padding-bottom: env(safe-area-inset-bottom); }
.x-bottom-row { background:#fff; box-shadow:0 -8px 28px rgba(20,24,18,.10); }
.x-quick-checkout { color:#20231f !important; }
.x-quick-checkout__qty { color:#20231f !important; font-weight:800; }
.x-quick-checkout__source { color:#777d74 !important; }
.x-cart-action { position:relative; display:grid !important; place-items:center; }
.x-cart-svg { width:22px; height:22px; color:#20231f; }
.x-cart-badge { background:#e53935 !important; color:#fff !important; }
.x-sheet-backdrop { position:fixed !important; inset:0 !important; z-index:9990 !important; }
.x-bottom-sheet { position:fixed !important; left:0 !important; right:0 !important; bottom:0 !important; z-index:10000 !important; max-height:min(88dvh,760px); overflow:hidden; border-radius:20px 20px 0 0; background:#fff; box-shadow:0 -18px 50px rgba(0,0,0,.18); transform:translateY(105%); transition:transform .22s ease; }
.x-bottom-sheet.is-open { transform:translateY(0); }
.x-sheet-grabber { width:42px !important; height:5px !important; border-radius:999px !important; background:#aeb3ab !important; margin:9px auto 4px !important; flex:none; }
.x-sheet-head { position:relative !important; min-height:48px; padding:10px 54px 10px 20px !important; display:flex; align-items:center; }
.x-sheet-close { position:absolute !important; right:14px !important; top:8px !important; width:38px !important; height:38px !important; border-radius:50% !important; background:#f0f1ed !important; color:#252824 !important; border:0 !important; display:grid !important; place-items:center !important; font-size:24px !important; z-index:3; }
.x-sheet-scroll { overflow:auto !important; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; max-height:calc(min(88dvh,760px) - 64px); padding-bottom:calc(24px + env(safe-area-inset-bottom)); }
.x-page { min-height:100dvh; padding-bottom:100px; background:#fff; }
.x-page__header { position:sticky; top:0; z-index:30; background:rgba(255,255,255,.96); backdrop-filter:blur(12px); }
.x-page-cta,.x-checkout-sticky { padding-bottom:calc(10px + env(safe-area-inset-bottom)) !important; }
