/* YuanOwn Cloud shared mobile compatibility layer. Desktop rules remain unchanged. */
@media screen and (max-width: 768px) {
  html, body { width: 100%; min-width: 0 !important; overflow-x: hidden; }
  body { box-sizing: border-box; }
  *, *::before, *::after { box-sizing: border-box; }

  /* Purchase navigation */
  .yzy-buy-nav { width: 100% !important; min-height: 56px; height: auto !important; padding: 10px 14px !important; gap: 8px; flex-wrap: wrap; }
  .yzy-buy-brand { min-width: 0; max-width: calc(100% - 108px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .yzy-buy-brand img { max-width: 30px; height: auto; }
  .yzy-buy-links { min-width: 0; margin-left: auto; gap: 8px !important; flex-wrap: wrap; justify-content: flex-end; }
  .yzy-buy-links a, .yzy-buy-auth a { white-space: nowrap; font-size: 12px; }
  .yzy-buy-product-search { order: 3; flex: 1 1 100%; width: 100% !important; min-width: 0; margin: 0 !important; }
  .yzy-buy-product-search input { width: 100% !important; min-width: 0; }

  /* Product configuration */
  .goods, .goods > .el-container, .goods .el-container, .goods .el-main,
  .config-box, .config-box .content { width: 100% !important; min-width: 0 !important; max-width: 100% !important; }
  .goods .el-main { padding: 12px !important; }
  .config-box { padding: 0 12px !important; overflow: visible !important; }
  .config-box .content { overflow: visible !important; }
  .goods .el-form-item, .goods .el-form-item__content,
  .goods .el-input, .goods .el-select, .goods .el-input-number { max-width: 100% !important; }
  .goods .el-input__inner, .goods select, .goods textarea { max-width: 100%; }

  /* Cart and settlement shell */
  .template, .template > .el-container, .template > .el-container > .el-container,
  .template .el-main, .main-card, .goods-box, .goods-item { width: 100% !important; min-width: 0 !important; max-width: 100% !important; }
  .template > .el-container { display: block !important; }
  .template aside-menu, .template .aside-menu, .template .el-aside { display: none !important; width: 0 !important; }
  .template .el-main { padding: 12px !important; overflow: visible !important; }
  .main-card { margin: 0 !important; padding: 14px !important; overflow: visible !important; }
  .main-title { font-size: 20px !important; line-height: 1.35; }
  .search-box { width: 100% !important; margin: 10px 0 !important; }
  .search-box .el-input, .search-box input { width: 100% !important; max-width: 100% !important; }
  .shopping-goods { width: 100% !important; min-width: 0 !important; max-width: 100% !important; overflow: hidden; }
  .table-name, .table-content { max-width: 100% !important; }
  .table-name { min-height: 42px; line-height: 1.5; }
  .goods-name { overflow-wrap: anywhere; word-break: break-word; }
  .table-content { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .goods-table { min-width: 620px; }
  .goods-table th, .goods-table td { white-space: normal; }

  /* Form rows and action areas */
  .el-row { margin-left: 0 !important; margin-right: 0 !important; }
  .el-col { width: 100% !important; max-width: 100% !important; }
  .el-form-item__label { float: none !important; display: block; width: 100% !important; text-align: left !important; padding: 0 0 5px !important; }
  .el-form-item__content { margin-left: 0 !important; width: 100% !important; }
  .el-button { max-width: 100%; }
  .el-dialog { width: calc(100vw - 24px) !important; max-width: calc(100vw - 24px) !important; margin: 12px auto !important; }
  .el-dialog__body { max-height: 70vh; overflow-y: auto; }
  .el-message-box { width: calc(100vw - 32px) !important; max-width: calc(100vw - 32px) !important; }

  /* Fixed action bars must fit the viewport */
  .buy-footer, .goods-footer, .settlement-footer, .shopping-footer,
  .yzy-buy-footer { width: 100% !important; max-width: 100vw !important; padding: 10px 12px !important; }
  .buy-footer .el-button, .goods-footer .el-button, .settlement-footer .el-button,
  .shopping-footer .el-button, .yzy-buy-footer .el-button { min-width: 0; }
}


/* Narrow-screen layout for the PC purchase template. Desktop rules are unchanged. */
@media screen and (max-width: 768px) {
  .yzy-ogmiao-header { height: auto; min-height: 58px; }
  .yzy-ogmiao-header-inner { min-height: 58px; height: auto; padding: 10px 12px; gap: 8px; flex-wrap: wrap; }
  .yzy-ogmiao-brand { flex: 0 1 auto; max-width: 42%; overflow: hidden; text-overflow: ellipsis; font-size: 16px; }
  .yzy-ogmiao-primary-nav { order: 3; flex: 1 1 100%; width: 100%; justify-content: space-between; gap: 6px; overflow-x: auto; white-space: nowrap; }
  .yzy-ogmiao-primary-nav a { flex: 0 0 auto; font-size: 12px; }
  .yzy-ogmiao-header-search { flex: 1 1 auto; width: auto; min-width: 96px; max-width: none; margin-left: auto; }
  .yzy-auth-links { flex: 0 0 auto; max-width: 28%; overflow: hidden; white-space: nowrap; }
  .yzy-auth-links a { font-size: 12px; }

  .yzy-ogmiao-main { width: 100%; max-width: 100%; padding: 0 12px 24px; }
  .yzy-mobile-product-bar { width: 100%; max-width: 100%; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
  .yzy-product-section { width: 100%; max-width: 100%; margin: 10px 0 0; }
  .yzy-product-heading { font-size: 20px; line-height: 1.35; }
  .yzy-series-search, .yzy-product-search { width: 100%; max-width: 100%; }
  .yzy-series-search input, .yzy-product-search input { width: 100%; min-width: 0; }

  .yzy-products-container, .yzy-desktop-products { display: flex; flex-direction: column; width: 100%; max-width: 100%; gap: 12px; padding: 0; }
  .yzy-product-item, .yzy-product-card { width: 100%; max-width: 100%; min-width: 0; margin: 0; }
  .yzy-product-card-body { min-width: 0; padding: 16px; }
  .yzy-product-card-title { min-width: 0; overflow-wrap: anywhere; word-break: break-word; line-height: 1.35; }
  .yzy-product-description, .yzy-product-display-specs, .yzy-product-specs { min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
  .yzy-product-price { white-space: nowrap; }
  .yzy-buy-button { min-height: 44px; min-width: 104px; padding: 10px 14px; }

  .yzy-product-picker { width: calc(100vw - 24px); max-width: calc(100vw - 24px); max-height: 80vh; overflow: hidden; }
  .yzy-product-picker-body { max-height: calc(80vh - 48px); overflow-y: auto; }
  .yzy-product-picker-categories, .yzy-product-picker-groups { min-width: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .yzy-picker-group-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
}

@media screen and (max-width: 768px) {
  .yzy-buy-button { min-height: 44px !important; height: 44px !important; }
}