/* Khafji shops: shared styles, mobile first. */
:root { --shop-gold:#a47f2d; --shop-ink:#302b23; --shop-line:#e8dfd0; --shop-bg:#fffdf9; }
body.km-shop-page { margin:0; background:var(--shop-bg); color:var(--shop-ink); font:16px Tahoma,Arial,sans-serif; padding-bottom:calc(96px + env(safe-area-inset-bottom)); }
.km-shop-page *, .km-shop-page *::before, .km-shop-page *::after { box-sizing:border-box; }
.km-shop-page [hidden] { display:none!important; }
.km-shop-page svg { width:22px; height:22px; flex-shrink:0; }
.km-shop-shell { max-width:820px; margin:auto; padding:16px 14px 24px; }
.km-shop-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:18px; min-height:44px; }
.km-shop-head h1 { margin:0; font-size:24px; line-height:1.4; }
.km-shop-head a { color:var(--shop-gold); text-decoration:none; font-size:14px; font-weight:700; }
.km-shop-head .km-language-switch { min-height:38px; padding:7px 10px; font-size:12px; background:white; border-color:var(--shop-line); box-shadow:none; }
.km-shop-page .km-panel { padding:16px; border:1px solid var(--shop-line); border-radius:15px; background:white; box-shadow:0 4px 16px #604b1708; }
.km-shop-page .km-panel h2 { font-size:20px; line-height:1.45; }
.km-shop-page .km-button { display:inline-flex; justify-content:center; align-items:center; gap:7px; min-height:44px; padding:9px 13px; border:1px solid transparent; border-radius:10px; background:var(--shop-gold); color:white; font:700 14px Tahoma,Arial,sans-serif; line-height:1.5; text-decoration:none; cursor:pointer; }
.km-shop-page .km-button.ghost, .km-shop-page .km-button.secondary { background:#faf5e9; border-color:#e5d8bd; color:#76581f; }
.km-shop-page .km-button.danger { background:#fff0ee; color:#a92117; }
.km-shop-page .km-muted { color:#756d5f; font-size:13px; line-height:1.7; }
.km-shop-page .km-form { gap:15px; min-width:0; }
.km-shop-page .km-form label { font-size:14px; line-height:1.6; min-width:0; }
.km-shop-page .km-form input:not([type=checkbox]):not([type=radio]), .km-shop-page .km-form select, .km-shop-page .km-form textarea { width:100%; max-width:100%; min-width:0; min-height:46px; margin-top:6px; padding:10px; border:1px solid #ddd4c5; border-radius:10px; background:white; color:var(--shop-ink); font:16px Tahoma,Arial,sans-serif; }
.km-shop-page .km-form textarea { resize:vertical; line-height:1.6; }
.km-shop-page input[type=checkbox], .km-shop-page input[type=radio] { width:18px; height:18px; min-height:18px; padding:0; margin:0 0 0 5px; vertical-align:middle; flex-shrink:0; accent-color:var(--shop-gold); }
.km-shop-page .km-form input[type=file] { padding:10px 7px!important; font-size:13px!important; }
.km-shop-page :focus-visible { outline:3px solid #b592454d; outline-offset:3px; }
.km-shop-form-section { display:grid; gap:12px; }
.km-shop-form-section>summary { min-height:44px; padding:10px 0; color:#76581f; cursor:pointer; font-weight:700; }
.km-shop-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.km-shop-upload { display:flex; flex-direction:column; align-items:flex-start; gap:8px; border:1px dashed #d5c29a; border-radius:12px; padding:12px; overflow:hidden; }
.km-shop-preview-img { width:80px; height:80px; object-fit:contain; border-radius:10px; }
.km-shop-gallery { display:flex; flex-wrap:wrap; gap:10px; }
.km-shop-gallery img { width:76px; height:76px; object-fit:contain; border-radius:8px; }
.km-shop-tabform { margin:0; }
.km-shop-toprow { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.km-shop-url { font-size:13px; color:#756d5f; overflow-wrap:anywhere; line-height:1.7; }
.km-shop-state { display:inline-flex; align-items:center; padding:5px 9px; border-radius:20px; background:#f4ead8; color:#715521; font-size:12px; line-height:1.4; }
.km-shop-state.published { background:#eaf5e8; color:#378036; }
.km-shop-state.hidden { background:#fce9e5; color:#b44334; }
/* Compact shop links on the homepage. */
.km-shop-tiles { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.km-shop-tile { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; min-height:104px; min-width:0; position:relative; border:1px solid #eee8dd; border-radius:15px; padding:10px 4px; background:white; color:var(--shop-ink); text-decoration:none; text-align:center; box-shadow:0 4px 14px #3d301208; }
.km-shop-tile img { width:44px; height:44px; border-radius:10px; object-fit:contain; }
.km-shop-tile strong { font-size:12px; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; max-width:100%; }
.km-shop-symbol { display:block; width:40px; height:40px; color:var(--shop-gold); }
.km-shop-symbol svg { width:100%; height:100%; }
.km-shop-ad { position:absolute; top:5px; inset-inline-end:5px; padding:2px 5px; border-radius:5px; color:#80611f; background:#f4ead0; font-size:10px; }
.km-shops-home { margin:22px 0; }
.km-shops-home h2 { margin:0 0 13px; font-size:20px; color:#8c6a24; }
.km-shops-home-all { display:table; margin:14px auto 0; padding:10px 16px; border:1px solid #dcc897; border-radius:10px; color:#80611f; text-decoration:none; font-size:13px; min-height:44px; }
/* Public storefront. */
.km-shop-public .km-shop-shell { max-width:860px; padding:0 14px 24px; }
.km-shop-public .km-shop-head { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:9px; margin:0 -14px; padding:12px 14px; border-bottom:1px solid #eee7d8; background:#faf7ee; }
.km-shop-public .km-shop-head>.km-language-switch { grid-column:2; grid-row:1; justify-self:end; }
.km-shop-public .km-shop-brand { grid-column:1; grid-row:1; color:#222; text-align:start; font-size:21px; }
.km-shop-header-actions { grid-column:1/-1; display:flex; gap:8px; }
.km-shop-public .km-shop-header-actions .km-button { flex:1; min-width:0; min-height:40px; padding:7px 9px; background:#fffdf8; font-size:12px; }
.km-shop-header-actions svg { width:17px; height:17px; }
/* Compact edge-to-edge cover, matching the approved store layout. */
.km-shop-cover-frame { position:relative; isolation:isolate; width:calc(100% + 28px); height:clamp(160px,48.7vw,300px); padding-bottom:0; margin:0 -14px; overflow:hidden; border-radius:0 0 24px 24px; background:#f0e7d5; }
.km-shop-cover { position:relative; display:block; width:100%; height:100%; max-height:none; object-fit:cover; object-position:center; padding:0; margin:0; }

.km-shop-identity { padding:0 4px; text-align:center; }
.km-shop-identity-main { display:flex; flex-direction:column; align-items:center; gap:0; min-width:0; padding-top:16px; }
.km-shop-identity.has-cover .km-shop-identity-main { padding-top:0; }
.km-shop-identity-main>img,.km-shop-logo-fallback { display:flex; align-items:center; justify-content:center; position:relative; width:88px; height:88px; margin:0; object-fit:contain; border:2px solid #bca161; border-radius:50%; padding:5px; background:#fbf6eb; box-shadow:0 0 0 5px #fffdf9; flex-shrink:0; }
.km-shop-identity.has-cover .km-shop-identity-main>img,.km-shop-identity.has-cover .km-shop-logo-fallback { margin-top:-39px; }
.km-shop-logo-fallback svg { width:40px; height:40px; color:#a47f2d; }
.km-shop-identity-text { width:100%; min-width:0; text-align:center; }
.km-shop-identity-text h1 { font-size:26px; line-height:1.4; margin:8px 0 0; color:#402e17; overflow-wrap:anywhere; }
.km-shop-identity-text>span { display:inline-block; font-size:14px; line-height:1.3; color:#584a37; }
.km-shop-identity-text p { font-size:14px; line-height:1.55; margin:3px 0 0; white-space:pre-line; overflow-wrap:anywhere; }
.km-shop-city { display:inline-flex; align-items:center; gap:6px; margin-top:7px; color:#584a37; font-size:15px; line-height:1.6; text-decoration:none; }
.km-shop-city svg { width:17px; height:20px; color:#af8836; }
.km-shop-contact { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:12px 0 0; }
.km-shop-public .km-shop-contact .km-button { min-height:44px; font-size:14px; padding:9px 7px; }
.km-shop-public .km-shop-contact .km-shop-whatsapp { grid-column:1/-1; background:linear-gradient(110deg,#ae8735,#947023); font-size:16px; min-height:48px; }
.km-shop-products-title { display:flex; align-items:center; gap:10px; margin:22px 0 12px; font-size:21px; line-height:1.4; }
.km-shop-products-title:after { content:""; flex:1; height:1px; background:#ded4c0; }
.km-shop-public-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; align-items:stretch; }
.km-shop-product { display:flex; flex-direction:column; min-width:0; border:1px solid var(--shop-line); border-radius:12px; overflow:hidden; text-align:start; background:white; color:var(--shop-ink); font:inherit; padding:0; cursor:pointer; box-shadow:0 3px 8px #56452b07; }
.km-shop-product>img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:contain; background:#fff; padding:5px; }
.km-shop-product>div { padding:10px; flex:1; width:100%; }
.km-shop-product strong { display:block; font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.km-shop-price { display:block; color:#80611f; font-weight:700; margin-top:4px; font-size:14px; line-height:1.5; }
.km-shop-pager { display:flex; justify-content:center; gap:10px; margin:18px 0; }
.km-shop-pager:empty { display:none; }
.km-shop-footer-url { display:block; text-align:center; margin:18px 0 0; padding-top:14px; border-top:1px solid #e2dacb; font-size:12px; line-height:1.7; color:#786e5e; overflow-wrap:anywhere; }
/* Product and install dialogs. */
.km-shop-dialog { width:min(calc(100% - 24px),550px); max-height:calc(100dvh - 32px); border:1px solid var(--shop-line); border-radius:16px; padding:16px; color:var(--shop-ink); background:white; overflow:auto; overscroll-behavior:contain; }
.km-shop-dialog::backdrop { background:#0006; }
.km-shop-dialog h2 { font-size:21px; line-height:1.5; margin:14px 0 10px; }
.km-shop-dialog img { display:block; width:100%; max-height:340px; object-fit:contain; border-radius:10px; margin:8px 0; }
.km-shop-dialog p { white-space:pre-line; overflow-wrap:anywhere; line-height:1.7; }
.km-shop-product-direct { display:block; margin:12px 0; color:#8b6924; font-size:12px; line-height:1.7; overflow-wrap:anywhere; }
.km-shop-dialog [data-order], .km-shop-dialog [data-product-copy] { width:100%; margin-top:8px; }
/* Owner dashboard. */
.km-shop-summary-info { display:flex; flex-direction:row-reverse; gap:12px; align-items:center; }
.km-shop-summary-info>div { flex:1; min-width:0; }
.km-shop-summary-info h2 { margin:0 0 6px; font-size:21px; line-height:1.5; overflow-wrap:anywhere; }
.km-shop-dashboard-logo,.km-shop-dashboard-placeholder { width:74px; height:74px; border-radius:10px; object-fit:contain; flex-shrink:0; }
.km-shop-dashboard-placeholder { display:grid; place-items:center; background:#f5eddf; color:var(--shop-gold); }
.km-shop-dashboard-placeholder svg { width:38px; height:38px; }
.km-shop-summary .km-shop-url { margin:8px 0 0; font-size:12px; text-decoration:underline; }
.km-shop-summary-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; border-top:1px solid #eee7d9; padding-top:12px; margin-top:14px; }
.km-shop-summary-actions .km-button { padding:8px 4px!important; font-size:12px!important; gap:5px!important; }
.km-shop-summary-actions svg { width:17px; height:17px; }
.km-shop-tools { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin:12px 0 20px; }
.km-shop-tools a { display:flex; align-items:center; gap:8px; min-width:0; min-height:65px; padding:12px 10px; border:1px solid var(--shop-line); border-radius:12px; background:white; color:var(--shop-ink); text-decoration:none; font-size:13px; font-weight:700; line-height:1.6; }
.km-shop-tools a>span { flex:1; min-width:0; }
.km-shop-tools a>svg:first-child { width:23px; height:23px; color:#9c752b; }
.km-shop-tools a>svg:last-child { width:12px; height:12px; color:#837767; }
.km-shop-products-admin>.km-shop-toprow { margin:20px 0 8px; }
.km-shop-products-admin h2 { font-size:19px; margin:0; line-height:1.5; }
.km-shop-products-admin>.km-muted { font-size:12px; margin:8px 0 12px; }
.km-shop-product-row { display:flex; align-items:center; gap:12px; padding:13px 0; border-bottom:1px solid var(--shop-line); }
.km-shop-product-row>div { flex:1; min-width:0; }
.km-shop-products-admin>.km-shop-product-row { display:grid; grid-template-columns:72px minmax(0,1fr); gap:11px; background:white; border:1px solid var(--shop-line); border-radius:13px; padding:12px; margin-bottom:11px; }
.km-shop-products-admin .km-shop-preview-img,.km-shop-product-placeholder { width:72px; height:72px; object-fit:contain; border-radius:9px; }
.km-shop-product-placeholder { display:grid; place-items:center; background:#f5efe3; color:var(--shop-gold); }
.km-shop-products-admin .km-shop-product-row strong { display:block; font-size:15px; line-height:1.5; overflow-wrap:anywhere; }
.km-shop-products-admin .km-shop-price { font-size:13px; margin:3px 0 5px; }
.km-shop-product-row .km-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:9px; align-items:start; }
.km-shop-products-admin .km-shop-product-row .km-button { min-height:44px; padding:8px 11px; font-size:13px; }
.km-shop-product-row .km-button svg { width:17px; height:17px; }
.km-shop-row-menu summary { list-style:none; min-height:44px; padding:10px 11px; border:1px solid #e5d8bd; border-radius:10px; background:#faf5e9; color:#76581f; font-size:13px; line-height:1.5; cursor:pointer; }
.km-shop-row-menu summary::-webkit-details-marker { display:none; }
.km-shop-row-menu[open] { flex-basis:100%; }
.km-shop-row-menu[open] .km-actions { gap:7px; margin-top:8px; }
.km-shop-install-card { display:flex; align-items:center; gap:12px; margin-top:18px; }
.km-shop-install-card>div { flex:1; min-width:0; }
.km-shop-install-card h2 { font-size:18px!important; }
.km-shop-install-card p { font-size:12px; margin:6px 0 9px; }
.km-shop-install-card>svg { width:54px; height:54px; padding:10px; border-radius:50%; background:#f8f1e4; color:var(--shop-gold); }
.km-shop-install-card .km-button { font-size:12px; }
.km-shop-manage #shopForm,.km-shop-manage #contact,.km-shop-manage #images,.km-shop-manage #publication { scroll-margin-top:15px; }
/* Image selections stay normal-sized inside forms. */
.km-product-image-choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:10px; }
.km-shop-image-choice { display:flex; flex-direction:column; align-items:stretch; gap:8px; min-width:0; border:1px solid #e6dcc7; border-radius:11px; background:#fffaf0; padding:9px; }
.km-shop-gallery .km-shop-image-choice img { width:100%; height:112px; object-fit:contain; background:white; border-radius:7px; }
.km-shop-image-choice label { display:flex; align-items:center; gap:5px; font-size:12px!important; line-height:1.6; min-height:32px; }
.km-shop-page .km-form .km-shop-image-choice input[type=radio],#shops .km-shop-image-choice input[type=radio] { width:18px; height:18px; min-height:18px; min-width:18px; padding:0; margin:0; flex:0 0 18px; border-radius:50%; }
.km-shop-image-choice.is-removed { opacity:.5; }
.km-shop-image-choice .km-button { min-height:40px; font-size:12px; padding:7px 10px; }
.km-product-images-editor .km-muted { font-size:12px; margin:8px 0; }
.km-shop-image-choice:has(input[type=radio]:checked) { border-color:#aa8431; background:#fbf1d9; }
/* Owner navigation has enough room above the phone home indicator. */
.km-shop-owner-nav { position:fixed; z-index:100; bottom:0; left:50%; transform:translateX(-50%); width:min(100%,860px); display:grid; grid-template-columns:repeat(var(--shop-nav-count,5),minmax(0,1fr)); background:white; border-top:1px solid #e9e3d8; padding:10px 3px max(12px,env(safe-area-inset-bottom)); box-shadow:0 -3px 14px #57462908; }
.km-shop-owner-nav a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-width:0; min-height:44px; color:#777; text-decoration:none; font-size:12px; line-height:1.4; position:relative; }
.km-shop-owner-nav a svg { width:23px; height:23px; }
.km-shop-owner-nav a.active { color:var(--shop-gold); font-weight:700; }
.km-shop-owner-nav a.active:after { content:""; position:absolute; bottom:-8px; width:45%; height:3px; border-radius:4px; background:var(--shop-gold); }
/* Admin panel uses the same image selectors. */
#shops .km-shop-admin-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
#shops input:not([type=checkbox]):not([type=radio]),#shops textarea,#shops select { width:100%; max-width:100%; box-sizing:border-box; }
#shops .km-shop-product-row img { flex-shrink:0; }
#shops .km-shop-tile { min-height:90px; }
#shops .shop-admin-list { display:grid; gap:12px; }
#shops .shop-admin-list input { font-size:16px; }
#shops .shop-admin-list .edit-card { overflow-wrap:anywhere; }
#shops .shop-admin-list .reorder { display:flex; gap:8px; flex-wrap:wrap; }
html[dir=ltr] .km-shop-tools a>svg:last-child { transform:rotate(180deg); }
@media(max-width:480px) {
  #shops .km-shop-admin-grid { grid-template-columns:1fr; }
  .km-shop-manage #shopForm>.km-form>.km-shop-grid { grid-template-columns:1fr; }
}
@media(max-width:360px) {
  .km-shop-shell { padding-inline:10px; }
  .km-shop-public .km-shop-shell { padding-inline:12px; }
  .km-shop-public .km-shop-head { margin-inline:-12px; padding-inline:12px; }
  .km-shop-head h1 { font-size:21px; }
  .km-shop-summary-actions .km-button { font-size:11px!important; }
  .km-shop-summary-actions svg { width:15px; height:15px; }
  .km-shop-cover-frame { width:calc(100% + 24px); margin-inline:-12px; }
  .km-shop-tools a { font-size:12px; padding:10px 8px; gap:6px; }
  .km-shop-identity-text h1 { font-size:24px; }
  .km-shop-products-title { font-size:19px; }
  .km-shop-product>div { padding:8px; }
}
@media(min-width:700px) {
  .km-shop-shell { padding-top:24px; }
  .km-shop-public .km-shop-head { grid-template-columns:auto minmax(0,1fr) auto; align-items:center; }
  .km-shop-public .km-shop-brand { grid-column:1; }
  .km-shop-public .km-shop-head>.km-language-switch { grid-column:3; }
  .km-shop-header-actions { grid-column:2; grid-row:1; justify-self:center; }
  .km-shop-public .km-shop-header-actions .km-button { flex:initial; padding:8px 14px; }

  .km-shop-public-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .km-shop-identity-main>img,.km-shop-logo-fallback { width:128px; height:128px; }
  .km-shop-identity.has-cover .km-shop-identity-main>img,.km-shop-identity.has-cover .km-shop-logo-fallback { margin-top:-58px; }
  .km-shop-identity-text h1 { font-size:32px; }
  .km-shop-identity-text p { font-size:16px; }
  .km-shop-tools a { font-size:15px; min-height:74px; padding:16px; }
}

/* One large photo with selectable thumbnails, using existing WebP files. */
.km-product-gallery-main { display:block; height:clamp(210px,65vw,340px); background:#faf8f2; border:1px solid #eee5d6; border-radius:12px; overflow:hidden; }
.km-shop-dialog .km-product-gallery-main img { display:block; width:100%; height:100%; min-height:0; max-height:none; margin:0; object-fit:contain; border-radius:0; }
.km-product-gallery-thumbs { display:flex; justify-content:center; gap:8px; flex-wrap:wrap; margin:10px 0 0; }
.km-product-gallery-thumb { width:58px; height:58px; flex:0 0 58px; padding:3px; border:1px solid #e6dcc7; border-radius:9px; background:white; cursor:pointer; }
.km-shop-dialog .km-product-gallery-thumb img { display:block; width:100%; height:100%; max-height:none; margin:0; border-radius:5px; object-fit:contain; }
.km-product-gallery-thumb[aria-pressed=true] { border:2px solid #a47f2d; background:#fff4d8; }
.km-product-gallery-count { margin:7px 0 0!important; color:#81745d; text-align:center; font-size:12px; }

/* The city site identity stays separate from each merchant identity. */
.km-shop-public .km-shop-brand { display:flex; align-items:center; gap:8px; min-width:0; }
.km-shop-brand>img { width:38px; height:38px; object-fit:contain; flex-shrink:0; }
.km-shop-brand>span { display:block; min-width:0; }
.km-shop-brand b { display:block; font-size:19px; line-height:1.45; color:#222; }
.km-shop-brand small { display:block; font-size:10px; line-height:1.5; color:#222; font-weight:400; }
.km-shop-public .km-shop-header-actions { justify-content:flex-end; }
.km-shop-public .km-shop-header-actions .km-button { flex:initial; min-height:36px; padding:6px 13px; font-size:12px; }
.km-shop-header-actions:empty { display:none; }
.km-shop-visitor-nav button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-width:0; min-height:44px; padding:0; border:0; background:transparent; color:#777; font:12px Tahoma,Arial,sans-serif; line-height:1.4; cursor:pointer; }
.km-shop-visitor-nav button svg { width:23px; height:23px; }
.km-shop-visitor-nav a,.km-shop-visitor-nav button { font-size:11px; }
@media(max-width:360px) { .km-shop-brand b { font-size:17px; } .km-shop-brand small { font-size:9px; } .km-shop-brand>img { width:34px; height:34px; } }

/* Separate settings into distinct, touch-friendly cards. */
.km-shop-settings-section { min-width:0; padding:16px; border:1px solid #e7ddc9; border-radius:14px; background:#fffdf8; box-shadow:0 3px 12px #66492305; }
.km-shop-settings-section h3 { display:flex; align-items:center; gap:8px; margin:0 0 14px; padding-bottom:10px; border-bottom:1px solid #e9e1d2; font-size:17px; line-height:1.5; color:#73551f; }
.km-shop-settings-section h3 svg { width:21px; height:21px; }
.km-shop-settings-section>label,.km-shop-settings-section>div>label { margin-top:12px; }
.km-shop-page .km-form .km-shop-setting-toggle { display:flex; align-items:center; gap:10px; min-height:44px; padding:10px 12px; background:#f5efe3; border:1px solid #e8dec9; border-radius:10px; font-size:14px; line-height:1.6; cursor:pointer; }
.km-shop-setting-toggle input[type=checkbox] { flex:0 0 18px; }
#shopLocationFields { margin-top:14px; }
#shopLocationFields #openShopMap { margin-top:10px; width:100%; }
.km-shop-settings-section .km-shop-upload { background:white; }
@media(max-width:360px) { .km-shop-settings-section { padding:12px; } }

.km-shop-bio-counter { display:block; margin-top:6px; font-size:12px; line-height:1.6; color:#766b56; font-weight:400; }
.km-shop-bio-counter.is-limit { color:#9a6e22; font-weight:700; }

.km-shop-settings-section>label:not(.km-shop-setting-toggle) { display:block; }
.km-shop-settings-section>small.km-muted { display:block; margin:6px 0 12px; }
.km-shop-upload input[type=file]::file-selector-button { padding:6px 8px; border:1px solid #d9cba9; border-radius:6px; background:#faf5e9; color:#73551f; font:inherit; }

.km-shop-page .km-form .km-shop-field { display:block; width:100%; margin:12px 0 0; }
.km-shop-field>span { display:block; margin-bottom:5px; line-height:1.6; }
.km-shop-field-help { display:block; margin:7px 0 16px!important; line-height:1.6; }
.km-shop-settings-section h3 { column-gap:10px; }
.km-shop-settings-section h3 svg { flex:0 0 21px; }
.km-shop-setting-toggle { width:100%; margin:12px 0 16px!important; }
.km-shop-location-actions { display:grid; grid-template-columns:1fr; gap:8px; margin:12px 0; }
.km-shop-location-actions .km-button { width:100%; min-height:44px; }
.km-shop-location-link { display:block; padding:9px 0; font-size:13px; line-height:1.6; color:#80611f; overflow-wrap:anywhere; }
#shopLocationPreviewNotice:empty { display:none; }
.km-shop-form-section #shopMapArea,.km-shop-settings-section #shopMapArea { margin-top:12px; }

.km-shop-contact-option { margin-top:14px; padding:12px; border:1px solid #e6ddcc; border-radius:12px; background:white; }
.km-shop-contact-option+.km-shop-contact-option { margin-top:18px; }
.km-shop-contact-option .km-shop-setting-toggle { margin-bottom:0!important; }
.km-shop-contact-option .km-shop-field { margin-top:0!important; }
.km-shop-description-field { margin-top:18px!important; }

#shopMap { position:relative; isolation:isolate; z-index:0; }

/* Compact homepage service introduction, matching the city service cards. */
.km-shop-service-card { display:flex; align-items:center; gap:12px; padding:16px; margin:0 0 14px; border:1px solid #ecdcb7; border-radius:20px; background:#fbf7ed; color:#302b23; text-decoration:none; box-shadow:0 4px 14px #76581b06; min-width:0; }
.km-shop-service-icon { display:flex; align-items:center; justify-content:center; width:48px; height:48px; flex:0 0 48px; border-radius:14px; background:#ae8530; color:white; }
.km-shop-service-icon svg { width:29px; height:29px; }
.km-shop-service-copy { flex:1; min-width:0; text-align:start; }
.km-shop-service-copy strong { display:block; font-size:18px; font-weight:800; line-height:1.5; }
.km-shop-service-copy small { display:block; font-size:13px; line-height:1.7; color:#726956; margin-top:3px; }
.km-shop-service-arrow { flex:0 0 22px; font-size:25px; color:#9b7428; text-align:center; }
@media(max-width:360px) { .km-shop-service-card { gap:9px; padding:13px; } .km-shop-service-copy strong { font-size:16px; } .km-shop-service-copy small { font-size:12px; } .km-shop-service-icon { width:42px; height:42px; flex-basis:42px; } }


/* Equal storefront header actions on phones and desktop. */
.km-shop-public .km-shop-header-actions { grid-column:1/-1; grid-row:auto; justify-self:stretch; width:100%; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.km-shop-public .km-shop-header-actions .km-button { display:flex; align-items:center; justify-content:center; gap:6px; width:100%; min-width:0; min-height:42px; margin:0; padding:8px 6px; box-sizing:border-box; font-size:12px; white-space:nowrap; }

/* Section navigation and accessible native photo picker. */
.km-shop-section-head { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; }
.km-shop-section-head h1 { grid-column:1/-1; grid-row:1; text-align:center; }
.km-shop-section-head>[data-shop-language] { grid-column:1; grid-row:2; }
.km-shop-section-head>.km-shop-back { grid-column:2; grid-row:2; min-height:40px; padding:7px 10px; font-size:13px; }
.km-shop-back svg { width:17px; height:17px; }
[dir=rtl] .km-shop-back svg { transform:rotate(180deg); }
.km-product-upload-control { display:block; position:relative; width:100%; margin-top:8px; }
.km-product-upload-control>.km-button { width:100%; min-height:46px; }
.km-shop-page .km-form .km-product-upload-control>input[type=file] { position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0!important; opacity:0; cursor:pointer; }
.km-product-upload-control:focus-within>.km-button { outline:3px solid #b592454d; outline-offset:3px; }

.km-shop-save-spinner { display:inline-block; width:17px; height:17px; border:2px solid currentColor; border-inline-end-color:transparent; border-radius:50%; flex-shrink:0; animation:km-shop-saving .8s linear infinite; }
.km-shop-page #productForm .km-actions button:disabled { opacity:.8; cursor:wait; }
@keyframes km-shop-saving { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .km-shop-save-spinner { animation:none; } }

/* Named dashboard link instead of a raw URL. */
.km-shop-visit { display:flex; align-items:center; justify-content:center; gap:7px; width:fit-content; max-width:100%; min-height:40px; margin-top:10px; padding:8px 12px; border:1px solid #e5d8bd; border-radius:10px; background:#faf5e9; color:#76581f; font-size:13px; font-weight:700; line-height:1.5; text-decoration:none; }
.km-shop-visit svg { width:18px; height:18px; }
.km-shop-visit svg:last-child { width:14px; height:14px; }
[dir=ltr] .km-shop-visit svg:last-child { transform:rotate(180deg); }
.km-shop-visit:hover { background:#f3ead7; }
.km-shop-visit:active { background:#eee1c5; }

.km-shop-manage .km-form>.km-shop-visit { margin-top:0; margin-bottom:4px; }

.km-shop-qr-card { display:grid; grid-template-columns:112px minmax(0,1fr); align-items:center; gap:14px; border-top:1px solid #eee7d9; padding-top:14px; margin-top:14px; }
.km-shop-qr-card canvas { display:block; width:112px; height:112px; background:#fff; border-radius:4px; }
.km-shop-qr-card h3 { font-size:16px; line-height:1.5; margin:0; }
.km-shop-qr-card p { margin:4px 0 8px; }
.km-shop-qr-card .km-button { min-height:40px; padding:7px 9px; font-size:12px; gap:5px; }
.km-shop-qr-card .km-button svg { width:17px; height:17px; }

/* Header shop visit and section dashboard return. */
.km-shop-section-head>.km-shop-back svg { transform:none; }
[dir=rtl] .km-shop-return svg { transform:rotate(180deg); }
[dir=ltr] .km-shop-return svg { transform:none; }
.km-shop-card-view>.km-shop-return { margin-top:0; margin-bottom:12px; }

.km-shop-required { display:inline-block; margin-inline-start:5px; color:#9e332d; font-size:11px; font-weight:400; }
.km-shop-page .km-form .km-shop-field-invalid { border:1.5px solid #b73932!important; box-shadow:0 0 0 2px #b7393212; }
.km-product-upload-control.km-shop-field-invalid { border-radius:10px; }
.km-product-upload-control.km-shop-field-invalid>.km-button { border-color:transparent; }
.km-shop-field-error { display:block; margin-top:6px; color:#a92f29; font-size:12px; line-height:1.7; font-weight:400; }

/* Each product owns its preparation estimate. */
.km-product-prep{display:block;color:#80632d;font-size:12px;line-height:1.8;margin-top:7px;overflow-wrap:anywhere}.km-shop-dialog .km-product-prep{font-size:13px;background:#faf6eb;border:1px solid #e6d9bc;border-radius:9px;padding:10px}.km-product-prep-fields{margin:16px 0;border:1px solid var(--shop-line);border-radius:12px;padding:14px;min-width:0}.km-product-prep-fields legend{font-size:14px;padding:0 5px}.km-product-prep-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;align-items:end}.km-product-prep-grid label{min-width:0}.km-product-prep-fields .km-muted{font-size:12px;margin-bottom:0}@media(max-width:380px){.km-product-prep-grid{grid-template-columns:1fr 1fr}.km-product-prep-grid label:last-child{grid-column:1/-1}}
/* Shop context, supervisors, retained product trash, and the shared place-style map. */
.km-shop-cover-size{display:block;color:#786745;font-size:12px;line-height:1.9;margin:7px 0 10px;font-weight:400}.km-shop-context{display:flex;gap:8px 14px;align-items:center;flex-wrap:wrap;padding:14px 0;border-bottom:1px solid var(--shop-line);margin-bottom:18px}.km-shop-context>span{font-size:12px;color:#8a6a2d;background:#faf3e3;padding:5px 9px;border-radius:7px}.km-shop-context form{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:100%}.km-shop-context select{font:inherit;max-width:100%;min-width:0;padding:9px;border:1px solid var(--shop-line);border-radius:9px;background:#fff}.km-shop-team summary{font-weight:600;cursor:pointer;line-height:1.8}.km-shop-team-row{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:12px 0;border-top:1px solid var(--shop-line)}.km-shop-team-row>div{min-width:0;overflow-wrap:anywhere}.km-shop-team-row small{display:block;color:#80745e;margin-top:5px}.km-shop-team-add{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin-top:14px}.km-shop-team-add label{display:flex;flex-direction:column;gap:8px;flex:1;min-width:150px;font-size:14px}.km-shop-team-add input{width:100%;min-height:44px;border:1px solid var(--shop-line);border-radius:9px;padding:10px;font:inherit}.km-shop-trash-row{padding:14px 0;border-top:1px solid var(--shop-line);overflow-wrap:anywhere}.km-shop-trash-row .km-muted{font-size:12px;margin:6px 0 10px}.km-shop-product-log{border-top:1px solid var(--shop-line);padding-top:12px;font-size:13px;line-height:1.9;overflow-wrap:anywhere}.km-shop-product-log small{color:#7c715c;font-size:12px}.km-shop-location-map{height:310px;width:100%;border:1px solid var(--shop-line);border-radius:13px;z-index:0;margin:12px 0}.km-shop-location-map.is-selected{border-color:#ac893c}.km-shop-page .km-shop-locate{width:100%;background:#a47f2d;color:#fff;min-height:48px}.km-shop-location-error{color:#af241b;background:#fff2ef;border:1px solid #e9b9b1;border-radius:10px;padding:12px;font-size:14px;line-height:1.8}.km-shop-location-status{padding:10px 12px;background:#f9f4e7;border-radius:9px;color:#75603a;font-size:13px;line-height:1.8}.km-shop-location-picker .km-shop-location-link{display:block;line-height:1.9;margin:10px 0}.km-shop-location-picker{margin-top:12px}.km-shop-location-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
/* Storefront design 3; merchant-selected cover presentation. */
.km-shop-layout-3{background:#faf8f3}
.km-shop-layout-3 .km-shop-identity{background:#fcf8ed;border-radius:0 0 18px 18px;padding:0 10px 14px}
.km-shop-layout-3 .km-shop-identity-text h1{font-size:clamp(22px,5vw,28px)}
.km-shop-layout-3 .km-shop-contact{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.km-shop-layout-3 .km-shop-contact .km-button{flex:1;min-width:100px;min-height:40px;padding:7px;font-size:12px;background:#fffdf8;color:#806126;border:1px solid #d9c79f}
.km-shop-layout-3 .km-shop-contact .km-shop-whatsapp{font-size:12px;min-height:40px;background:#fffdf8;color:#806126}
.km-shop-layout-3 .km-shop-product{border-radius:13px;background:#fffdf8;box-shadow:none}
.km-shop-layout-3 .km-shop-product>img{aspect-ratio:1.4;padding:8px;background:#fffdf8}
.km-shop-layout-3 .km-shop-product>div{padding:8px}
.km-shop-layout-3 .km-shop-product strong{font-size:13px}
.km-shop-layout-3 .ksc-product-card{background:#fffdf8;border:1px solid #e5d6b7;border-radius:14px;overflow:hidden}
.km-shop-layout-3 .ksc-product-card .km-shop-product{border:0;border-radius:0}
.km-shop-layout-3 .ksc-product-card .ksc-add{border-radius:9px;margin:0 7px 7px;width:calc(100% - 14px);min-height:44px;padding:7px;font-size:12px}
.km-shop-layout-3 .km-shop-owner-nav a{font-size:11px;text-align:center;padding-inline:2px}
.km-cover-style-1 .km-shop-cover-frame{border-radius:0}
.km-cover-style-2 .km-shop-cover-frame{border-radius:0 0 15px 15px}
.km-cover-style-2 .km-shop-identity-main{flex-direction:row;align-items:center;gap:14px;padding-top:12px!important;text-align:start}
.km-cover-style-2 .km-shop-identity-main>img,.km-cover-style-2 .km-shop-logo-fallback{margin-top:-26px!important;width:76px;height:76px}
.km-cover-style-2 .km-shop-identity-text{text-align:start}
.km-cover-style-3 .km-shop-cover-frame{border-radius:0 0 42% 12% / 0 0 16% 6%;border-bottom:2px solid #b28a34}
.km-cover-style-picker{border:0;padding:0;margin:18px 0;min-width:0}
.km-cover-style-picker legend{font-size:15px;font-weight:700;margin-bottom:10px}
.km-cover-style-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.km-cover-style-choice{display:flex!important;flex-direction:column;gap:8px;align-items:center;position:relative;padding:10px 6px;border:1px solid #e5d6b7;border-radius:10px;background:#fffdf8;cursor:pointer;min-width:0}
.km-cover-style-choice:has(input:checked){border-color:#a47f2d;box-shadow:inset 0 0 0 1px #a47f2d;background:#faf3e3}
.km-cover-style-choice input{width:18px!important;height:18px;min-height:0!important;accent-color:#a47f2d}
.km-cover-style-choice b{font-size:12px;font-weight:500}
.km-cover-style-sample{display:block;position:relative;background:#ead9b6;width:100%;height:52px;margin-bottom:9px}
.km-cover-style-sample>span{position:absolute;bottom:-12px;left:calc(50% - 13px);width:26px;height:26px;border:3px solid #fffdf8;border-radius:50%;background:#b28a34}
.km-cover-style-sample.style-2{border-radius:0 0 8px 8px}.km-cover-style-sample.style-2>span{left:auto;inset-inline-start:8px}
.km-cover-style-sample.style-3{border-radius:0 0 42% 12% / 0 0 26% 10%;border-bottom:2px solid #b28a34}
@media(min-width:700px){.km-shop-layout-3 .km-shop-public-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* One frame and service header across merchant pages. */
body.km-shop-page{background:#f5f2eb}
.km-shop-page .km-shop-shell,.km-shop-page .ko-wrap,.km-shop-page .ks-shell{width:100%;max-width:980px;margin-inline:auto;min-height:calc(100dvh - 96px);padding:0 14px 24px;background:#fffdf9;border-inline:1px solid #e8dfd0}
.km-store-masthead{position:relative;text-align:center;margin:0 -14px 18px;padding:18px 18px 20px;border-bottom:1px solid #e5d6b7;background:#f5ecd7;background-image:radial-gradient(ellipse at 0% 130%,#e8d4a8 0 30%,transparent 30.4%),radial-gradient(ellipse at 100% 140%,#ede0c1 0 40%,transparent 40.4%)}
.km-store-masthead>a{display:inline-flex;flex-direction:column;align-items:center;gap:3px;color:#302b23;text-decoration:none;max-width:100%}
.km-store-masthead img{display:block;object-fit:contain;mix-blend-mode:multiply;width:64px;height:64px}
.km-store-masthead strong{font-size:28px;line-height:1.5;overflow-wrap:anywhere}
.km-store-masthead small{font-size:13px;color:#7b715d;line-height:1.6}
.km-shop-public .km-shop-head{margin-top:-18px;margin-bottom:0;grid-template-columns:minmax(0,1fr);padding:8px 14px;background:#fffdf9}
.km-shop-public .km-shop-header-actions{grid-column:1;flex-wrap:wrap}
.km-shop-layout-3 .km-shop-contact{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;align-items:stretch}
.km-shop-layout-3 .km-shop-contact .km-button,.km-shop-layout-3 .km-shop-contact .km-shop-whatsapp{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;grid-column:auto;min-width:0;width:100%;min-height:62px;margin:0;padding:8px 3px;font-size:12px;font-weight:500;line-height:1.5;text-align:center;border-radius:10px;background:#fffdf8;color:#806126;border:1px solid #d9c79f;overflow-wrap:anywhere}
.km-shop-layout-3 .km-shop-contact svg{width:20px;height:20px;flex-shrink:0}
.km-shop-owner-nav{width:min(100%,980px)}
@media(max-width:360px){.km-shop-layout-3 .km-shop-contact{gap:5px}.km-shop-layout-3 .km-shop-contact .km-button{font-size:11px;padding-inline:2px}.km-store-masthead strong{font-size:25px}}
@media(min-width:700px){.km-shop-page .km-shop-shell,.km-shop-page .ko-wrap,.km-shop-page .ks-shell{padding-inline:24px}.km-store-masthead{margin-inline:-24px}.km-shop-layout-3 .km-shop-contact{max-width:560px;margin-inline:auto}.km-shop-layout-3 .km-shop-contact .km-button{flex-direction:row;min-height:44px}}
.km-shop-page .km-language-switch,.km-shop-page [data-shop-language] a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:7px 12px;border:1px solid #c5ab72;border-radius:9px;background:#fffdf8;color:#806126;font-size:12px;font-weight:600;line-height:1.5;text-decoration:none;box-shadow:none}
.km-shop-page .km-language-switch:hover,.km-shop-page [data-shop-language] a:hover{background:#f8f0de}
/* Compact horizontal service header for shop interiors and merchant pages. */
.km-shop-page .km-store-masthead{display:flex;align-items:center;justify-content:flex-start;text-align:start;padding:12px 14px;margin-bottom:14px;min-height:82px;background:#faf7ee;background-image:none;border-bottom:1px solid #e8dfd0}
.km-shop-page .km-store-masthead>a{display:grid;grid-template-columns:54px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:10px;row-gap:1px;text-align:start;max-width:100%}
.km-shop-page .km-store-masthead img{grid-column:1;grid-row:1/3;width:54px;height:54px}
.km-shop-page .km-store-masthead strong{grid-column:2;grid-row:1;font-size:23px;line-height:1.5;font-weight:700}
.km-shop-page .km-store-masthead small{grid-column:2;grid-row:2;font-size:12px;line-height:1.6;color:#7b715d}
.km-shop-public .km-shop-head{margin-top:-14px}
@media(min-width:700px){.km-shop-page .km-store-masthead{padding-inline:24px}}
@media(max-width:360px){.km-shop-page .km-store-masthead strong{font-size:21px}.km-shop-page .km-store-masthead small{font-size:11px}}
/* Keep the header above its actions, with the original compact title size. */
.km-shop-page .km-store-masthead strong{font-size:18px;line-height:1.5}
.km-shop-page .km-store-masthead small{font-size:11px}
/* Language switch shares the compact header row. */
.km-shop-page .km-store-masthead{justify-content:space-between;gap:12px}
.km-shop-page .km-store-masthead>a{min-width:0}
.km-shop-page .km-store-language{flex:0 0 auto;align-self:center;line-height:1}
.km-shop-page .km-store-language .km-language-switch{position:static;min-height:38px;padding:7px 10px;font-size:12px}
.km-shop-public .km-store-masthead{margin-bottom:0}
@media(max-width:480px){.km-shop-page .km-store-masthead>a{grid-template-columns:44px minmax(0,1fr);column-gap:7px}.km-shop-page .km-store-masthead img{width:44px;height:44px}.km-shop-page .km-store-masthead{gap:8px}.km-shop-page .km-store-language .km-language-switch{font-size:11px;padding:7px 8px}}
/* Equal contact buttons for the actual number of visible actions. */
.km-shop-layout-3 .km-shop-contact{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px;width:100%;max-width:560px;margin-inline:auto}
.km-shop-layout-3 .km-shop-contact>.km-button{width:100%;min-width:0;min-height:56px;padding:8px 4px;justify-content:center;align-items:center;text-align:center}
@media(min-width:700px){.km-shop-layout-3 .km-shop-contact>.km-button{min-height:46px;flex-direction:row;gap:7px}}
@media(max-width:360px){.km-shop-layout-3 .km-shop-contact{gap:5px}.km-shop-layout-3 .km-shop-contact>.km-button{padding-inline:2px}}
/* Small-screen forms and long merchant content. */
.km-shop-page main,.km-shop-page form,.km-shop-page .km-panel,.km-shop-page .km-shop-identity,.km-shop-page .km-shop-identity-text{min-width:0}
.km-shop-page img{max-width:100%}
.km-shop-page .km-shop-owner-nav a{overflow-wrap:anywhere;text-align:center;min-height:44px}
.km-shop-page .km-shop-toprow,.km-shop-page .km-shop-head{flex-wrap:wrap}
.km-shop-page .km-shop-toprow>h2{min-width:0;overflow-wrap:anywhere}
.km-shop-page .km-shop-context select{min-width:0;max-width:100%}
@media(max-width:480px){.km-shop-page .km-shop-settings-section>.km-shop-grid{grid-template-columns:minmax(0,1fr)}.km-shop-page .km-shop-upload{width:100%;min-width:0}.km-shop-page .km-form input:not([type=checkbox]):not([type=radio]),.km-shop-page .km-form select,.km-shop-page .km-form textarea{font-size:16px}.km-shop-page .km-shop-head h1{font-size:21px}.km-shop-page .km-store-masthead{flex-wrap:nowrap}}