:root{
	--bg:#f6f7f9;
	--card:#ffffff;
	--accent:#007a4d;
	--accent-soft:#e8f4ef;
	--muted:#68707a;
	--border:#e5e7eb;
}

html,body{
	height:100%;
	margin:0;
	padding:0;
	background:var(--bg);
	font-family:'Poppins', sans-serif;
	color:#1f2937;
}

/* ====== HEADER BASE (ESCRITORIO) ====== */
.header.navbarContainer {
  width: 100%;
  background-color: white;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  padding: 15px 25px; /* Aumenta espacio vertical */
  height: auto; /* Se ajusta al contenido */
  display: flex;
  justify-content: center;
}

.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: auto; /* <-- muy importante */
  transition: height 0.3s;
  overflow: visible !important;
}


.navbar.fixed {
  transition: none !important;
  height: auto !important;
}

/* Logo */
.logo-container {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
}

/* Menú */
.menu-container {
    flex: 1;
    display: flex;
    justify-content: flex-start; /* todo a la derecha */
    align-items: center;
	flex-direction: row-reverse;
    gap: 120px;
    padding-right: 50px;
    position: static;
}



.menu-toggle {
  display: none;
  background: transparent;
  border: none;
  cursor: pointer;
  margin-right: 25px;
  padding: 0;
}

.menu-toggle img.menu-icon {
  width: 70%;
  height: 70%;
  filter: brightness(0); /* negro */
  transition: filter 0.3s;
}

/* Cambia color al pasar el mouse (opcional) */
.menu-toggle:hover img.menu-icon {
  filter: brightness(0.3);
}



/* Dropdown */
.dropdown-li {
    position: relative;
}

.dropdown-content {
    display: none;
    position: absolute;
    right: 0;
    background-color: white;
    min-width: 180px;
    box-shadow: 0px 8px 16px rgba(0,0,0,0.2);
    z-index: 1000;
    border-radius: 4px;
    margin-top: 5px;
    overflow: hidden;
}

.dropdown-li:hover .dropdown-content {
    display: block;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    background-color: white;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.dropdown-content a:hover {
    background-color: rgb(0,136,68);
    color: white;
}

ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    /*background-color: white;*/
}

/* Enlaces generales */
.navbarA {
    text-align: center;
    font-size: 16px;
    text-decoration: none;
    color: rgb(0, 0, 0);
}

.navbarA:visited,
.navbarA:active,
.navbarA:focus {
    color: rgb(0, 0, 0);
}

.navbarA#tienda:hover,
.navbarA#inicio:hover {
    color: #008844;
    border-bottom: 2px solid #008844;
    transition: all 0.1s ease;
}

/* CONTENEDOR PRINCIPAL */
main{
	display:flex;
	justify-content:center;
	padding:56px 16px;
}

/* TARJETA */
.terms-wrapper{
	max-width:900px;
	width:100%;
	background:var(--card);
	border-radius:14px;
	box-shadow:0 15px 40px rgba(0,0,0,.08);
	padding:48px 52px;
	border:1px solid var(--border);
}

/* TÍTULO */
.terms-wrapper h1{
	font-size:32px;
	margin:0 0 6px;
	color:var(--accent);
	font-weight:700;
	text-align:center;
	letter-spacing:.3px;
}

/* META */
.terms-meta{
	color:var(--muted);
	font-size:13px;
	margin-bottom:32px;
	text-align:center;
}

/* CONTENIDO */
.terms-content{
	white-space:pre-line;
	font-size:15.5px;
	line-height:1.85;
	color:#374151;
	max-width:760px;
	margin:0 auto;
	text-align:justify;
}

/* PÁRRAFOS */
.terms-content p{
	margin-bottom:16px;
}

/* TÍTULOS DE SECCIÓN (1., 2., Política, etc.) */
.terms-content h2{
	font-size:18px;
	margin:32px 0 12px;
	color:var(--accent);
	font-weight:600;
	border-left:4px solid var(--accent);
	padding-left:12px;
}

/* SUBSECCIONES */
.terms-content h3{
	font-size:16px;
	margin:24px 0 8px;
	font-weight:600;
	color:#111827;
}

/* LISTAS */
.terms-content ul{
	margin:12px 0 20px 20px;
	padding-left:14px;
}

.terms-content li{
	margin-bottom:8px;
}

/* RESALTADOS */
.terms-content strong,
.terms-content b{
	font-weight:600;
	color:#111827;
}

/* BLOQUES IMPORTANTES */
.terms-content .highlight{
	background:var(--accent-soft);
	border-left:4px solid var(--accent);
	padding:16px 18px;
	border-radius:8px;
	margin:24px 0;
}

/* LINKS */
.terms-content a{
	color:var(--accent);
	text-decoration:none;
	font-weight:500;
}

.terms-content a:hover{
	text-decoration:underline;
}
/* ====== MEDIA QUERY ≤1024px (TABLET / PORTÁTIL PEQUEÑA) ====== */
@media (max-width: 1100px) {
    .menu-toggle {
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1001;
  }

    .navbar {
        height: 10vh;
        flex-wrap: nowrap;
        justify-content: space-between;
        padding: 0 20px;
    }

    .menu-container {
    position: fixed;
    top: 10vh; 
    left: 0;
    width: 100%;
    background-color: white;
    flex-direction: column;
    align-items: center;
    padding: 0;
    max-height: 0;
    overflow: hidden;
    
    z-index: 999;
    border-top: none;
}


    .menu-container.show {
        max-height: 500px; 
        transition: 1s;
    }

    .menu-container li {
        width: 100%;
        text-align: center;
        padding: 10px 0;
        border-bottom: 1px solid #f0f0f0;
        float: none;
    }

    .dropdown-content {
        position: static;
        display: none !important;
        box-shadow: none;
        background-color: #f9f9f9;
    }

    .dropdown-li.active .dropdown-content {
        display: block !important;
    }

    .dropdown-content a {
        text-align: center;
    }
}

@media (max-width: 600px) {
    .navbar{
        display: flex;
        height: auto;
    }
    
    .menu-toggle {
        display: flex !important;
    }
    
    .menu-container {
        position: fixed;
        top: 7vh;
        left: 0;
        width: 100%;
        flex-direction: column;
        background-color: white;
        padding: 0;
        max-height: 0;
        overflow-y: auto;
        transition: max-height 0.3s ease;
        z-index: 998;
    }
    
    .menu-container.show {
        max-height: calc(100vh - 10vh);
    }
    
    .menu-container li {
        float: none;
        padding: 15px 20px;
        border-bottom: 1px solid #f0f0f0;
        width: 100%;
    }

    .logo-container {
    gap: 10px; /* menos espacio entre logos */
    }

    .logo-container img {
        width: 90px; /* antes era, por ejemplo, 130px */
        height: auto;
    }

    /* Si quieres aún más control individual */
    .logo-container .logoFrij {
        width: 80%;
    }

    .logo-container .logoCroq {
        width: 80%;
    }
    
    .hidden {
        display: none !important;
    }

/* MÓVIL */
@media(max-width:600px){
	.terms-wrapper{
		padding:28px 20px;
	}
	.terms-wrapper h1{
		font-size:24px;
	}
	.terms-content{
		font-size:15px;
		line-height:1.75;
	}
}

/* IMPRESIÓN */
@media print{
	body{ background:white }
	.terms-wrapper{
		box-shadow:none;
		border:none;
		padding:0;
	}
}
}