/**
 * Breadcrumbs, navigation, notices and shared responsive rules.
 *
 * Part of the WooCommerce stylesheet set - enqueued in order by
 * sync_rc_woocommerce_styles() in inc/shop/shop-setup.php. Order matters.
 */

/* ============================================
   BREADCRUMBS & NAVIGATION
   ============================================ */

.woocommerce-breadcrumb {
  font-size: var(--text-sm);
  color: var(--color-gray-600);
  margin-bottom: var(--space-6);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--border-color);
}

.woocommerce-breadcrumb a {
  color: var(--color-primary);
  text-decoration: none;
  transition: color var(--transition-fast);
}

.woocommerce-breadcrumb a:hover {
  text-decoration: underline;
}

/* Toolbar - Result count + Ordering */
.woocommerce-notices-wrapper + .container > p:first-of-type,
.woocommerce-result-count {
  font-size: var(--text-sm);
  color: var(--color-gray-600);
  font-weight: var(--font-medium);
}

.woocommerce-ordering {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.woocommerce-ordering .orderby {
  min-width: 200px;
  padding: var(--space-3) var(--space-4);
  padding-right: var(--space-10);
  border: 1px solid var(--border-color);
  border-radius: var(--border-radius-md);
  font-size: var(--text-sm);
  font-family: var(--font-primary);
  color: var(--color-secondary);
  background: var(--bg-primary);
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12"%3E%3Cpath fill="%230099cc" d="M6 9L1 4h10z"/%3E%3C/svg%3E');
  background-repeat: no-repeat;
  background-position: right var(--space-3) center;
  background-size: 12px;
  cursor: pointer;
  transition: all var(--transition-fast);
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.woocommerce-ordering .orderby:hover {
  border-color: var(--color-primary);
  background-color: var(--bg-secondary);
}

.woocommerce-ordering .orderby:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(0, 153, 204, 0.1);
}

/* Toolbar layout - appears above products */
.shop-main-content > .woocommerce-notices-wrapper + p.woocommerce-result-count,
.shop-main-content > .woocommerce-result-count {
  margin-bottom: var(--space-6);
}

@media (max-width: 640px) {
  .woocommerce-ordering {
    width: 100%;
  }

  .woocommerce-ordering .orderby {
    width: 100%;
    min-width: 0;
  }
}

/* ============================================
   MESSAGES & NOTICES
   ============================================ */

/* Toast notifications - floating */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  position: fixed !important;
  top: var(--space-6);
  right: var(--space-6);
  z-index: var(--z-tooltip);
  max-width: 380px;
  width: auto;
  padding: var(--space-4) var(--space-5) !important;
  margin: 0 !important;
  border-radius: var(--border-radius-md) !important;
  border: none !important;
  border-left: 4px solid !important;
  box-shadow: var(--shadow-xl);
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  display: flex;
  align-items: center;
  gap: var(--space-3);
  cursor: pointer;
  animation: toast-slide-in 0.3s ease-out;
}

/* Kill WooCommerce default ::before icon */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
  display: none !important;
  content: none !important;
}

.woocommerce-message.toast-hiding,
.woocommerce-info.toast-hiding,
.woocommerce-error.toast-hiding {
  animation: toast-slide-out 0.3s ease-in forwards;
}

@keyframes toast-slide-in {
  from { opacity: 0; transform: translateX(40px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes toast-slide-out {
  from { opacity: 1; transform: translateX(0); }
  to { opacity: 0; transform: translateX(40px); }
}

.woocommerce-message {
  background: var(--color-white);
  border-left-color: var(--color-success) !important;
  color: var(--color-secondary);
}

.woocommerce-info {
  background: var(--color-white);
  border-left-color: var(--color-info) !important;
  color: var(--color-secondary);
}

.woocommerce-error {
  background: var(--color-white);
  border-left-color: var(--color-danger) !important;
  color: var(--color-secondary);
}

/* "View cart" link as subtle text link */
.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
  display: inline;
  margin: 0;
  padding: 0;
  background: none !important;
  border: none;
  color: var(--color-primary);
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
  cursor: pointer;
  transition: color var(--transition-fast);
}

.woocommerce-message .button:hover,
.woocommerce-info .button:hover,
.woocommerce-error .button:hover {
  color: var(--color-primary-dark);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* Reviews Section */
.woocommerce-tabs #reviews .woocommerce-noreviews {
  padding: var(--space-8);
  text-align: center;
  color: var(--color-gray-500);
  font-style: italic;
  background: var(--bg-secondary);
  border-radius: var(--border-radius-md);
  margin: var(--space-6) 0;
}

.woocommerce-tabs #review_form_wrapper {
  margin-top: var(--space-8);
}

.woocommerce-tabs #review_form .comment-reply-title {
  font-family: var(--font-heading);
  font-size: var(--text-xl);
  font-weight: var(--font-bold);
  color: var(--color-secondary);
  margin: 0 0 var(--space-6) 0;
}

.woocommerce-tabs #review_form .comment-form-rating {
  margin-bottom: var(--space-6);
}

.woocommerce-tabs #review_form .comment-form-rating label {
  display: block;
  font-weight: var(--font-semibold);
  color: var(--color-secondary);
  margin-bottom: var(--space-3);
}

.woocommerce-tabs #review_form .stars {
  display: flex;
  gap: var(--space-1);
}

.woocommerce-tabs #review_form .stars a {
  color: var(--color-gray-300);
  font-size: var(--text-2xl);
  transition: all var(--transition-fast);
  text-decoration: none;
}

.woocommerce-tabs #review_form .stars a:hover,
.woocommerce-tabs #review_form .stars a.active {
  color: #FFB800;
  transform: scale(1.1);
}

.woocommerce-tabs #review_form .comment-form label {
  display: block;
  font-weight: var(--font-semibold);
  color: var(--color-secondary);
  margin-bottom: var(--space-2);
}

.woocommerce-tabs #review_form .comment-form input[type="text"],
.woocommerce-tabs #review_form .comment-form input[type="email"],
.woocommerce-tabs #review_form .comment-form textarea {
  width: 100%;
  padding: var(--space-3);
  border: 2px solid var(--border-color);
  border-radius: var(--border-radius-md);
  font-family: var(--font-primary);
  font-size: var(--text-base);
  color: var(--color-secondary);
  background: var(--bg-primary);
  transition: all var(--transition-fast);
}

.woocommerce-tabs #review_form .comment-form input:focus,
.woocommerce-tabs #review_form .comment-form textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(0, 153, 204, 0.1);
}

.woocommerce-tabs #review_form .form-submit .submit {
  background: var(--gradient-primary);
  color: var(--color-white);
  border: none;
  padding: var(--space-4) var(--space-8);
  border-radius: var(--border-radius-md);
  font-family: var(--font-heading);
  font-size: var(--text-base);
  font-weight: var(--font-bold);
  cursor: pointer;
  transition: all var(--transition-base);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.woocommerce-tabs #review_form .form-submit .submit:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-xl);
}

/* Tablet adjustments */
@media (max-width: 1024px) {
  .single-product div.product .woocommerce-product-gallery {
    flex: 0 0 400px;
    max-width: 400px;
  }
}

@media (max-width: 768px) {
  .single-product div.product {
    flex-direction: column;
    gap: var(--space-8);
  }

  .single-product div.product .woocommerce-product-gallery {
    flex: 1 1 auto;
    max-width: 100%;
    position: relative;
    top: 0;
  }

  .single-product div.product .woocommerce-product-gallery img {
    min-height: 300px;
    padding: var(--space-4);
  }

  .single-product div.product .product_title {
    font-size: var(--text-2xl);
  }

  .single-product div.product p.price {
    font-size: var(--text-3xl);
  }

  .single-product div.product form.cart {
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-3);
  }

  .single-product div.product form.cart .quantity {
    width: 100%;
  }

  .single-product div.product form.cart input[type="number"] {
    width: 100%;
  }

  .woocommerce-tabs ul.tabs {
    flex-direction: column;
  }

  .woocommerce-tabs ul.tabs li a {
    justify-content: flex-start;
    padding: var(--space-4);
  }

  .woocommerce-tabs .panel {
    padding: var(--space-6);
  }

  .woocommerce-cart .cart-collaterals {
    grid-template-columns: 1fr;
  }

  .woocommerce ul.products {
    grid-template-columns: 1fr;
  }
}

