/*
Theme Name: DeBebe Child
Author: VamTam
Author URI: https://vamtam.com
Template: vamtam-debebe
*/



/*

put your child theme styles here


you don't need any @import rules

*/
.cuw-offers .cuw-offer{
	border-top: 1px solid rgb(223, 231, 232);
}

.cuw-offers .cuw-offer .cuw-container{
	border-radius: 0 !important; 
    border-color: #DFE7E8 !important;
	border: 0 !important;
	padding: 14px 0px !important;
    background-color: transparent !important;
}

p.cuw-product-title {
    font-size: 16px;
    font-weight: 400;
    color: #0A1E33 !important;
    text-transform: uppercase;
}

.cuw-offer-title {
    padding: 10px !important;
    border-radius: 0 !important;
    font-size: 13px !important; 
}

.cuw-product-image{
	height: 100% !important;
    width: 75px !important;
    flex-shrink: 0 !important;
    padding-right: 20px !important;
}

.cuw-product-section{
	align-items: center !important;
    gap: 0 !important;
	flex-wrap: nowrap !important; 
}

.cuw-offer-cta-section{
	background: transparent !important;
	margin: 0 !important;
}

.cuw-product-quantity, .cuw-product-price{display: none !important}

.cuw-offer-cta-section button{
	background-color: #e46a4b !important;
    color: #fff !important;
    border-radius: 0 !important;
    padding: 10px 24px !important;
    font-size: 13px;
	font-family: Catamaran, sans-serif;
	border-style: dashed !important;
    border-width: 1px 1px 1px 1px !important;
    border-color: var(--e-global-color-vamtam_accent_5) !important;
}

.cuw-offers .cuw-offer .cuw-container .cuw-badge{
	top: inherit !important;
    bottom: 24px !important;
    right: 50% !important;
    transform: translateX(50%) !important;
    width: 448px !important;
    box-sizing: border-box !important;
    max-width: calc(100% - 48px) !important;
    padding: 12px !important;
    background: #f7f7f7 !important;
}

.cuw-offers .cuw-offer .cuw-container .cuw-badge .cuw-offer-title{
    background-color: transparent !important;
    font-weight: 400 !important;
    color: #0a1e33 !important;
    width: 100% !important;
    display: block !important;
    padding: 0 !important;
	font-family: Catamaran, sans-serif;
}

body:not(.term-bebe) .beba-menu{display: none !important;}
body:not(.term-decaci) .decaci-menu{display: none !important;}
body:not(.term-aksesoari) .aksesoari-menu{display: none !important;}
body:not(.term-devojcice) .devojcice-menu{display: none !important;}


.elementor-widget-woocommerce-menu-cart.vamtam-has-theme-widget-styles input.vamtam-quantity-input::-webkit-outer-spin-button,
.elementor-widget-woocommerce-menu-cart.vamtam-has-theme-widget-styles input.vamtam-quantity-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.elementor-widget-woocommerce-menu-cart.vamtam-has-theme-widget-styles input.vamtam-quantity-input{
  	-moz-appearance: textfield;
	padding: 5px 9px;
    text-align: center;
	min-width: 70px;
}

.elementor-widget-woocommerce-menu-cart.vamtam-has-theme-widget-styles .elementor-menu-cart__container .elementor-menu-cart__main .cart_item,
.elementor-widget-woocommerce-menu-cart.vamtam-has-theme-widget-styles .elementor-menu-cart__toggle_wrapper .elementor-menu-cart__container .elementor-menu-cart__main .widget_shopping_cart_content .elementor-menu-cart__footer-buttons{
	padding-top: 24px;
    padding-bottom: 24px;
}

.elementor-widget-woocommerce-menu-cart.vamtam-has-theme-widget-styles .elementor-menu-cart__wrapper .elementor-menu-cart__footer-buttons .elementor-button.elementor-button--checkout{
	--checkout-button-background-color: #F7F7F7;
}

.elementor-widget-woocommerce-cart.vamtam-has-theme-widget-styles .woocommerce .e-cart__column.e-cart__column-start > h3 {
	padding: 15px 0px;
    text-align: center;
    background: #f7f7f7;
    border-radius: 5px;
}

.woocommerce-page table.cart .product-thumbnail {
    display: block !important;
}

.woocommerce-page table.cart .product-thumbnail::before{
	display: none;
}

@media (max-width: 999px) {

  /* 1) razbij table layout u "card" row */
  .woocommerce-cart-form table.shop_table,
  .woocommerce-cart-form table.shop_table tbody,
  .woocommerce-cart-form table.shop_table tr.cart_item {
    display: block;
    width: 100%;
  }

  /* 2) napravi grid na samom row-u */
  .woocommerce-cart-form tr.woocommerce-cart-form__cart-item.cart_item{
    display: grid !important;
    grid-template-columns: 120px 1fr; /* lijevo thumbnail, desno content */
    grid-auto-rows: auto;
    column-gap: 16px;
    row-gap: 10px;
  }

  /* 3) svi td kao grid items */
  .woocommerce-cart-form tr.cart_item > td{
    display: block;
    padding: 0;               /* ubij default table padding */
    border: 0;                /* ubij default borders */
  }

  /* 4) thumbnail ide u prvu kolonu i span preko svih redova */
  .woocommerce-cart-form tr.cart_item > td.product-thumbnail{
    grid-column: 1;
    grid-row: 1 / span 10;    /* “drži” lijevu stranu visinom */
    align-self: start;
  }

  .woocommerce-cart-form tr.cart_item > td.product-thumbnail img{
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
  }

  /* 5) sve ostalo ide u desnu kolonu, jedan ispod drugog */
  .woocommerce-cart-form tr.cart_item > td.product-name,
  .woocommerce-cart-form tr.cart_item > td.product-price,
  .woocommerce-cart-form tr.cart_item > td.product-quantity,
  .woocommerce-cart-form tr.cart_item > td.product-subtotal,
  .woocommerce-cart-form tr.cart_item > td.product-remove{
    grid-column: 2;
  }

  /* 6) eksplicitni redoslijed desne strane */
  .woocommerce-cart-form tr.cart_item > td.product-name     { grid-row: 1; }
  .woocommerce-cart-form tr.cart_item > td.product-price    { grid-row: 2; }
  .woocommerce-cart-form tr.cart_item > td.product-quantity { grid-row: 3; }
  .woocommerce-cart-form tr.cart_item > td.product-subtotal { grid-row: 4; }
  .woocommerce-cart-form tr.cart_item > td.product-remove   { grid-row: 5; }

  /* optional: poravnanje remove dugmeta desno */
  .woocommerce-cart-form tr.cart_item > td.product-remove{
    justify-self: start; /* promijeni u end ako želiš skroz desno */
  }
	
	.elementor-widget-woocommerce-cart.vamtam-has-theme-widget-styles .woocommerce table.cart tr {
        padding: 10px 0px !important;
    }
	.elementor-widget-woocommerce-cart.vamtam-has-theme-widget-styles .woocommerce table.cart tr td{
		padding: 0 !important;
	}
	
	 /* subtotal i remove u isti red */
  .woocommerce-cart-form tr.cart_item > td.product-subtotal {
    grid-column: 2;
    grid-row: 4;
  }

  .woocommerce-cart-form tr.cart_item > td.product-remove {
    grid-column: 2;
    grid-row: 4;
    justify-self: end; /* gurne remove skroz desno */
  }
	
	.woocommerce-cart-form tr.cart_item >td.product-name::before{display: none !important}
	.elementor-widget-woocommerce-cart.vamtam-has-theme-widget-styles .woocommerce table.cart tr td.product-name{
		padding-right: 40px !important;
	}
	.elementor-widget-woocommerce-cart.vamtam-has-theme-widget-styles .woocommerce .input-text.qty{
		min-width: 90px;
		padding: 0;
	}
	.woocommerce-cart-form tr.cart_item >td.product-subtotal,
	.woocommerce-cart-form tr.cart_item >td.product-quantity,
	.woocommerce-cart-form tr.cart_item >td.product-price{
		display: inline-flex;
		align-items: center;
	}
	.elementor-widget-woocommerce-cart .woocommerce table.cart td.product-remove {
    	padding-inline: 0;
    	position: absolute;
    	right: inherit;
    	right: 0;
	}
	.elementor-widget-woocommerce-cart .woocommerce table.cart td.product-remove a{
		padding: 5px;
        color: #fff !important;
		width: 28px !important;
        height: 28px!important;
        aspect-ratio: 1 / 1!important;
        border-radius: var(--checkout-button-border-radius, 3px)!important;
        border-style: dashed!important;
        border-width: 1px 1px 1px 1px!important;
        text-align: center!important;
        font-size: 10px!important;
		background-color: var(--e-global-color-vamtam_accent_1) !important;
		border-color: var(--e-global-color-vamtam_accent_5) !important;
	}
	.elementor-widget-woocommerce-cart .woocommerce table.cart td.product-remove a i.vamtam-remove-product svg{
		width: 14px;
	}
}


@media (max-width: 640px){
	.cuw-container{
		display: flex;
		flex-direction: column !important;
	}
	.cuw-container > div:last-child{
		justify-content: center !important;
		flex-direction: column;
	}
	.cuw-product-image{width: 145px !important;}
}