/* ========================================================================= */
/* === 1. VARIABLES === */
/* ========================================================================= */
:root {
  --color-primary: #C25700;
  --color-secondary: #6e7c03;
  --color-primary-light: #f2e8dd;
  --bg-body: #f9f6f3;
  --text-color: #3f3f3f;
  --gray-color: #767676;
  --bold-color: #222222;
  --light: #fffbf6;
  --color-dark: #221f1d;
  --border: #dbdbd3;
  --shadow: 0 0 8px 1px #cccccc;
  --shadow-primary: 0 0 10px 1px var(--color-primary);
  --shadow-secondary: 0 0 10px 1px var(--color-secondary);
  --font-text: "roboto", sans-serif;
  --font-heading: "roboto", sans-serif;

/* PRIMARY BRAND COLORS (Εμπνευσμένα από το Λογότυπο: Ψύξη, Φρεσκάδα) */
--primary-brand: #00BFFF;    /* Φωτεινό Cyan/Γαλάζιο - Για βασική έμφαση και τίτλους */
--primary-brand-light: #87CEFA; /* Ανοιχτό Γαλάζιο - Για hovers και διακριτικά στοιχεία */
--primary-brand-dark: #007BA7;  /* Σκούρο Γαλάζιο - Για αντίθεση και κείμενα πάνω σε ανοιχτό φόντο */

/* BACKGROUNDS & GENERAL TEXTS */
--lbg: #fcf8f3;             /* Light Background - Ζεστό Off-White (Όπως στο Header) */
--dbg: #2E7D32;             /* Dark Background - Πράσινο (Διατηρείται ως Σκούρο Φόντο/Contrast) */
--white: #fff;              /* Καθαρό Λευκό */
--tbg: rgba(0, 0, 0, 0.6);

/* TEXT & FONT COLORS */
--lfont: #aaa;              /* Light Font - Ανοιχτό Γκρι/Δευτερεύον Κείμενο */
--dfont: #333333;           /* Dark Font - Σκούρο Γκρι/Μαύρο (Κύριο Κείμενο) */

/* BANNERS & ACCENTS */
--banners: #2B2F42;         /* Dark Blue/Slate Grey - Για φόντο Banner, σοβαρότητα */
--lbanners: #607D8B;        /* Muted Blue/Grey-Blue - Για υποστηρικτικό φόντο/διαχωρισμό */

/* CALL TO ACTION (CTA) COLORS - Υψηλή Αντίθεση */
--cta: #F9A825;             /* Orange-Gold - Κύριο CTA (Δημιουργεί αντίθεση με το Γαλάζιο) */
--ctabg: #D32F2F;
}

/* ========================================================================= */
/* === 2. BASE / GLOBAL STYLES === */
/* ========================================================================= */

/* Global Typography & Structure */
*, html, body {
  font-family: var(--font-heading) !important;
  font-weight: 400 !important;
  color: var(--dfont);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading) !important;
}

b, strong {
  font-weight: 600 !important;
  color: var(--primary-brand);
}

a {
  color: var(--primary-brand);
}

a:hover {
  color: var(--primary-brand-dark);
}

.image-field {
  margin: 0 0 0rem 0;
}

/* Icons */
.usp-icon svg,
.fa {
  font-family: FontAwesome !important;
}

[class="icon"], [class^="icon-"], [class*=" icon-"] {
  line-height: 1.4;
}

/* Layout */
#main,
.main-wrapper {
  background: var(--white);
}

#main-wrapper .container {
  max-width: 98%;
}

#main-wrapper .container h2.block-title,
h2.views-label {
  text-align: center;
  padding: 40px;
}

blockquote p:last-of-type {
  margin: 1rem 3.5rem;
}

#breadcrumb {
  background-color: var(--light);
  font-size: 0.7rem;
}

/* Buttons and Links */
.newprods .button,
.front-item-txt a,
input[type="submit"],
input[type="button"],
input[type="reset"],
button,
.button {
  display: inline-block;
  background-color: var(--banners);
  color: var(--cta);
  padding: 8px 1rem;
  border: 3px solid #ffffff;
  border-radius: 2rem;
  transition: all 0.4s ease-in-out;
  line-height: 1.6;
}

.newprods .button:hover,
.front-item-txt a:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
button:hover,
.button:hover,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
button:focus,
.button:focus {
  background-color: transparent;
  border: 3px solid var(--banners);
  color: var(--bold-color);
}

/* ========================================================================= */
/* === 3. HEADER STYLES === */
/* ========================================================================= */

/* Header Top Bar */
.header-top {
  background-color: var(--banners);
  color: var(--lfont);
}
.header-top-block p:last-of-type {
  margin: 0;
  color: var(--lbg);
}

/* Header Container & Branding (Logo/Nav) */
.header-container {
  padding: 0.4rem;
  display: block !important;
}

.block-region.region-site-branding {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
}

.block-region.region-site-branding #block-tara-branding {
  flex: 0 0 88%;
}

.block-region.region-site-branding #block-tara-responsivemenumobileicon,
.block-region.region-site-branding #block-tara-allagiglossas {
  flex: 0 0 6%;
  padding: 20px 0px;
}

/* Στοχεύουμε την εικόνα του λογοτύπου */
img[src="/sites/default/files/MIKY%20FINAL%20PNG2_0.png"] {
    /* Ορίζουμε τις σταθερές διαστάσεις για να κρατήσουμε χώρο */
    width: 100px !important;
    height: 188px !important;
    
    /* Για να διασφαλίσουμε ότι το CSS θα υπερισχύσει τυχόν άλλων ρυθμίσεων */
    display: block; 
}

/* Menu & Mobile Toggle */
.responsive-menu-toggle-icon .label {
  display: none !important;
}

.responsive-menu-toggle-icon {
  height: 20px;
}

.responsive-menu-toggle-icon::before,
.responsive-menu-toggle-icon::after,
.responsive-menu-toggle-icon span.icon {
  background: var(--cta);
}

/* Language Switcher */
.language-switcher-language-url .block-content ul {
  display: flex;
  flex-wrap: nowrap;
  margin: 0px;
  padding: 0px
}

.language-switcher-language-url .block-content ul li {
  list-style: none;
  padding: 0px;
  flex: 0 0 30%;
  margin: 0px 6px;
}

.language-switcher-language-url .block-content ul li img {
  width: 100%;
  height: 80%;;
  margin: 0px;
  padding: 4px 0px;
}

/* Sticky Header & Logo Animation (Frontpage Specific) */
.user-logged-in .is-sticky header {
  top: 80px !important;
}

/* Social Icons */
.social-icons li a {
  color: var(--cta);
}

ul.social-icons a:hover {
  background: var(--cta);
  color: #ffffff;
}

/* ========================================================================= */
/* === 4. MAIN / PAGE CONTENT STYLES === */
/* ========================================================================= */

/* General Page Content */
.page-node-type-page #main.page-content {
  width: 80% !important;
  margin: 0 auto;
  padding: 40px;
}

/* Product/Equipment Listing Pages */
.product-lists .view-header,
.product-desc {
  background: var(--white);
  padding: 20px;
  margin: 20px;
}

.page-node-type-exoplismos .field--name-field-product-image .field-items {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
}

.page-node-type-exoplismos .field--name-field-product-image .field-items .field-item {
  flex: 0 0 23%;
}

/* Single Product/Item Pages */
.page-node-type-proionta .node-content {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.page-node-type-proionta .node-content .field--name-field-product-image,
.page-node-type-proionta .node-content fieldset {
  flex: 0 0 47%;
}

.page-node-type-proionta .node-content fieldset {
  padding: 20px;
}

/* Contact Page Specific */
.path-contact .region-content {
  display: flex;
  flex-wrap: wrap;
}

.region-content #block-tara-page-title {
  flex: 0 0 100%;
  text-align: center;
  padding: 30px;
}

.path-contact .region-content .websdt-contact,
.path-contact .region-content #block-tara-content {
  flex: 0 0 50%;
  padding: 40px;
}

.path-contact .region-content #block-tara-content {
  background: var(--grey);
}

.map {
  flex: 0 0 100%;
}

.map iframe {
  width: 100%
}

/* Scroll to top */
.scrolltop {
  right: 23px;
  bottom: 83px;
}

/* ========================================================================= */
/* === 5. BLOCKS / COMPONENTS === */
/* ========================================================================= */

/* Slider Block */
#slider {
  background-image: url(../images/frontpage.webp);
}

.home-slider h1, .home-slider h2, .home-slider h3 {
  font-size: 2rem;
  padding: 10px;
  background: var(--tbg);
	  color: var(--white);
}

.home-slider p {
  font-size: 1rem;
  padding: 10px;
  background: var(--tbg);
	  color: var(--white);
}

/* "New Products" / Callout Block */
#block-tara-dimioyrgistetodikosaspagotomebasimiky {
  background: none;
  margin: 0px;
  padding: 0px;
  box-shadow: none;
}

.newprods .callout-banner-block {
  background-image: none;
  background-size: unset;
  background-position: center;
  background-repeat: no-repeat;
  background: var(--banners);
  color: var(--white) !important;
  padding: 30px 20px;
  margin: 40px 0;
  text-align: center;
  border-radius: 6px;
}

.newprods .callout-content {
  max-width: 80%;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.newprods .callout-content h2 strong {
  margin-bottom: 15px;
  color: var(--primary-brand) !important;
}

.newprods .callout-content p {
  color: var(--white);
}
.newprods .callout-content strong {
  color: var(--primary-brand);
}
.newprods .callout-content .button {
  background: var(--cta);
  color: var(--white)
}

/* Split in Half Blocks (splitinhalf / splitinhalffr / splitinhalftxt) */
.splitinhalftxt h2.block-title,
.splitinhalf h2.block-title {
  color: var(--primary-brand-dark);
}

#block-tara-pagotamikyartfrigoiplirisolokliromenilysigiatokatastimasas {
  background: var(--banners)
}

#block-tara-pagotamikyartfrigoiplirisolokliromenilysigiatokatastimasas h3 {
  color: var(--white)
}

#block-tara-pagotamikyartfrigoiplirisolokliromenilysigiatokatastimasas li {
  color: var(--white);
}

#block-tara-pagotamikyartfrigoiplirisolokliromenilysigiatokatastimasas p {
  color: var(--white);
}
.product-lists .view-content,
#block-tara-views-block-front-page-categories-block-3-2 .view-content,
#block-tara-views-block-front-page-categories-block-2-2 .view-content,
#block-tara-views-block-front-page-categories-block-3 .view-content,
#block-tara-views-block-front-page-categories-block-2 .view-content {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  align-items: center;
  justify-content: center;
}

.product-lists .view-content .views-row,
#block-tara-views-block-front-page-categories-block-3-2 .view-content .views-row,
#block-tara-views-block-front-page-categories-block-2-2 .view-content .views-row,
#block-tara-views-block-front-page-categories-block-3 .view-content .views-row,
#block-tara-views-block-front-page-categories-block-2 .view-content .views-row {
  flex: 0 0 31%;
  text-align: center;
}

#block-tara-views-block-front-page-categories-block-3-2 .view-content .views-row .views-field-name a,
#block-tara-views-block-front-page-categories-block-2-2 .view-content .views-row .views-field-name a,
.product-lists .view-content .views-row .views-field-name a,
.product-lists .view-content .views-row .views-field-title a,
#block-tara-views-block-front-page-categories-block-3 .view-content .views-row .views-field-name a,
#block-tara-views-block-front-page-categories-block-2 .view-content .views-row .views-field-name a {
  display: block;
  background: var(--dfont);
  padding: 10px;
  min-height: 1lh;
  height: 3lh;
  box-sizing: border-box;
}

.splitinhalffr .front-block-content,
.splitinhalftxt .block-content .usp-columns,
.splitinhalf .block-content {
  display: flex;
  flex-wrap: wrap;
}

.splitinhalffr .front-block-content .front-block-item,
.splitinhalftxt .block-content .usp-column,
.splitinhalf .field--name-field-eikona,
.splitinhalf .field--type-text-with-summary {
  flex: 0 0 50%;
}

.product-lists .view-content .views-row img,
.splitinhalffr .front-block-content .front-block-item img,
.splitinhalf .field--name-field-eikona img {
  width: 100%;
  height: auto;
}

.splitinhalffr .front-block-content .front-item-txt,
.splitinhalf .field--type-text-with-summary {
  padding: 20px 50px;
}

.splitinhalftxt .block-content .one-stop-shop-block-img {
  text-align: center;
}

.splitinhalffr .front-block-content .front-block-item img {
  margin: 0px;
  padding: 0px;
}

/* Order adjustments for alternating rows */
#block-tara-views-block-front-page-categories-block-1 .views-row:nth-child(even) .splitinhalffr .front-block-item.front-item-img,
#block-tara-views-block-front-page-categories-block-1-2 .views-row:nth-child(even) .splitinhalffr .front-block-item.front-item-img {
  order: 1
}

#block-tara-views-block-front-page-categories-block-1 .views-row:nth-child(even) .splitinhalffr .front-block-item.front-item-txt,
#block-tara-views-block-front-page-categories-block-1-2 .views-row:nth-child(even) .splitinhalffr .front-block-item.front-item-txt {
  order: 2
}

#block-tara-views-block-front-page-categories-block-1 .views-row:nth-child(odd) .splitinhalffr .front-block-item.front-item-img,
#block-tara-views-block-front-page-categories-block-1-2 .views-row:nth-child(odd) .splitinhalffr .front-block-item.front-item-img {
  order: 2
}

#block-tara-views-block-front-page-categories-block-1 .views-row:nth-child(odd) .splitinhalffr .front-block-item.front-item-txt,
#block-tara-views-block-front-page-categories-block-1-2 .views-row:nth-child(odd) .splitinhalffr .front-block-item.front-item-txt {
  order: 1
}

#block-tara-views-block-front-page-categories-block-1 .views-row:nth-child(odd),
#block-tara-views-block-front-page-categories-block-1-2 .views-row:nth-child(odd) {
  background: var(--lbg)
}

/* Split in Four Blocks (splitinfour) */
.region-content-top .block, .region-content-bottom .block {
  background-color: var(--banners);
}

#block-tara-giatinaepilexeteemas {
  background: var(--lbg);
}

.splitinfour .block-content .mikky-usp-block {
  display: flex;
  flex-wrap: wrap
}

.splitinfour .block-content .mikky-usp-block .usp-item {
  flex: 0 0 25%;
  padding: 20px;
}

.splitinfour .block-content .mikky-usp-block .usp-item .usp-icon {
  text-align: center;
}

.splitinfour .block-content .mikky-usp-block .usp-item .usp-icon svg {
  width: 20%;
  height: auto;
  text-align: center;
  fill: var(--primary-brand) !important;
}

.splitinfour .block-content .mikky-usp-block .usp-item h3 {
  text-align: center;
  min-height: 2lh;
  color: var(--dfont);
  height: 3lh;
}

.splitinfour .block-content .mikky-usp-block .usp-item p {
  text-align: justify;
  color: var(--lfont);
}

/* ========================================================================= */
/* === 6. FOOTER STYLES === */
/* ========================================================================= */
#footer {
  background: var(--dfont);
  color: var(--lbg)
}
.footer .block-title {
  color: var(--lbg)
}
.footer .block p {
  color: var(--lbg)
}
#block-tara-epikoinonia h3 {
  font-size: 1.3rem;
  color: var(--cta);
}

#block-tara-epikoinonia div.icon-row {
  display: flex;
  flex-wrap: nowrap;
}

#block-tara-epikoinonia div.icon-rowo-item {
  margin-right: 15px;
}

#block-tara-epikoinonia div.icon-rowo-item i {
  color: var(--cta)
}

.websdt-contact div.icon-row {
  display: flex;
  flex-wrap: nowrap;
}

.websdt-contact div.icon-rowo-item {
  margin-right: 15px;
  padding-top: 4px
}

.websdt-contact div.icon-row p {
  line-height: 1.4;
}

/* ========================================================================= */
/* === 7. COOKIES STYLES === */
/* ========================================================================= */
div#sliding-popup.eu-cookie-withdraw-wrapper {
  background: #fff;
}

div#sliding-popup,
div#sliding-popup .eu-cookie-withdraw-banner,
.eu-cookie-withdraw-tab {
  box-shadow: none;
}

.eu-cookie-withdraw-tab {
  left: 50% !important;
  color: #000 !important;
}

.eu-cookie-withdraw-tab:hover {
  background: #fff !important;
}

#sliding-popup h1,
#sliding-popup h2,
#sliding-popup h3,
#sliding-popup p,
#sliding-popup label,
#sliding-popup div,
.eu-cookie-compliance-more-button,
.eu-cookie-compliance-secondary-button,
.eu-cookie-withdraw-tab {
  color: #000 !important;
}

.eu-cookie-compliance-category-description {
  display: none;
}

input[type="submit"], input[type="button"], input[type="reset"], button, .button {
  color: var(--cta);
}

.eu-cookie-compliance-buttons .button:hover {
  color: #ffffff !important;
}

/* ========================================================================= */
/* === 8. RESPONSIVE OVERRIDES (MEDIA QUERIES) === */
/* ========================================================================= */

/* --- A. SMALL SCREENS / MOBILE (<= 767px) --- */
@media (max-width: 767px) {
  #main-wrapper .container h2.block-title,
  h2.views-label {
    padding: 20px 10px;
  }
  .splitinhalffr .front-block-content .front-block-item,
  .splitinhalftxt .block-content .usp-column,
  .splitinhalf .field--name-field-eikona,
  .splitinhalf .field--type-text-with-summary,
  .path-contact .region-content .websdt-contact,
  .path-contact .region-content #block-tara-content {
    flex: 0 0 100%;
    padding: 20px 10px !important;
  }
  .path-contact .region-content #block-tara-content .block-content input,
  .path-contact .region-content #block-tara-content .block-content textarea {
    box-sizing: border-box;
    width: 100%;
  }
  .path-contact .region-content #block-tara-content .block-content .js-form-item {
    width: 100%;
  }
  .splitinhalffr .front-block-content .front-item-txt,
  .splitinhalf .field--type-text-with-summary {
    padding: 15px 15px;
  }
  .page-node-type-page #main.page-content {
    width: 100% !important;
    margin: 0;
    padding: 15px;
  }
  .splitinfour .block-content .mikky-usp-block .usp-item {
    flex: 0 0 100%;
  }
  .product-lists .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-3-2 .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-2-2 .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-3 .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-2 .view-content .views-row {
    flex: 0 0 100%;
  }
  .page-node-type-exoplismos .field--name-field-product-image .field-items .field-item {
    flex: 0 0 100%;
  }
  .page-node-type-proionta .node-content .field--name-field-product-image,
  .page-node-type-proionta .node-content fieldset {
    flex: 0 0 100%;
  }
  .page-node-type-proionta .node-content fieldset {
    padding: 10px;
  }
  .block-region.region-site-branding #block-tara-branding {
    flex-grow: 1;
    text-align: center;
    flex: 0 0 58%;
  }
  .block-region.region-site-branding #block-tara-responsivemenumobileicon,
  .block-region.region-site-branding #block-tara-allagiglossas {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
    padding: 10px 5px;
  }
  .map iframe {
    max-width: 100%;
  }
  .home-slider h1, .home-slider h2, .home-slider h3 {
    font-size: 1.5rem;
    padding: 8px;
  }
  .home-slider p {
    font-size: 0.9rem;
    padding: 8px;
  }
  /* Sticky Logo Reset for Mobile */

  
  
/* Διόρθωση links σε menu και footer */
#main-menu a, .footer-bottom a {
    /* Δίνουμε padding για να αυξήσουμε το ύψος (16px font + 16px padding = 48px ύψος) */
    padding-top: 16px !important; 
    padding-bottom: 16px !important; 
    
    /* Για να διασφαλίσουμε ότι το padding πιάνει */
    display: inline-block; 
}

/* Συχνά στο footer τα links είναι πολύ μικρά, ας τα στοχεύσουμε και εκεί */
.footer-area a, .menu--footer a { 
    padding: 12px 10px !important; /* Αυτό δίνει συνολικό ύψος περίπου 40px, το οποίο είναι αποδεκτό */
}
/* Διόρθωση Κουμπιών Cookie Banner (Αποδοχή, Αποθήκευση) */
.eu-cookie-compliance-default-button,
.eu-cookie-compliance-save-preferences-button,
.eu-cookie-compliance-more-button {
    min-height: 48px !important;
    padding: 12px 20px !important; /* Αύξηση padding για να φτάσει το 48px */
    margin: 4px; /* Προσθέτουμε κενό μεταξύ των κουμπιών (spacing) */
}

/* Διόρθωση Checkbox (input) - Ενίσχυση της περιοχής γύρω του */
div#eu-cookie-compliance-categories input[type="checkbox"] {
    min-width: 30px; /* Ελαφρώς μεγαλύτερο από το default */
    min-height: 30px;
}

/* Διόρθωση της ετικέτας/περιοχής κλικ του checkbox */
div#eu-cookie-compliance-categories > div.eu-cookie-compliance-category {
    display: flex;
    align-items: center; /* Ευθυγράμμιση */
    min-height: 48px; /* Κάνει όλη τη γραμμή 48px ύψος */
    padding: 4px;
}
#slider {
    /* Εξασφαλίζει ότι το slider θα έχει πάντα ύψος 56% του πλάτους του */
    padding-top: 56% !important; 
    
    /* Μηδενίζει το default ύψος που μπλόκαρε */
    height: auto !important; 
    
    /* Κρατήστε το background-size: cover; */
    background-size: cover;
}
}

/* --- B. TABLET / MEDIUM SCREENS (>= 576px and <= 991px) --- */
@media (min-width: 576px) and (max-width: 991px) {
  .product-lists .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-3-2 .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-2-2 .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-3 .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-2 .view-content .views-row {
    flex: 0 0 48%;
  }
  .splitinhalffr .front-block-content .front-block-item,
  .splitinhalftxt .block-content .usp-column,
  .splitinhalf .field--name-field-eikona,
  .splitinhalf .field--type-text-with-summary,
  .path-contact .region-content .websdt-contact,
  .path-contact .region-content #block-tara-content {
    flex: 0 0 50%;
  }
  .splitinfour .block-content .mikky-usp-block .usp-item {
    flex: 0 0 48%;
  }
  .page-node-type-exoplismos .field--name-field-product-image .field-items .field-item {
    flex: 0 0 48%;
  }
}

/* --- C. LARGE SCREENS (>= 992px) --- */
@media (min-width: 992px) {
  .splitinhalffr .front-block-content .front-block-item,
  .splitinhalftxt .block-content .usp-column,
  .splitinhalf .field--name-field-eikona,
  .splitinhalf .field--type-text-with-summary,
  .path-contact .region-content .websdt-contact,
  .path-contact .region-content #block-tara-content {
    flex: 0 0 50%;
  }
  .product-lists .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-3-2 .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-2-2 .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-3 .view-content .views-row,
  #block-tara-views-block-front-page-categories-block-2 .view-content .views-row {
    flex: 0 0 31%;
  }
  .page-node-type-exoplismos .field--name-field-product-image .field-items .field-item {
    flex: 0 0 23%;
  }
  .splitinfour .block-content .mikky-usp-block .usp-item {
    flex: 0 0 25%;
  }
}

.sliding-popup-bottom {
  transform: translateY(100%);
  animation: cookie-animation 1s linear 1.1s forwards;
}

@keyframes cookie-animation {
  100% {
    transform: translateY(0);
  }
}