/*
Theme Name: Aquatre
Theme URI: https://host2media.com
Author: Nadim Younes | Host2Media 
Author URI: https://host2media.com
Description: Aquatre is a custom theme designed for AQUATRE S.A.R.L
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.1
Text Domain: aquatre
*/
*/
/* === Scholars Book: Cart UI polish === */
/* Cart: force product title to one line */
.woocommerce-cart .product-name a{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  max-width: 100%;
}

/* Cart: lamination subtle inline style */
.aq-lamination-inline{
  font-weight: 400;
  color: #666;
}


/* Search dropdown: keep PRODUCT rows top-aligned (title + price line),
   but make CATEGORY rows visually balanced without forcing vertical centering. */
.aq-search-item.category{
  display:flex;
  align-items:flex-start;
  padding-top:12px;
  padding-bottom:12px;
}

.aq-search-item.category .aq-search-thumb{
  margin-top:2px;
}

.aq-search-item.category .aq-search-title{
  margin-top:6px; /* nudges down so it sits closer to product title baseline */
  line-height:1.35;
}

/* Ensure we do NOT affect product items layout */
.aq-search-item.product{
  align-items:flex-start;
}


/* =========================
   Aquatre Custom Registration (/register)
   ========================= */
.aq-register-page{
  max-width: 980px;
  margin: 0 auto;
  padding: 28px 16px 50px;
}
.aq-register-card{
  background:#fff;
  border:1px solid rgba(0,0,0,.12);
  border-radius:14px;
  padding:22px 18px;
  box-shadow:0 8px 22px rgba(0,0,0,.06);
}
.aq-register-form .aq-form-row{ margin: 14px 0; }
.aq-register-form .aq-2col{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
@media (max-width: 720px){
  .aq-register-form .aq-2col{ grid-template-columns: 1fr; }
}
.aq-register-form label{
  display:block;
  font-weight:700;
  margin-bottom:6px;
}
.aq-register-form input[type="text"],
.aq-register-form input[type="email"],
.aq-register-form input[type="password"],
.aq-register-form input[type="tel"],
.aq-register-form select{
  width:100%;
  border:1px solid rgba(0,0,0,.18);
  border-radius:10px;
  padding:12px 12px;
  font-size:16px;
  background:#fff;
}

.aq-register-form select{
  appearance:auto;
}
.aq-field-error{
  display:block;
  margin-top:6px;
  color:#b00020;
  font-weight:600;
}
.aq-form-alert{
  border-radius:12px;
  padding:12px 14px;
  margin: 12px 0;
  font-weight:700;
}
.aq-form-alert--error{
  border:1px solid rgba(176,0,32,.35);
  background: rgba(176,0,32,.06);
  color:#b00020;
}
.aq-form-alert--success{
  border:1px solid rgba(0,140,80,.35);
  background: rgba(0,140,80,.06);
  color:#0a6b41;
}
.aq-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.aq-pass-meter{
  position:relative;
  display:block;
  margin-top:10px;
}
.aq-pass-meter::before{
  content:'';
  display:block;
  /* make the bar long but never overflow the card */
  width:100%;
  max-width: 520px;
  height:10px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.12);
  background:#f3f3f3;
}
.aq-pass-bar{
  position:absolute;
  left:1px;
  top:2px;
  height:8px;
  width:0%;
  border-radius:999px;
  background:#b00020; /* default = weak (red) */
  pointer-events:none;
}
.aq-pass-label{
  display:block;
  margin-top:6px;
  font-size:13px;
  opacity:.85;
  line-height:1.2;
  white-space:normal;
  word-break:break-word;
}

/* Strength colors */
.aq-pass-meter--weak .aq-pass-bar{ background:#b00020; }
.aq-pass-meter--fair .aq-pass-bar{ background:#f0b400; }
.aq-pass-meter--strong .aq-pass-bar{ background:#0a8c50; }

/* My Account: password visibility toggle removed (we keep login clean) */
.aq-register-alt{
  text-align:center;
  margin-top: 16px;
  font-weight:700;
}

/* Register button: match Aquatre checkout button look */
.aq-register-page .aq-register-form .aq-account-actions{
  display:block;
}

.aq-register-page .aq-register-form .aq-btn-primary{
  background:#acadb1 !important;
  color:#fff !important;
  border:none !important;
  border-radius:4px !important;
  width:100% !important;
  height:56px;
  padding:0 18px !important;
  font-size:16px;
  font-weight:800 !important;
  letter-spacing:.6px;
  text-transform:uppercase;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.aq-register-page .aq-register-form .aq-btn-primary:hover{
  filter:brightness(.95);
}

/* ============================
   Aquatre: My Account polish
   ============================ */

/* 1) Remove My Account page title */
.woocommerce-account .entry-title,
.woocommerce-account h1.page-title{
  display:none !important;
}

/* 2) Aquatre buttons on My Account (Woo only)
   Scope to .woocommerce so we don't style header buttons like .menu-toggle */
.woocommerce-account .woocommerce button,
.woocommerce-account .woocommerce .button,
.woocommerce-account .woocommerce a.button{
  background:#acadb1 !important;
  color:#fff !important;
  border:none !important;
  border-radius:4px !important;
  height:56px;
  padding:0 18px !important;
  font-size:15px;
  font-weight:800 !important;
  letter-spacing:.6px;
  text-transform:uppercase;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:filter .15s ease, opacity .15s ease;
}

.woocommerce-account .woocommerce button:hover,
.woocommerce-account .woocommerce .button:hover,
.woocommerce-account .woocommerce a.button:hover{
  filter:brightness(.95);
}

/* Safety: ensure header burger button never inherits Woo button styling */
.woocommerce-account .menu-toggle{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
}

/* Wider call-to-action button in side card */
.woocommerce-account .aq-btn-wide{
  width:100%;
}

/* 3) Remove show/hide password icons on My Account login */
.woocommerce-account .show-password-input,
.woocommerce-account .password-input button,
.woocommerce-account .password-input .wp-hide-pw{
  display:none !important;
}


/* Remove My Account title (safety fallback) */
.woocommerce-account .entry-title,
.woocommerce-account h1.page-title,
.woocommerce-account h1.h { display: none !important; }







/* Aquatre: Checkout login card styling */
.woocommerce-form.woocommerce-form-login,
.woocommerce form.login {
  background: #ffffff;
  border: 1px solid rgba(17, 24, 39, 0.10);
  border-radius: 5px;
  padding: 18px 18px 16px;
  box-shadow: 0 10px 30px rgba(17, 24, 39, 0.06);
  max-width: 100%;
}

/* Labels */
.woocommerce-form-login label,
.woocommerce form.login label {
  font-size: 13px;
  font-weight: 600;
  color: rgba(17, 24, 39, 0.78);
  margin-bottom: 6px;
}

/* Inputs */
.woocommerce-form-login input[type="text"],
.woocommerce-form-login input[type="password"],
.woocommerce form.login input[type="text"],
.woocommerce form.login input[type="password"]{
  height: 44px;
  border-radius: 5px;
  border: 1px solid rgba(17, 24, 39, 0.12);
  background: rgba(249, 250, 251, 0.8);
  padding: 10px 12px;
  font-size: 14px;
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.woocommerce-form-login input:focus,
.woocommerce form.login input:focus{
  background: #fff;
  border-color: rgba(0, 153, 255, 0.35);
  box-shadow: 0 0 0 4px rgba(0, 153, 255, 0.10);
}

/* Two columns spacing */
.woocommerce-form-login .form-row,
.woocommerce form.login .form-row {
  margin: 0 0 14px;
}
.woocommerce-form-login .form-row-first,
.woocommerce-form-login .form-row-last {
  width: 48%;
}
@media (max-width: 768px){
  .woocommerce-form-login .form-row-first,
  .woocommerce-form-login .form-row-last {
    width: 100%;
  }
}

/* Login button */
.woocommerce-form-login button[type="submit"],
.woocommerce form.login button[type="submit"]{
  width: 160px;
  height: 44px;
  border-radius: 5px;
  background: #acadb1;
  border: 0;
  color: #fff;
  font-weight: 700;
  letter-spacing: .4px;
  transition: transform .08s ease, filter .2s ease, opacity .2s ease;
}
.woocommerce-form-login button[type="submit"]:hover,
.woocommerce form.login button[type="submit"]:hover{
  filter: brightness(1.03);
}
.woocommerce-form-login button[type="submit"]:active,
.woocommerce form.login button[type="submit"]:active{
  transform: translateY(1px);
}

/* Remember me + actions row */
.woocommerce-form-login .form-row .woocommerce-form__label-for-checkbox{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 0 12px;
  font-size: 13px;
  color: rgba(17, 24, 39, 0.72);
}
.woocommerce-form-login .form-row:last-child{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
@media (max-width: 768px){
  .woocommerce-form-login button[type="submit"]{
    width: 100%;
  }
  .woocommerce-form-login .form-row:last-child{
    gap: 12px;
  }
  .woocommerce-form-login .form-row .woocommerce-form__label-for-checkbox{
    margin-left: 0;
  }
}

/* Lost password link */
.woocommerce-form-login .lost_password,
.woocommerce form.login .lost_password{
  margin-top: 6px;
}
.woocommerce-form-login .lost_password a,
.woocommerce form.login .lost_password a{
  font-size: 13px;
  color: rgba(0, 119, 204, 0.95);
  text-decoration: none;
}
.woocommerce-form-login .lost_password a:hover,
.woocommerce form.login .lost_password a:hover{
  text-decoration: underline;
}

/* Optional: stronger separation from page background */
.aquatre-checkout-login-wrap{
  margin: 10px 0 16px;
}


/* =====================================================
   Aquatre - Checkout Billing Details UI Upgrade
   ===================================================== */

/* =====================================================
   Aquatre - Hero Slider Clickable Slides
   ===================================================== */
.hero-slide-link{
  display:block;
  width:100%;
  height:100%;
  cursor:pointer;
}
.hero-slide-link:focus-visible{
  outline: 3px solid rgba(0,153,255,.35);
  outline-offset: 3px;
  border-radius: 14px;
}

/* Wrap the Billing Details section like a card */
.woocommerce-checkout .woocommerce-billing-fields {
  background: #ffffff;
  border: 1px solid rgba(17, 24, 39, 0.10);
  border-radius: 5px;
  padding: 18px 18px 16px;
  box-shadow: 0 10px 30px rgba(17, 24, 39, 0.06);
}

/* Title styling */
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper + h3 {
  font-size: 18px;
  font-weight: 800;
  color: rgba(17, 24, 39, 0.92);
  margin: 0 0 14px;
}

/* Labels */
.woocommerce-checkout .woocommerce-billing-fields label {
  font-size: 13px;
  font-weight: 600;
  color: rgba(17, 24, 39, 0.78);
  margin-bottom: 6px;
}

/* Inputs / selects / textarea */
.woocommerce-checkout .woocommerce-billing-fields input[type="text"],
.woocommerce-checkout .woocommerce-billing-fields input[type="email"],
.woocommerce-checkout .woocommerce-billing-fields input[type="tel"],
.woocommerce-checkout .woocommerce-billing-fields input[type="password"],
.woocommerce-checkout .woocommerce-billing-fields select,
.woocommerce-checkout .woocommerce-billing-fields textarea {
  height: 44px;
  border-radius: 5px;
  border: 1px solid rgba(17, 24, 39, 0.12);
  background: rgba(249, 250, 251, 0.8);
  padding: 10px 12px;
  font-size: 14px;
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

/* Textarea sizing */
.woocommerce-checkout .woocommerce-billing-fields textarea {
  height: auto;
  min-height: 110px;
  resize: vertical;
}

/* Focus state */
.woocommerce-checkout .woocommerce-billing-fields input:focus,
.woocommerce-checkout .woocommerce-billing-fields select:focus,
.woocommerce-checkout .woocommerce-billing-fields textarea:focus {
  background: #fff;
  border-color: rgba(0, 153, 255, 0.35);
  box-shadow: 0 0 0 4px rgba(0, 153, 255, 0.10);
}

/* Field spacing */
.woocommerce-checkout .woocommerce-billing-fields .form-row {
  margin: 0 0 14px;
}

/* Make required star calmer (less aggressive red) */
.woocommerce-checkout .woocommerce-billing-fields .required {
  color: rgba(220, 38, 38, 0.85);
}

/* Optional: unify select arrow look */
.woocommerce-checkout .woocommerce-billing-fields select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(17,24,39,.55) 50%),
    linear-gradient(135deg, rgba(17,24,39,.55) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 3px),
    calc(100% - 12px) calc(50% - 3px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 36px;
}