/*
Theme Name: Astra Child
Theme URI: https://yourwebsite.com
Description: Astra Child Theme
Author: Your Name
Author URI: https://yourwebsite.com
Template: astra
Version: 1.0.0
Text Domain: astra-child
*/


.custom-search {
  position: relative;
  width: 100%;
  max-width: 561px;
	margin:0 auto;
}

/* Input field */
.custom-search input[type="search"] {
  width: 100%;
  height: 44px;
  padding: 0 48px 0 14px;
  border-radius: 6px;
  border: 1px solid rgba(0,0,0,0.7);
  background-color: #8FBFFA36;
  font-size: 14px;
  color: #1f2937;
  outline: none;
  transition: all 0.25s ease;
}

/* Placeholder */
.custom-search input::placeholder {
  color: #9aa4b2;
}

/* Focus state */
.custom-search input:focus {
  border-color: #2563eb;
  background-color: #ffffff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

/* Search button */
.custom-search .search-icon {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  padding: 0;
  border: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* SVG icon */
.custom-search .search-icon svg {
  width: 18px;
  height: 18px;
}

.custom-search .search-icon svg circle,
.custom-search .search-icon svg line {
  stroke: #374151;
  transition: stroke 0.25s ease;
}

/* Hover effect */
.custom-search .search-icon:hover svg circle,
.custom-search .search-icon:hover svg line {
  stroke: #2563eb;
}

/* Mobile optimization */
@media (max-width: 480px) {
  .custom-search {
    max-width: 100%;
  }

  .custom-search input[type="search"] {
    height: 42px;
    font-size: 13px;
  }
}





.my-custom-cart-class {
    text-align : center !important;
    text-decoration : none !important;
}






















/* -------------------------
   Consolidated: Login / Register / Logout Page CSS
   (extracted & cleaned)
   ------------------------- */

/* Center layout / outer wrapper */
.custom-login-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 50vh;
}

/* Box */
.custom-login-box {
    width: 500px;
    height: 600px;
    padding: 40px;
    background: #fff;
    border-radius: 6px;
    border: 2px solid #ddd;
    margin-bottom: 50px;
}

/* Title (merged duplicates; final visual) */
.custom-title {
    text-align: center;
    margin-bottom: 0px !important;
    font-size: 32px !important;
    font-weight: 500;
}

/* Inputs */
.input-text1 {
    width: 100%;
    padding: 20px !important;
    margin-bottom: 18px !important;
    border: 1px solid #ddd;
}

/* WooCommerce JS override — increases padding on form inputs/textarea when .woocommerce-js is present */
.input-text2 {
    padding: 30px !important;
}

/* Labels inside woo forms */
.woocommerce-js form .form-row label {
    font-size: 16px !important;
}

/* Login actions row (checkbox + lost password) */
.login-actions {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    margin-bottom: 20px;
}

/* More explicit rule for .form-row.login-actions used by WooCommerce (keeps width + spacing) */
.form-row.login-actions {
    display: flex;
    padding-bottom: 20px !important;
    justify-content: space-between;
    width: 100%;
}

/* Force pseudo-elements to occupy zero space (prevents layout shift from WooCommerce floats/pseudo elements) */
.form-row.login-actions::before,
.form-row.login-actions::after {
    content: none !important;
    display: none !important;
}

/* Login / Register button */
.custom-btn {
    width: 100%;
    padding: 20px;
    background: #222;
    color: #fff;
    border: none;
    cursor: pointer;
    font-size: 16px !important;
    margin-bottom: 20px !important;
}
.custom-btn:hover {
    background: #3c3a3a !important;
}

/* Switch link (Login <-> Register) */
.switch-form {
    text-align: center;
    margin-top: 20px;
}
.switch-form a {
    text-decoration: none;
    font-weight: 500;
}

/* Hide register column by default (your PHP uses u-column2 col-2) */
.col-2 {
    display: none;
}

/* Ensure WooCommerce two-column set becomes full-width single column here */
.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {
    float: left;
    width: 100%;
}
.woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 {
    float: right;
    width: 100%;
}

/* Remove default Woocommerce form borders for these forms */
body .woocommerce form.login,
body .woocommerce form.checkout_coupon,
body .woocommerce form.register {
    border: none !important;
}

/* Registration helper / privacy text */
.register-info,
.privacy-info {
    font-size: 16px;
    color: #666;
    margin-bottom: 15px !important;
    line-height: 1.6 !important;
}

/* Lost/reset password layout */
.woocommerce-ResetPassword .lost_reset_password {
    width: 50% !important;
}

/* Ensure form-row-first rows are stacked and centered inside the form */
.woocommerce form .form-row-first,
.woocommerce-page form .form-row-first {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    width: 100%;
}

/* -------------------------
   Responsive: mobile / small screens
   (merged duplicates; uses full-width inputs & form rows)
   ------------------------- */
@media (max-width: 768px) {

    /* Make login form use full width */
    .woocommerce-form.woocommerce-form-login.login {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Compact row spacing on small screens and make rows full width */
    .woocommerce-js form .form-row {
        padding: 3px !important;
        margin: 0 0 6px !important;
        width: 100% !important;   /* merged: prefer full width on mobile */
    }

    /* Stack login-actions into a column on mobile */
    .form-row.login-actions {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 8px;
        width: 100%;
    }
}

/* -------------------------
   End consolidated login / register CSS
   ------------------------- */



.woocommerce form .form-row-first,
 .woocommerce form .form-row-last,
  .woocommerce-page form .form-row-first, 
  .woocommerce-page form .form-row-last {
    width: 100%;
    overflow: visible;
}