/* =========================================================
   PhonesDukan UI Controls Theme
   Applies premium brand styling to frontend select controls.
   ========================================================= */

:root {
  --pd-select-bg: #ffffff;
  --pd-select-text: #111111;
  --pd-select-border: #d9d9d9;
  --pd-select-focus: #f7d117;
  --pd-select-shadow: 0 0 0 2px rgba(247, 209, 23, 0.22);
  --pd-select-radius: 10px;
  --pd-select-height: 42px;
}

select,
.pd-themed-select,
.shop-sort-select,
.shop-top-sort-select,
.shop-mobile-sort-select {
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--pd-select-bg);
  color: var(--pd-select-text);
  border: 1px solid var(--pd-select-border);
  border-radius: var(--pd-select-radius);
  min-height: var(--pd-select-height);
  line-height: 1.2;
  font-family: "Inter", Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  padding: 10px 40px 10px 12px;
  box-sizing: border-box;
  outline: none;
  background-image: linear-gradient(45deg, transparent 50%, #111111 50%),
                    linear-gradient(135deg, #111111 50%, transparent 50%);
  background-position: calc(100% - 18px) calc(50% - 2px),
                       calc(100% - 12px) calc(50% - 2px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

select:hover,
.pd-themed-select:hover,
.shop-sort-select:hover,
.shop-top-sort-select:hover,
.shop-mobile-sort-select:hover {
  border-color: #c7c7c7;
  background-color: #fffef8;
}

select:focus,
select:focus-visible,
.pd-themed-select:focus,
.pd-themed-select:focus-visible,
.shop-sort-select:focus,
.shop-sort-select:focus-visible,
.shop-top-sort-select:focus,
.shop-top-sort-select:focus-visible,
.shop-mobile-sort-select:focus,
.shop-mobile-sort-select:focus-visible {
  border-color: var(--pd-select-focus);
  box-shadow: var(--pd-select-shadow);
  outline: none;
}

select:disabled,
.pd-themed-select:disabled,
.shop-sort-select:disabled,
.shop-top-sort-select:disabled,
.shop-mobile-sort-select:disabled {
  opacity: 0.72;
  cursor: not-allowed;
}

/* PhonesDukan Global Buttons (visual only — sizing normalized below) */
.buy-button {
  background: #f7cf04;
  color: #111111 !important;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.buy-button:hover,
.buy-button:focus {
  background: #e6bd00;
  color: #111111 !important;
  transform: translateY(-1px);
  text-decoration: none !important;
}

.buy-button.disabled {
  background: #f3f4f6;
  color: #9ca3af !important;
  border: 1px solid #e5e7eb;
  cursor: not-allowed;
  pointer-events: none;
}

.secondary-cta {
  background: transparent !important;
  color: #111111 !important;
  border: 1.5px solid #111111;
  border-radius: 8px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.secondary-cta:hover,
.secondary-cta:focus,
.secondary-cta:active {
    background: #111111 !important;
    color: #ffffff !important;
    border-color: #111111 !important;
    text-decoration: none !important;
}

/* Global reset for links in product-related contexts */
.best-mobiles-page a,
.product-item a,
.product-card a {
    text-decoration: none !important;
}

.best-mobiles-page a:hover,
.product-item a:hover,
.product-card a:hover {
    text-decoration: none !important;
}

/* Universal button normalization: ensure Add to Cart and Buy Now match site-wide */
.na-actions {
  display: flex;
  flex-direction: row;
  gap: 6px;
  width: 100%;
}
.na-actions .na-btn,
.na-actions .na-btn--cart,
.na-actions .na-btn--buy,
.na-actions .secondary-cta,
.na-actions .buy-button {
  height: 34px;
  min-height: 34px;
  padding: 0 6px;
  font-size: 10px;
  line-height: 1;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 8px;
  box-sizing: border-box;
}


@media (max-width: 480px) {
  .na-actions .na-btn,
  .na-actions .na-btn--cart,
  .na-actions .na-btn--buy,
  .na-actions .secondary-cta,
  .na-actions .buy-button {
    height: 30px;
    min-height: 30px;
    padding: 0 4px;
    font-size: 10px;
  }
}

.na-actions .na-btn--buy,
.na-actions .buy-button {
  background: #ffffff !important;
  color: #111111 !important;
  border: 1.5px solid #d0d0d0 !important;
}

.na-actions .na-btn--buy:hover,
.na-actions .na-btn--buy:focus,
.na-actions .na-btn--buy:active,
.na-actions .buy-button:hover,
.na-actions .buy-button:focus,
.na-actions .buy-button:active {
  background: #ffffff !important;
  color: #000000 !important;
  border-color: #f7cf04 !important;
}