/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* ============================================
   LOCOMOTYPE - Elementor Cart Widget Styling
   ============================================ */

/* Container umum */
.e-cart__container {
  color: #1d1f24;
}

/* ===== TABEL CART ===== */
.e-shop-table table.shop_table {
  border: 1px solid #e3e5e9;
  border-collapse: collapse;
  box-shadow: none;
  width: 100%;
}

.e-shop-table table.shop_table thead {
  background: #fff;
  border-bottom: 1px solid #e3e5e9;
}

.e-shop-table table.shop_table th {
  font-weight: 600;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #1d1f24;
  padding: 16px 12px;
  border: none;
  text-align: left;
}

.e-shop-table table.shop_table td {
  border: none;
  border-bottom: 1px solid #e3e5e9;
  padding: 20px 12px;
  vertical-align: middle;
}

.e-shop-table table.shop_table tbody tr:last-child td {
  border-bottom: none;
}

/* Nama produk */
.e-shop-table table.shop_table td.product-name a {
  color: #1d1f24;
  font-weight: 600;
  text-decoration: none;
}
.e-shop-table table.shop_table td.product-name a:hover {
  color: #ff5a1f;
}

/* Style/license meta text (sesuaikan lagi kalau markup licensing plugin beda) */
.e-shop-table table.shop_table td.product-name dl.variation,
.e-shop-table table.shop_table td.product-name .locomotype-license-info {
  font-size: 13px;
  color: #5b5f66;
}
.e-shop-table table.shop_table td.product-name dl.variation dt {
  font-weight: 600;
  color: #1d1f24;
}

/* Thumbnail */
.e-shop-table table.shop_table td.product-thumbnail img {
  border-radius: 4px;
  box-shadow: none;
  border: 1px solid #e3e5e9;
}

/* Remove (x) button */
.e-shop-table table.shop_table a.remove {
  color: #9a9ea6 !important;
  background: transparent !important;
  border-radius: 0 !important;
  font-size: 20px;
  transition: color 0.15s ease;
}
.e-shop-table table.shop_table a.remove:hover {
  color: #ff5a1f !important;
  background: transparent !important;
}

/* Quantity input */
.e-shop-table table.shop_table .quantity input.qty {
  border: 1px solid #e3e5e9;
  border-radius: 4px;
  height: 40px;
  text-align: center;
  color: #1d1f24;
}
.e-shop-table table.shop_table .quantity input.qty:focus {
  border-color: #ff5a1f;
  outline: none;
  box-shadow: none;
}

/* Subtotal harga */
.e-shop-table table.shop_table td.product-subtotal {
  font-weight: 600;
}

/* ===== UPDATE CART BUTTON ===== */
.elementor-widget-woocommerce-cart .e-cart-section {
    padding: 25px 25px;
}
.e-cart-section button[name="update_cart"] {
  background: #fff;
  color: #1d1f24;
  border: 1px solid #e3e5e9;
  border-radius: 4px;
  padding: 12px 24px;
  font-weight: 600;
  text-transform: none;
  box-shadow: none;
  transition: all 0.15s ease;
}
.e-cart-section button[name="update_cart"]:hover:not(:disabled) {
  border-color: #ff5a1f;
  color: #ff5a1f;
}
.e-cart-section button[name="update_cart"]:disabled {
  color: #b5b8bd;
  border-color: #e3e5e9;
  cursor: not-allowed;
}
.e-cart-section button[name="update_cart"]:disabled:hover {
  color: #b5b8bd;
  border-color: #e3e5e9;
  cursor: not-allowed;
}

/* ===== COUPON FORM ===== */
.e-cart-section.coupon {
  display: flex;
  gap: 12px;
  align-items: stretch;
  border: 1px solid #e3e5e9;
  border-radius: 4px;
  padding: 20px;
}
.e-cart-section.coupon #coupon_code {
  border: 1px solid #e3e5e9;
  border-radius: 4px;
  padding: 0 16px;
  height: 46px;
  min-width: 260px;
  color: #1d1f24;
}
.e-cart-section.coupon #coupon_code:focus {
  border-color: #ff5a1f;
  outline: none;
}
.e-cart-section.coupon button[name="apply_coupon"] {
  background: #ff5a1f;
  border: none;
  border-radius: 4px;
  color: #fff;
  font-weight: 600;
  box-shadow: none;
}
.e-cart-section.coupon button[name="apply_coupon"]:hover {
  background: #1d1f24;
  color: #fff;
}

/* ===== CART TOTALS (kolom kanan e-cart__column-end) ===== */
.cart_totals h2 {
	border-bottom: 1px solid #e3e5e9;
}
.cart_totals table.shop_table tr.order-total td {
    border-top-color: var(--totals-divider-color, #69727d);
    border-top-width: var(--totals-divider-weight, 0);
    border-bottom: 1px solid #e3e5e9;
}
.e-cart__column-end table.shop_table th,
.e-cart__column-end table.shop_table td {
  border-bottom: 1px solid #e3e5e9;
  padding: 14px 0;
  color: #5b5f66;
  font-size: 14px;
}
.e-cart__column-end table.shop_table tr.order-total th,
.e-cart__column-end table.shop_table tr.order-total td {
  border-bottom: none;
  font-weight: 700;
  font-size: 17px;
  color: #1d1f24;
}
.e-cart__column-end table.shop_table tr.order-total .woocommerce-Price-amount {
  color: #ff5a1f;
}

/* ===== CHECKOUT BUTTON ===== */
.elementor-widget-woocommerce-cart .woocommerce .wc-proceed-to-checkout .checkout-button {
  background: #ff5a1f;
  border: none;
  border-radius: 4px;
  color: #fff;
  font-weight: 700;
  text-transform: none;
  padding: 16px 24px;
  box-shadow: none;
  transition: background 0.15s ease;
  display: block;
  text-align: center;
  margin-bottom: 10px;
}
.elementor-widget-woocommerce-cart .woocommerce .wc-proceed-to-checkout .checkout-button:hover {
  background: #e04f1a;
  color: #fff;
}

/* CHECKOUT PAGE - YOUR ORDER*/
.elementor-widget-woocommerce-checkout-page .woocommerce .shop_table thead tr th {
    border-bottom: 1px solid #aaa;
}
.elementor-widget-woocommerce-checkout-page .woocommerce .woocommerce-checkout-review-order-table .cart_item td {
    border-bottom: 1px solid #aaa;
}
/* global font CHECKOUT PAGE */
.elementor-widget-woocommerce-checkout-page {
	font-family: var(--e-global-typography-primary-font-family);
	font-size: var(--e-global-typography-primary-font-size);
}

/* =========================================================================
   Locomotype — Cart & Checkout Tidy-Up
   =========================================================================
   Standalone CSS for the font-license meta (Styles / license / tier / discount)
   shown under each product in the Cart and Checkout.

   WHERE TO PASTE THIS:
   - Appearance → Customize → Additional CSS, OR
   - Your child theme's style.css, OR
   - Elementor → Site Settings → Custom CSS

   All rules are scoped to .woocommerce-cart and .woocommerce-checkout, so it is
   safe to load site-wide — it will not affect other pages.

   ACCENT COLOR: change --loco-accent below to match your brand.
   ========================================================================= */

:root {
	--loco-accent: #ff5a1f; /* discount line color */
}

/* --- Spacing for the whole meta list (one block per product) --- */
.woocommerce-cart .cart_item dl.variation,
.woocommerce-checkout .cart_item dl.variation,
.woocommerce-cart table.shop_table dl.variation,
.woocommerce-checkout table.shop_table dl.variation {
	margin: 0.35rem 0 0;
	font-size: 0.86em;
	line-height: 1.45;
}

/* --- Label (dt) + value (dd) flow together on one line --- */
.woocommerce-cart dl.variation dt,
.woocommerce-cart dl.variation dd,
.woocommerce-checkout dl.variation dt,
.woocommerce-checkout dl.variation dd {
	display: inline;
	margin: 0;
	padding: 0;
	float: none;
	clear: none;
	font-weight: inherit;
}

.woocommerce-cart dl.variation dt,
.woocommerce-checkout dl.variation dt {
	font-weight: 600;
}

/* Space between the label and its value */
.woocommerce-cart dl.variation dt::after,
.woocommerce-checkout dl.variation dt::after {
	content: " ";
}

/* Break after each value so every license sits on its own line, while the
   label+value stay together on that line */
.woocommerce-cart dl.variation dd::after,
.woocommerce-checkout dl.variation dd::after {
	content: "";
	display: block;
	margin-bottom: 0.3rem;
}

/* Remove WooCommerce's default <p> margins inside dd */
.woocommerce-cart dl.variation dd p,
.woocommerce-checkout dl.variation dd p {
	margin: 0;
	display: inline;
}

/* --- Checkout order-review: narrow Product column needs the title to breathe --- */
.woocommerce-checkout .woocommerce-checkout-review-order-table .product-name {
	line-height: 1.4;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table .product-name > a {
	display: inline-block;
	margin-bottom: 0.15rem;
	font-weight: 600;
}

/* --- Bundle Discount line in accent color ---
   WooCommerce slugifies the meta key into the class, so "Bundle Discount"
   becomes .variation-bundle-discount on both <dt> and <dd>. */
.woocommerce-cart dl.variation dt.variation-bundle-discount,
.woocommerce-cart dl.variation dd.variation-bundle-discount,
.woocommerce-checkout dl.variation dt.variation-bundle-discount,
.woocommerce-checkout dl.variation dd.variation-bundle-discount {
	color: var(--loco-accent);
	font-weight: 600;
}

/* --- Styles / Family line: a touch more prominence as the "what" --- */
.woocommerce-cart dl.variation dt.variation-styles,
.woocommerce-cart dl.variation dt.variation-family,
.woocommerce-checkout dl.variation dt.variation-styles,
.woocommerce-checkout dl.variation dt.variation-family {
	font-weight: 700;
}

button .button .alt {
	background: #ff5a00 !important;
}

/* ==========================================================================
   Locomotype — Custom My Account (Login/Register) Styling
   Target: WooCommerce default my-account page
   v2 — flatter, fixed button selectors, stronger specificity
   ========================================================================== */

/* --- Kill any outer wrapper border/shadow (Elementor container, etc.) ---
   If the outer box around both cards still shows after this, remove the
   border directly on the Elementor Container/Section wrapping the
   [woocommerce_my_account] shortcode: select it → Style tab → Border → None.
*/
.woocommerce-account .woocommerce,
.woocommerce-account .woocommerce > *:not(.u-columns) {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* --- Page heading (Login / Register) --- */
.woocommerce-account .woocommerce h2,
.woocommerce-account h1.entry-title {
  font-size: 24px;
  font-weight: 500;
  color: #1d1f24;
  letter-spacing: -0.01em;
  margin: 0 0 20px;
}

/* --- Column layout --- */
.woocommerce-account .u-columns.col2-set {
  display: flex;
  gap: 40px;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.woocommerce-account .col-1,
.woocommerce-account .col-2 {
  flex: 1;
  background: transparent;
  border: none;
  padding: 0;
  box-shadow: none;
}

/* --- Form card: single hairline border, flat, no radius --- */
.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register {
  background: #ffffff;
  border: 1px solid #e3e5e9;
  border-radius: 0;
  padding: 28px;
  box-shadow: none;
}

/* --- Labels --- */
.woocommerce-account .woocommerce-form-login label,
.woocommerce-account .woocommerce-form-register label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #1d1f24 !important;
  margin-bottom: 6px !important;
  letter-spacing: 0.01em;
}

.woocommerce-account .required {
  color: #ff5a1f !important;
  text-decoration: none !important;
}

/* --- Inputs --- */
.woocommerce-account .woocommerce-form-login input.input-text,
.woocommerce-account .woocommerce-form-register input.input-text,
.woocommerce-account .woocommerce-form-login input[type="password"],
.woocommerce-account .woocommerce-form-register input[type="password"] {
  width: 100%;
  padding: 11px 14px;
  background: #fafafa;
  border: 1px solid #e3e5e9;
  border-radius: 0;
  font-size: 14px;
  color: #1d1f24;
  box-shadow: none;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.woocommerce-account .woocommerce-form-login input.input-text:focus,
.woocommerce-account .woocommerce-form-register input.input-text:focus,
.woocommerce-account .woocommerce-form-login input[type="password"]:focus,
.woocommerce-account .woocommerce-form-register input[type="password"]:focus {
  outline: none;
  border-color: #ff5a1f;
  background: #ffffff;
}

/* Password visibility toggle icon (WooCommerce injects a button) */
.woocommerce-account .password-input {
  position: relative;
}

.woocommerce-account .show-password-input {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* --- Buttons ---
   Real WooCommerce classes: .woocommerce-button.button.woocommerce-form-login__submit
   and .woocommerce-button.button.woocommerce-form-register__submit
   (lowercase "button" — the earlier version targeted the wrong class name)
*/
.woocommerce-account .woocommerce-form-login button[type="submit"],
.woocommerce-account .woocommerce-form-register button[type="submit"],
.woocommerce-account .woocommerce-form-login .woocommerce-button,
.woocommerce-account .woocommerce-form-register .woocommerce-button,
.woocommerce-account .woocommerce-form-login .button,
.woocommerce-account .woocommerce-form-register .button {
  background: #ff5a1f !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 13px 28px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: none !important;
  transition: background 0.15s ease;
}

.woocommerce-account .woocommerce-form-login button[type="submit"]:hover,
.woocommerce-account .woocommerce-form-register button[type="submit"]:hover,
.woocommerce-account .woocommerce-form-login .woocommerce-button:hover,
.woocommerce-account .woocommerce-form-register .woocommerce-button:hover {
  background: #1e2229 !important;
  color: #ffffff !important;
}

/* --- Remember me checkbox --- */
.woocommerce-account .woocommerce-form-login__rememberme {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #1d1f24;
  margin-left: 16px;
  cursor: pointer;
}

.woocommerce-account .woocommerce-form-login__rememberme input[type="checkbox"] {
  appearance: none;
  width: 16px;
  height: 16px;
  border: 1px solid #e3e5e9;
  border-radius: 0;
  cursor: pointer;
  position: relative;
  margin: 0;
}

.woocommerce-account .woocommerce-form-login__rememberme input[type="checkbox"]:checked {
  background: #ff5a1f;
  border-color: #ff5a1f;
}

.woocommerce-account .woocommerce-form-login__rememberme input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 4px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* --- Links (Lost password / privacy policy) --- */
.woocommerce-account .woocommerce-form-login .lost_reset_password,
.woocommerce-account .woocommerce-form-register a,
.woocommerce-account .woocommerce-privacy-policy-text a {
  color: #ff5a1f !important;
  text-decoration: none;
  font-size: 13px;
}

.woocommerce-account .woocommerce-form-login .lost_reset_password:hover,
.woocommerce-account .woocommerce-form-register a:hover {
  text-decoration: underline;
}

.woocommerce-account .woocommerce-privacy-policy-text {
  font-size: 12px;
  color: #6b6f76;
  line-height: 1.6;
  margin: 16px 0 20px;
}

/* --- Form row spacing --- */
.woocommerce-account .woocommerce-form-row,
.woocommerce-account p.woocommerce-form-row {
  margin: 0 0 18px;
}

.woocommerce-account .woocommerce-form-login .lost_reset_password {
  display: inline-block;
  margin-top: 4px;
}

/* --- Responsive: stack columns on mobile --- */
@media (max-width: 768px) {
  .woocommerce-account .u-columns.col2-set {
    flex-direction: column;
    gap: 24px;
  }

  .woocommerce-account .woocommerce-form-login,
  .woocommerce-account .woocommerce-form-register {
    padding: 22px;
  }
}

/* ============================================================================================= */
/* TARUH PALING BAWAH BIAR MUDAH MEMONITOR */
/* DAFTAR FONT-FACE PREVIEW YANG DIGUNAKAN UNTUK JUDUL FONT */
/* GUNAKAN PREVIEW VERSI SUBSET */
/* ============================================================================================= */
.font-preview h2,
.font-preview .elementor-heading-title,
.font-preview .elementor-heading-title a {
  font-family: inherit !important;
	line-height: 1em !important;
}
.font-preview {
  font-size: 42px;
}

@font-face {
  font-family: 'Giga Sans';
  src: url('https://locomotype.com/wp-content/uploads/2026/07/GigaSans-Regular-preview.woff') format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'Cendra';
  src: url('https://locomotype.com/wp-content/uploads/2026/07/Cendra-SemiBold-preview.woff') format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'Bakso Sapi Pro';
  src: url('https://locomotype.com/wp-content/uploads/2026/07/BaksoSapiAllcaps-Regular-preview.woff') format('woff');
  font-display: swap;
}
	
@font-face {
  font-family: 'Gunterz Rounded';
  src: url('https://locomotype.com/wp-content/uploads/2026/07/GunterzRounded-Regular-preview.woff') format('woff');
  font-display: swap;
}
@font-face {
  font-family: 'Kaligawe';
  src: url('https://locomotype.com/wp-content/uploads/2026/07/Kaligawe-Regular-preview.woff') format('woff');
  font-display: swap;
}
@font-face {
  font-family: 'LAKONE';
  src: url('https://locomotype.com/wp-content/uploads/2026/07/Lakone-Regular-preview.woff') format('woff');
  font-display: swap;
}
@font-face {
  font-family: 'Gelegar Expanded';
  src: url('https://locomotype.com/wp-content/uploads/2026/07/Gelegar-Expanded-preview.woff') format('woff');
  font-display: swap;
}
@font-face {
  font-family: 'Gunterz';
  src: url('https://locomotype.com/wp-content/uploads/2026/07/Gunterz-Regular-preview.woff') format('woff');
  font-display: swap;
}

/* TAMBAHKAN DI ATAS GARIS INI ====================================================================== */