/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

/* Order summary trip title */
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .tm-trip-title{
  font-size: var(--text-xl);
  font-weight: 800;
  line-height: 1.3;
  margin: 12px 0 12px;
}

/* Space between title and details */
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .tm-trip-line{
  margin: 6px 0;
  line-height: 1.4;
}

/* Add extra breathing room above the whole block */
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name{
  padding-top: 14px;
}

/* Card button backround clear*/

.trip-card-cta,
.trip-card-cta:hover,
.trip-card-cta:focus,
.trip-card-cta:active {
  background: transparent !important;
  background-color: transparent !important;
}

/* =========================================================
   Trip filters – active state
   Used for category filtering via ?cat=
   Do not remove unless filter logic changes
   ========================================================= */

.chip.is-active{
  background: var(--color-primary-100) !important;
  border: 1px solid var(--color-primary-700) !important;
  color: var(--color-primary-700) !important;
}


/* Checkout select width safety */
.woocommerce-checkout select,
.woocommerce-checkout .select2-container,
.woocommerce-checkout .select2-container * {
  max-width: 100%;
  box-sizing: border-box;
}

.woocommerce-checkout .form-row {
  max-width: 100%;
}

.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout form.checkout {
  overflow-x: hidden;
}


/* Truncate long selected value */
.woocommerce-checkout select {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.page-id-2616 .woocommerce-MyAccount-navigation,
body.page-id-2616 .woocommerce-MyAccount-content {
  display: none;
}

body.page-id-2616 .woocommerce {
  margin: 0;
}


body.page-id-2616 .woocommerce form.login {
  margin: 0;
  padding: 0;
  border: 0;
}

body.page-id-2616 .woocommerce form.login p {
  margin: 0 0 12px 0;
}

body.page-id-2616 .woocommerce form.login label {
  display: none;
}

body.page-id-2616 .woocommerce form.login input[type="text"],
body.page-id-2616 .woocommerce form.login input[type="password"] {
  width: 100%;
  background: var(--color-neutral-100);
  border: 1px solid var(--color-neutral-400);
  border-radius: 4px;
  padding: 10px 12px;
  box-sizing: border-box;
}

body.page-id-2616 .woocommerce form.login input::placeholder {
  color: var(--color-neutral-300);
}

body.page-id-2616 .woocommerce form.login button[type="submit"] {
  width: 100%;
}




body.page-id-2616 .woocommerce form.woocommerce-form-login {
  margin: 0;
  padding: 0;
  border: 0;
}

body.page-id-2616 .woocommerce form.woocommerce-form-login input[type="text"],
body.page-id-2616 .woocommerce form.woocommerce-form-login input[type="password"] {
  width: 100%;
  background: var(--color-neutral-100);
  border: 1px solid var(--color-neutral-400);
  border-radius: 4px;
  padding: 10px 12px;
  box-sizing: border-box;
}

body.page-id-2616 .woocommerce form.woocommerce-form-login input::placeholder {
  color: var(--color-neutral-300);
}

body.page-id-2616 .woocommerce form.woocommerce-form-login button[type="submit"] {
  width: 100%;
}







/* 1) Force hit the WooCommerce login form */
.woocommerce form.login,
.woocommerce form.woocommerce-form-login {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* 2) Style the username + password fields */
.woocommerce form.login input[type="text"],
.woocommerce form.login input[type="password"],
.woocommerce form.woocommerce-form-login input[type="text"],
.woocommerce form.woocommerce-form-login input[type="password"] {
  width: 100% !important;
  background: var(--color-neutral-100) !important;
  border: 1px solid var(--color-neutral-400) !important;
  border-radius: 4px !important;
  padding: 10px 12px !important;
  box-sizing: border-box !important;
}

/* 3) Placeholder color (will show only if placeholders exist) */
.woocommerce form.login input::placeholder,
.woocommerce form.woocommerce-form-login input::placeholder {
  color: var(--color-neutral-300) !important;
}

/* 4) Button full width */
.woocommerce form.login button[type="submit"],
.woocommerce form.woocommerce-form-login button[type="submit"] {
  width: 100% !important;
}

/* 4) Remove title from login card*/
.woocommerce form.login > h2,
.woocommerce form.woocommerce-form-login > h2,
.woocommerce-account .woocommerce > h2,
.woocommerce-account .woocommerce h2 {
  display: none !important;
}

/* Fields styling */
.woocommerce form.login input[type="text"],
.woocommerce form.login input[type="password"],
.woocommerce form.woocommerce-form-login input[type="text"],
.woocommerce form.woocommerce-form-login input[type="password"] {
  font-size: 16px !important;
  line-height: 1.2 !important;
  padding: 10px 12px !important;
}

/* Lost your password styling */

.woocommerce form.login a,
.woocommerce form.woocommerce-form-login a {
  text-decoration: underline !important;
  cursor: pointer !important;
  font-size: 13px;
  
}

/* Center "Lost your password?" */
.woocommerce form.login p.lost_password,
.woocommerce form.woocommerce-form-login p.lost_password {
  text-align: center;
}


/* Lost your password styling */
.woocommerce form.login button[type="submit"],
.woocommerce form.woocommerce-form-login button[type="submit"] {
  width: 100% !important;
  background: var(--color-primary-500) !important;
  border: 0 !important;
  color: var(--color-primary-900) !important;
  border-radius: 4px !important;
  padding: 12px 14px !important;
}

.woocommerce form.login button[type="submit"]:hover,
.woocommerce form.woocommerce-form-login button[type="submit"]:hover {
  background: var(--color-primary-300) !important;
}

/* Remove WooCommerce "Login" heading inside the login form */
.woocommerce form.login h1,
.woocommerce form.login h2,
.woocommerce form.login h3,
.woocommerce form.woocommerce-form-login h1,
.woocommerce form.woocommerce-form-login h2,
.woocommerce form.woocommerce-form-login h3 {
  display: none !important;
  margin: 0 !important;
}

/* Hide labels */

.woocommerce form.login label,
.woocommerce form.woocommerce-form-login label {
  display: none !important;
}


/* Remove WooCommerce Login heading above the form */
.woocommerce > h2 {
  display: none !important;
  margin: 0 !important;
}

body.page-id-XXXX .woocommerce > h2 {
  display: none !important;
}


/* WooCommerce login inputs – text + placeholder visibility */
.woocommerce form.login input[type="text"],
.woocommerce form.login input[type="password"],
.woocommerce form.woocommerce-form-login input[type="text"],
.woocommerce form.woocommerce-form-login input[type="password"] {
  width: 100% !important;
  background: var(--color-neutral-100) !important;
  border: 1px solid var(--color-neutral-400) !important;
  border-radius: 4px !important;
  padding: 10px 12px !important;
  box-sizing: border-box !important;

  /* IMPORTANT */
  color: var(--color-neutral-600) !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}

/* Placeholder color */
.woocommerce form.login input::placeholder,
.woocommerce form.woocommerce-form-login input::placeholder {
  color: var(--color-neutral-500) !important;
  opacity: 1 !important; /* fixes Safari / Chrome dimming */
}



body.page-id-2670 .woocommerce form.woocommerce-form-login {
  display: none !important;
}

body.page-id-2670 .woocommerce form.register {
  margin: 0 !important;
  border: 0 !important;
  padding: 0 !important;
}


/* Make the Header Row Black with White Text */
.woocommerce-checkout-review-order-table thead th {
    background-color: #1f1f1f;
    color: #ffffff;
    border-bottom: none; /* optional: removes the default border to look cleaner */
}

/* Force the background of the Order Box to be White */
.woocommerce-checkout-review-order-table {
    background-color: #ffffff !important; 
}

/* Add a Line above the Total Row */
.woocommerce-checkout-review-order-table tr.order-total th,
.woocommerce-checkout-review-order-table tr.order-total td {
    border-top: 1px solid #e0e0e0; /* The Divider Line */
    padding-top: 20px; /* Adds space between the line and the text */
}



/* --- 1. RENAME "PRODUCT" TO "ORDER SUMMARY" --- */
.woocommerce-checkout-review-order-table thead th.product-name {
    font-size: 0 !important; /* Hides the word "Product" */
}

.woocommerce-checkout-review-order-table thead th.product-name::before {
    content: "Order Summary"; /* The new text */
    font-size: var(--text-l);          /* Restores text size */
    font-weight: 600;
    color: #ffffff;           /* Keeps it White */
    display: block;
}

/* --- 2. HIDE REDUNDANT SUBTOTAL ROW --- */
/* We only need the top price and the bottom Total. The middle one is useless. */
tr.cart-subtotal {
    display: none !important;
}


/* Add space under the main Trip Name */
.tm-trip-title {
    margin-bottom: 15px;
    display: block;
    font-size: 1.15rem;
    font-weight: 700;
    color: #000;
}