/*
Theme Name: Orvana
Theme URI: https://themesflat.co/fashion-orvana/
Author: Themesflat
Author URI: https://themeforest.net/user/themesflat/portfolio
Description: Orvana is responsive multipurpose WordPress theme – truly a versatile theme perfect for any type of website you want. It provides multiple pre-built demos which can be imported in seconds using One Click Demo Import Plugin. The theme fully integrates with ThemesFlat By Themesflat.com and Elementor Page Builder Plugin that makes theme more user-friendly and easy. Additionally, theme features multiple blog layouts,  multiple header styles, multiple color options etc.
Version: 1.0.0
Tested up to: 5.8
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: orvana
Tags: accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* =============================================================
   Checkout: Validation UI
   ============================================================= */

/* --- Error summary card (page-reload AND AJAX paths) ------ */

/* Container spacing */
.woocommerce-checkout .woocommerce-notices-wrapper,
.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup-checkout {
  margin-bottom: 24px;
}

/* Card shell — applies to both sources */
.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-checkout .woocommerce-NoticeGroup-checkout .woocommerce-error {
  background: #fff5f6;
  border: 1px solid #f5c2c7;
  border-left: 4px solid #dc3545;
  border-radius: 8px;
  padding: 14px 18px 10px;
  margin-bottom: 0;
  list-style: none;
}

/* "Please fix…" heading generated via ::before */
.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-error::before,
.woocommerce-checkout .woocommerce-NoticeGroup-checkout .woocommerce-error::before {
  content: "Please fix the following before continuing:";
  display: block;
  font-family: Poppins, sans-serif;
  font-weight: 600;
  font-size: 0.875rem;
  color: #842029;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #f5c2c7;
}

/* Individual error rows */
.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-error li,
.woocommerce-checkout .woocommerce-NoticeGroup-checkout .woocommerce-error li {
  display: flex;
  align-items: baseline;
  gap: 7px;
  color: #842029;
  font-family: Poppins, sans-serif;
  font-size: 0.875rem;
  line-height: 1.5;
  padding: 2px 0;
}

/* ✕ bullet per error row */
.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-error li::before,
.woocommerce-checkout .woocommerce-NoticeGroup-checkout .woocommerce-error li::before {
  content: "\2715";
  font-size: 0.65rem;
  font-weight: 700;
  color: #dc3545;
  flex-shrink: 0;
  line-height: 1.8;
}

.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-message {
  margin-bottom: 0;
}

/* --- Field wrapper: two-column flex grid ------------------ */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
  display: flex !important;
  flex-wrap: wrap;
  column-gap: 16px;
  row-gap: 20px;
  align-items: flex-start;
}

/* --- Half-width fields (no form-row-wide, no w-100) ------- */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row:not(.form-row-wide):not(.w-100),
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper > .form-row:not(.form-row-wide):not(.w-100) {
  width: calc(50% - 8px);
  flex: 0 0 calc(50% - 8px);
  box-sizing: border-box;
}

/* --- Full-width fields (form-row-wide or w-100) ----------- */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row-wide,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .w-100,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper > .form-row-wide,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper > .w-100 {
  width: 100% !important;
  flex: 0 0 100% !important;
}

/* --- tf-field internal stacking (label → input → error) -- */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .tf-field,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .tf-field {
  display: flex;
  flex-direction: column;
  position: relative;
}

/* --- Select2 container full-width ------------------------- */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .tf-field .select2-container,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .tf-field .select2-container {
  width: 100%;
}

/* --- Invalid field: border + shadow with transition ------- */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-invalid input:not([type=checkbox]),
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-invalid textarea,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-invalid select,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-invalid input:not([type=checkbox]),
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-invalid textarea,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-invalid select,
.woocommerce-checkout .woocommerce-invalid .select2-container--default .select2-selection {
  border-color: #dc3545 !important;
  box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.12) !important;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-invalid input:not([type=checkbox]):focus,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-invalid textarea:focus,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-invalid select:focus,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-invalid input:not([type=checkbox]):focus,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-invalid textarea:focus,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-invalid select:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.28) !important;
}

/* --- Valid field: green confirmation state ---------------- */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-validated input:not([type=checkbox]),
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-validated textarea,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-validated select,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-validated input:not([type=checkbox]),
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-validated textarea,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-validated select,
.woocommerce-checkout .woocommerce-validated .select2-container--default .select2-selection {
  border-color: #198754 !important;
  box-shadow: 0 0 0 3px rgba(25, 135, 84, 0.1) !important;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/* --- Inline error messages (below each field) ------------- */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-error,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-error,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-form-row__description,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-form-row__description {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #dc3545;
  font-family: Poppins, sans-serif;
  font-size: 0.8rem;
  line-height: 1.5;
  margin-top: 5px;
  margin-bottom: 0;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-error::before,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-error::before,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .woocommerce-form-row__description::before,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .woocommerce-form-row__description::before {
  content: "\2715";
  font-size: 0.6rem;
  font-weight: 700;
  flex-shrink: 0;
  line-height: 1.5;
}

/* --- Form row base layout --------------------------------- */
.woocommerce-checkout form.checkout .form-row,
.woocommerce-checkout form.checkout .form-row .form-row,
.woocommerce-checkout form.checkout .form-row .tf-field {
  display: flex;
  flex-direction: column;
}

.woocommerce-checkout form.checkout .form-row .woocommerce-error,
.woocommerce-checkout form.checkout .form-row .woocommerce-form-row__description {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 5px;
  color: #dc3545;
  font-family: Poppins, sans-serif;
  font-size: 0.8rem;
  line-height: 1.5;
  margin-top: 5px;
}

.woocommerce-checkout form.checkout .form-row .woocommerce-error::before,
.woocommerce-checkout form.checkout .form-row .woocommerce-form-row__description::before {
  content: "\2715";
  font-size: 0.6rem;
  font-weight: 700;
  flex-shrink: 0;
  line-height: 1.5;
}

.woocommerce-checkout form.checkout .form-row .woocommerce-error {
  order: 2;
}

.woocommerce-checkout form.checkout .form-row:first-child {
  margin-top: 0;
}

/* --- Responsive: single column on mobile (≤575px) -------- */
@media (max-width: 575px) {
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row:not(.form-row-wide):not(.w-100),
  .woocommerce-checkout .woocommerce-shipping-fields__field-wrapper > .form-row:not(.form-row-wide):not(.w-100),
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_gender_field,
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_dob_field {
    width: 100% !important;
    flex: 0 0 100% !important;
  }
}

/* --- Error notice: links inside li items (clickable jump) - */
.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-error li a,
.woocommerce-checkout .woocommerce-NoticeGroup-checkout .woocommerce-error li a {
  color: #842029;
  text-decoration: none;
  font-weight: inherit;
}

.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-error li a strong,
.woocommerce-checkout .woocommerce-NoticeGroup-checkout .woocommerce-error li a strong {
  font-weight: 600;
  color: #842029;
}

.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-error li a:hover,
.woocommerce-checkout .woocommerce-NoticeGroup-checkout .woocommerce-error li a:hover {
  text-decoration: underline;
  text-decoration-color: rgba(132, 32, 41, 0.5);
}

/* --- Inline field-level error (appended by WooCommerce JS) - */
.woocommerce-checkout form.checkout .checkout-inline-error-message {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #dc3545;
  font-family: Poppins, sans-serif;
  font-size: 0.8rem;
  line-height: 1.5;
  margin-top: 5px;
  margin-bottom: 0;
}

.woocommerce-checkout form.checkout .checkout-inline-error-message::before {
  content: "\2715";
  font-size: 0.6rem;
  font-weight: 700;
  flex-shrink: 0;
  line-height: 1.5;
  color: #dc3545;
}

/* --- Required asterisk ------------------------------------ */
.woocommerce-checkout form.checkout abbr[title="required"],
.woocommerce-checkout form.checkout .required {
  color: #dc3545;
  text-decoration: none;
}

/* --- Custom billing fields: two-column layout ------------ */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_gender_field,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_dob_field {
  width: calc(50% - 8px);
  flex: 0 0 calc(50% - 8px);
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_mobile_field {
  width: 100%;
  flex: 0 0 100%;
}

/* Gender: Select2 container full-width (field lacks tf-field class) */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_gender_field .select2-container {
  width: 100% !important;
}

/* DOB label: keep visible — shop CSS only hides labels inside .tf-field */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_dob_field label {
  display: block;
  font-size: 0.8rem;
  margin-bottom: 4px;
}