/* Shared admin UI repairs for mobile product management and embedded editor */

.product-mobile-list{display:none}

@media (max-width: 760px){
  .product-mobile-card-table .table-wrap{display:none!important}
  .product-mobile-list{display:grid;gap:12px;margin-top:14px}
  .product-mobile-card{display:grid;gap:12px;padding:14px;border:1px solid var(--border);border-radius:18px;background:var(--surface);box-shadow:0 10px 24px rgba(27,18,37,.06)}
  .product-mobile-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
  .product-mobile-card__title{display:grid;gap:4px;min-width:0}
  .product-mobile-card__title strong{font-size:.96rem;line-height:1.7;color:var(--text)}
  .product-mobile-card__title small{color:var(--muted);font-size:.72rem;overflow-wrap:anywhere}
  .product-mobile-card__meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .product-mobile-card__meta>div{display:grid;gap:4px;padding:10px 11px;border:1px solid color-mix(in srgb,var(--primary) 10%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--surface-soft) 72%,var(--surface))}
  .product-mobile-card__meta span{font-size:.68rem;font-weight:800;color:var(--muted)}
  .product-mobile-card__meta b,.product-mobile-card__meta strong{font-size:.78rem;line-height:1.8;color:var(--text)}
  .product-mobile-card__footer{display:grid;gap:10px}
  .product-mobile-card__actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .product-mobile-card__actions .table-action-button{width:100%;min-height:42px;padding-inline:8px;font-size:.74rem}
  .product-mobile-card__source{display:flex;align-items:flex-start;gap:8px;padding:10px 11px;border-radius:14px;background:color-mix(in srgb,var(--info) 7%,var(--surface));font-size:.72rem;line-height:1.85;color:var(--muted)}
  .product-mobile-card__source i{margin-top:3px;color:var(--primary)}
}

@media (max-width: 420px){
  .product-mobile-card__meta{grid-template-columns:1fr}
  .product-mobile-card__actions{grid-template-columns:1fr 1fr}
  .product-mobile-card__actions .table-action-button:first-child{grid-column:1 / -1}
}

.product-editor-dialog{width:min(1180px,calc(100vw - 32px));max-width:1180px;padding:0;border:0;border-radius:24px;overflow:hidden;background:var(--surface);box-shadow:0 24px 72px rgba(16,12,22,.22)}
.product-editor-dialog::backdrop{background:rgba(18,10,26,.54);backdrop-filter:blur(3px)}
.product-editor-frame-shell{background:var(--surface-soft)}
.product-editor-frame-shell iframe{display:block;width:100%;height:min(74vh,980px);background:var(--surface)}

@media (max-width: 760px){
  .product-editor-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
  .product-editor-dialog .dialog-head{position:sticky;top:0;z-index:5;padding:14px 16px}
  .product-editor-dialog .dialog-head h2{font-size:1rem!important}
  .product-editor-frame-shell iframe{height:calc(100dvh - 132px)}
  .product-editor-dialog__footer{position:sticky;bottom:0;z-index:5;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--border)}
}

body.embedded-product-editor{background:transparent!important;overflow:auto}
body.embedded-product-editor .site-header,
body.embedded-product-editor .mobile-menu-overlay,
body.embedded-product-editor .mobile-drawer,
body.embedded-product-editor .mobile-bottom-nav,
body.embedded-product-editor .panel-sidebar-global,
body.embedded-product-editor .blocked-account-banner,
body.embedded-product-editor .commerce-admin-hero{display:none!important}
body.embedded-product-editor .panel-frame{display:block!important;max-width:none!important;margin:0!important;padding:0!important}
body.embedded-product-editor .site-main,
body.embedded-product-editor .panel-site-main,
body.embedded-product-editor .panel-shell,
body.embedded-product-editor .product-editor-shell,
body.embedded-product-editor .panel-main{max-width:none!important;margin:0!important;padding:0!important;background:transparent!important;box-shadow:none!important}
body.embedded-product-editor .section-narrow{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
body.embedded-product-editor .commerce-product-wizard{gap:10px!important;padding:0!important}
body.embedded-product-editor .commerce-wizard-panel{padding:12px!important;border-radius:18px!important}
body.embedded-product-editor .product-editor-actions{position:sticky!important;bottom:0!important;z-index:4;padding:10px 0 calc(10px + env(safe-area-inset-bottom))!important;background:var(--surface)!important}
body.embedded-product-editor .product-editor-actions [data-product-editor-cancel]{display:none!important}

@media (max-width: 760px){
  body.embedded-product-editor .commerce-wizard-panel{padding:10px!important;border-radius:16px!important}
  body.embedded-product-editor .product-kind-grid label>span{min-height:60px!important}
}

/* Modal legibility and product mobile duplication fixes */
@media (max-width:760px){
  .product-desktop-table-wrap{display:none!important}
  dialog.dialog-backdrop .dialog-head,
  dialog.dialog-backdrop .dialog-head--accent,
  .product-editor-dialog .dialog-head,
  .supplier-new-dialog .dialog-head{
    background:linear-gradient(135deg,#321342,#4f1d68)!important;
    color:#fff!important;
    border-bottom:1px solid rgba(255,255,255,.12)!important;
  }
  dialog.dialog-backdrop .dialog-head h1,
  dialog.dialog-backdrop .dialog-head h2,
  dialog.dialog-backdrop .dialog-head h3,
  dialog.dialog-backdrop .dialog-head small,
  dialog.dialog-backdrop .dialog-head span{
    color:#fff!important;
  }
  dialog.dialog-backdrop .dialog-head .icon-button{
    color:#fff!important;
    border-color:rgba(255,255,255,.2)!important;
    background:rgba(255,255,255,.08)!important;
  }
}

body.embedded-product-editor{
  padding-top:0!important;
  margin-top:0!important;
  min-height:100%!important;
}
body.embedded-product-editor .embedded-editor-main{
  min-height:100%!important;
  padding:8px!important;
}
body.embedded-product-editor .product-editor-shell,
body.embedded-product-editor .product-editor-shell>.panel-main{
  width:100%!important;
  min-height:0!important;
}

.supplier-new-dialog{
  width:min(1040px,calc(100vw - 32px));
  max-width:1040px;
  max-height:min(90dvh,940px);
  padding:0;
  border:0;
  border-radius:24px;
  overflow:hidden;
  background:var(--surface);
  box-shadow:0 28px 80px rgba(20,10,28,.24);
}
.supplier-new-dialog::backdrop{
  background:rgba(18,10,26,.5);
  backdrop-filter:blur(3px);
}
.supplier-new-dialog__body{
  max-height:calc(90dvh - 78px);
  overflow:auto;
  padding:18px;
}
.supplier-new-dialog__form{margin-top:0}
.supplier-modal-intro{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin-bottom:14px;
  padding:11px 13px;
  border:1px solid color-mix(in srgb,var(--primary) 14%,var(--border));
  border-radius:14px;
  background:color-mix(in srgb,var(--primary) 5%,var(--surface));
  color:var(--muted);
  font-size:.72rem;
  line-height:1.85;
}
.supplier-modal-intro i{color:var(--primary);margin-top:3px}
.supplier-dialog-actions{
  position:sticky;
  bottom:-18px;
  z-index:6;
  margin:6px -18px -18px;
  padding:12px 18px calc(12px + env(safe-area-inset-bottom));
  border-top:1px solid var(--border);
  background:color-mix(in srgb,var(--surface) 96%,transparent);
  backdrop-filter:blur(10px);
}
@media (max-width:760px){
  .supplier-new-dialog{
    width:100vw;
    max-width:100vw;
    height:100dvh;
    max-height:100dvh;
    border-radius:0;
  }
  .supplier-new-dialog__body{
    max-height:calc(100dvh - 72px);
    padding:12px;
  }
  .supplier-dialog-actions{
    bottom:-12px;
    margin:6px -12px -12px;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom));
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .supplier-dialog-actions .button{width:100%}
  .supplier-new-dialog .supplier-field-section{padding:12px}
}

/* Source importer: only reveal manual CSS selectors when smart detection needs help. */
.product-source-selector-help{
  display:grid;
  gap:11px;
  margin-top:10px;
  padding:13px;
  border:1px solid color-mix(in srgb,#d97706 22%,var(--border));
  border-radius:16px;
  background:color-mix(in srgb,#f59e0b 7%,var(--surface));
}
.product-source-selector-help[hidden]{display:none!important}
.product-source-selector-help__head{display:flex;align-items:flex-start;gap:10px}
.product-source-selector-help__head>i{display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;border-radius:12px;background:color-mix(in srgb,#f59e0b 14%,var(--surface));color:#a15c00}
.product-source-selector-help__head>div{display:grid;gap:3px}
.product-source-selector-help__head strong{font-size:.76rem;color:var(--text)}
.product-source-selector-help__head span,.product-source-selector-help>small{font-size:.65rem;line-height:1.85;color:var(--muted)}
.product-source-selector-help input.is-required-fallback{border-color:#d97706!important;box-shadow:0 0 0 3px color-mix(in srgb,#f59e0b 12%,transparent)!important}

/* Empty table messages must remain a centered empty state on mobile, not a field/value card. */
@media(max-width:760px){
  .payment-mobile-card-table tbody tr:has(td[colspan]){
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:190px!important;
    padding:0!important;
  }
  .payment-mobile-card-table tbody td[colspan]{
    display:block!important;
    width:100%!important;
    padding:0!important;
    border:0!important;
    text-align:center!important;
  }
  .payment-mobile-card-table tbody td[colspan]::before{display:none!important;content:none!important}
  .payment-mobile-card-table tbody td[colspan] .empty-state{
    min-height:190px!important;
    width:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    padding:28px 16px!important;
  }

  /* Mobile accordion bars use distinct soft semantic accents while dialog heads stay dark purple. */
  .mobile-category-group:nth-of-type(4n+1)>summary{box-shadow:inset 4px 0 0 #7c3aed}
  .mobile-category-group:nth-of-type(4n+2)>summary{box-shadow:inset 4px 0 0 #0f9f9a}
  .mobile-category-group:nth-of-type(4n+3)>summary{box-shadow:inset 4px 0 0 #d97706}
  .mobile-category-group:nth-of-type(4n)>summary{box-shadow:inset 4px 0 0 #2563eb}
  html[dir="rtl"] .mobile-category-group:nth-of-type(4n+1)>summary{box-shadow:inset -4px 0 0 #7c3aed}
  html[dir="rtl"] .mobile-category-group:nth-of-type(4n+2)>summary{box-shadow:inset -4px 0 0 #0f9f9a}
  html[dir="rtl"] .mobile-category-group:nth-of-type(4n+3)>summary{box-shadow:inset -4px 0 0 #d97706}
  html[dir="rtl"] .mobile-category-group:nth-of-type(4n)>summary{box-shadow:inset -4px 0 0 #2563eb}

  .supplier-field-section:nth-of-type(4n+1){box-shadow:inset 0 3px 0 #7c3aed,0 8px 24px rgba(17,24,39,.04)!important}
  .supplier-field-section:nth-of-type(4n+2){box-shadow:inset 0 3px 0 #0f9f9a,0 8px 24px rgba(17,24,39,.04)!important}
  .supplier-field-section:nth-of-type(4n+3){box-shadow:inset 0 3px 0 #d97706,0 8px 24px rgba(17,24,39,.04)!important}
  .supplier-field-section:nth-of-type(4n){box-shadow:inset 0 3px 0 #2563eb,0 8px 24px rgba(17,24,39,.04)!important}
}
