@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');

:root {
	--primary: #383E42;
	--secondary: #7EC352;
	--content-width: 1300px;
}
body {
	font-family: "Raleway", sans-serif;
	font-size:20px;
	font-weight: normal;
	color:var(--primary);
	background-image:url(../images/bg_small.png),url(../images/bg_small.png);
	background-repeat:no-repeat;
	background-position: top 340px right 10%, top 60% left;
}

body.path-frontpage {
	background-position: top 640px right 10%, top 90% left;
}

body.h-100 {
	
	height:auto !important;
}

main {min-height: 800px;}

.btn-primary,
.btn-secondary {
	background-color:var(--secondary);
	border-color:var(--secondary);	
}

.btn-primary:hover,
.btn-primary:active,
.btn-secondary:hover,
.btn-secondary:active {	
	background-color:var(--primary);
	border-color:var(--primary);	
}

.dialog-off-canvas-main-canvas {
	background-image:url(../images/bg_large.png);
	background-repeat:no-repeat;
	background-position: bottom 50px left 70px;}

a {
	color:var(--primary);
	text-decoration:none;
}

a:hover,
.nav-link:hover {
	color:var(--secondary);
}

h1,h2,h3,h4,h5,h6 {
	font-weight:bold;
}

.region-content {
	padding-top:40px;
}

/* header */

.path-frontpage header {
	background-image:url(/themes/alphapatika/images/header_motiv.png), url(/themes/alphapatika/images/header_image.jpg);
	background-repeat:no-repeat;
	background-size:650px,cover;
    background-position: bottom left, center top;
}

header  nav.navbar {
	margin-top:0px;
    padding: 10px 0px;
}

.page-route-entity-flipbook-canonical header  nav.navbar {
	    margin-top: -1px;

    padding: 19px 0px;
}

.pdfcontainer {
    border: none;
}

header  nav.navbar > .container {
}

.navbar {
  position: relative;
  background-color: transparent;
  padding: 0;
}

.region-nav-branding::before {
  display: none !important;
}

.navbar::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -100vw;  
  right: calc(50vw - (var(--content-width) / 2));  
  background: var(--secondary);  
  border-top: 8px solid var(--secondary); 
  border-bottom-right-radius: 28px;  
  z-index: 1;
  display: block;
}

.path-frontpage .navbar::before {
  background: #ffffff;
}

.navbar-brand img {
	filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(119deg) brightness(105%) contrast(101%);
}

.path-frontpage .navbar-brand img {
	filter: none;
}

.navbar .container {
  position: relative;
  z-index: 5;
}

.navbar-toggler {
  position: relative;
  z-index: 6;
}

.region.region-nav-branding {
	padding-top:10px;
}

.site-logo img {
	max-width:330px;
}

#block-alphapatika-szlogen {
	max-width:1290px;
	margin:0 auto;
    height: 444px;
    display: flex;
    align-items: center;
	-webkit-filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
	filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
}

/* nav */


.navbar-nav a {
	text-transform:uppercase;
	font-size:18px;
	font-weight:bold;
}

header {
	color:#ffffff;
}

.navbar-nav .nav-item a.nav-link {
	padding-left:30px;
	padding-right:30px; 
}

.path-frontpage .navbar-nav a,
.navbar-nav a.nav-link.active,
.navbar-nav a.nav-link.active:hover,
.navbar-nav a.nav-link:hover {
	color:var(--primary);
	text-decoration:none;
}

/* footer */

footer {
	  position: relative;
  background-color: transparent;
  padding: 0;
  color:#ffffff;
  overflow:hidden;
}

footer > .container::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: -100vw;  
  left: calc(50vw - (var(--content-width) / 2));   
  background-color: var(--primary);
  color:#ffffff;
  border-top-left-radius: 40px;  
  z-index: 1;
  display: block;
}

.region-footer {
	position:relative;
	z-index:2;
	text-align:right;
	font-size:15px;
	line-height: 90px;
}

.region-footer p {
	margin:0;
	padding:0;
}

#block-alphapatika-footerbefore  {
	display:flex;
	justify-content: space-between;	
}

.region-footer-menu {
	border-top:1px solid var(--secondary);
	padding:30px 0px;
	position:relative;
}

.region-footer-menu:before {
	content:url(../images/logo_small.svg);
	position: absolute;
    right: 65px;
    top: -14px;
    background-color: #ffffff;
    padding: 0px 7px;
}

#block-alphapatika-footerbefore ul.nav {
	display:flex;
	flex-direction: row;
	font-size:16px;
}


#block-alphapatika-footerbefore img {
	max-width:289px;
	margin-left:40px;
}

#block-alphapatika-footerlogo {
}

/* content */

.region-content {
	padding-bottom:40px;
}

.field--name-title,
.block > h2,
#block-alphapatika-page-title {
	color:var(--secondary);
	font-weight:bold;
	font-size:32px;
	padding:20px 0px;
}

#block-alphapatika-udvozoljukweboldalonkon,
.path-frontpage #block-alphapatika-content,
.path-frontpage #block-alphapatika-page-title {
	 text-align:center;
}

.path-frontpage #block-alphapatika-content {
	max-width:767px;
	font-weight:600;
	font-size:20px;
    margin: 0 auto;

}

#block-alphapatika-udvozoljukweboldalonkon {
	font-size:25px;
    padding-bottom: 53px;
}

.geolocation-map-container {
	border-radius: 30px;
    margin: 8px 6px;
    width: auto !important;
}

/* slider*/

.views-field-field-patika-kep img{
	border-radius:30px;
	overflow: hidden;
}

.slick-slide .views-field-field-cim-adatok,
.view-display-id-page_1 .views-field-field-cim-adatok {
	background-color:#7EC352CC;	
	border-bottom-left-radius:30px;
	border-bottom-right-radius:30px;
	max-width:264px;
	margin:0 auto;
	font-size:19px;
	font-weight:700;
	text-align:center;
	padding: 10px 15px;
	position: absolute;
    z-index: 3000;
    bottom: 0;
    left: 0;
    right: 0;
    line-height: 25px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slick__slide:hover  .views-field-field-cim-adatok{
	background-color:#383E42CC;
}

.slick-slide .views-field-field-cim-adatok a,
.slick-slide .views-field-field-cim-adatok a:hover,
.view-display-id-page_1 .views-field-field-cim-adatok a,
.view-display-id-page_1 .views-field-field-cim-adatok a:hover {
	color:#ffffff;	
	display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;  
  overflow: hidden;
}

.slick-track img {
	margin: 0 auto;
}

.slick-slide {
	width:250px;
}

#block-alphapatika-views-block-terkep-block-1,
#block-alphapatika-views-block-patikak-block-1 {
	max-width:1100px;
	margin:0 auto;
}

#block-alphapatika-views-block-patikak-block-1 {
	padding-top:5px;
	margin-bottom:50px;
}

#block-alphapatika-views-block-patikak-block-1 .slick-arrow::before {
    color: var(--secondary);
}

nav.slick__arrow {
    width: 1210px;
    margin-left: -55px;
}

/* node */

.node__content .field--name-field-patika-kep img {
	border-radius:30px;
	margin-top:-50px;
}

.row-text-image {
	display:flex;
	gap:50px;
}

.row-text-image .field--name-body  {
	flex:1;
	text-align:justify;
	padding-top:10px;
}


.data-block .field--name-field-cim-adatok,
.data-block .field--name-field-nyitvatartas, 
.data-block .field--name-field-telefonszam,
.data-block .field--name-field-e-mail {
	background-image:url(../images/icon_map-pin.svg);
	background-repeat:no-repeat;
	background-position: left top 14px;
	line-height:34px;
	font-weight:500;
	font-size:23px;
	padding:10px 0px 10px 50px;
}

.data-block .field--name-field-nyitvatartas {
	background-image:url(../images/icon_clock.svg);
}

.data-block .field--name-field-telefonszam {
	background-image:url(../images/icon_phone.svg);
}

.data-block .field--name-field-e-mail {
	background-image:url(../images/icon_email.svg);
}

.office-hours__table {
	font-size:18px;
    width: auto;
	line-height: 23px;
	display:none;
	margin-left: 90px;
}
.office-hours__table tr {
	border:0;
}

.office-hours__table td {
	padding:0;
	border:0;
}

.office-hours__table td.office-hours__item-label {
	padding-right:10px;
}

.office-hours-status:after {
	content: '\f078'; /* f078*/
	font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free';
	font-weight: 900;
	display: inline-block;
	margin-left: 5px;
	display:none;
}
.office-hours-status {
	position:relative;
}
.office-hours-status svg {
	height:18px;
	position:absolute;
	top:10px;
	margin-left: 15px;
}

.field--name-field-terkep {
    border-radius: 30px;
    overflow: hidden;
	margin-top:50px;
	margin-bottom:80px;
}

/* map */ 
#map-search-message {
    position: absolute;
    bottom: 4px;
    font-size: 18px;
    color: #ffaaaa;
    padding-left: 20px;
}

.views-exposed-form .button:disabled {
	opacity:1;
}

.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
    background: var(--secondary);
    color: white;
	font-size:15px;
}

.leaflet-popup-content-wrapper a {
	color: white;
	text-decoration:underline;
	font-weight:bold;
}

/* webform */ 
.webform-submission-form {
	display:flex;
	gap: 50px;
}

.webform-submission-form .form-type-webform-markup  {
	flex:1;
	text-align:justify;
}

.webform-submission-form input,
.webform-submission-form textarea {
    font-size: 20px;
	max-width:600px;
}

/* search */
/* 1. Módosítjuk a fő konténert: levesszük a képet, de a színt és a formázást meghagyjuk */
.views-exposed-form {
  background: var(--primary); /* Csak a háttérszín marad itt */
  position: relative;
  border-radius: 30px;
  padding: 35px 20px;
  display: flex;
  justify-content: flex-end;
  z-index: 1; 
  overflow: hidden;   
  margin: 0px 6px;
}

/* 2. Létrehozzuk a láthatatlan háttérréteget a képnek */
.views-exposed-form::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  
  /* Ide kerül a háttérkép és annak pontos pozíciója */
  background-image: url(../images/bg_search.png);
  background-repeat: no-repeat;
  background-position: left 240px bottom;
  
  /* --- ITT TUDOD HALVÁNYÍTANI (0 és 1 között) --- */
  opacity: 0.4; /* 0.4 = 40%-os láthatóság (60%-os halványítás) */
  
  z-index: -1; /* Behelyezzük a form elemei és szövegei MÖGÉ */
  pointer-events: none; /* Biztosítja, hogy ne lehessen véletlenül "rákattintani" a képre az űrlap helyett */
}

.views-exposed-form .form-item-field-cim-adatok-value {
	color:var(--secondary);
	display:flex;
    margin: 0;
    width: 350px;
}

.views-exposed-form .form--inline {
	display:flex;
    background-color: #ffffff;
    width: fit-content;
    padding: 0;
    margin: 0;
	border-top-left-radius:30px;
	border-bottom-left-radius:30px;
    margin-right: 30px;
}

.views-exposed-form .form-item-field-cim-adatok-value label {
	white-space:nowrap;
    position: absolute;
    left: 30px;
	font-size:32px;
	font-weight:bold;
}

.views-exposed-form .form-control  {
	background-color: transparent !important;
    border: 0;
    border-radius: 30px;
	box-shadow: none;
}

.views-exposed-form .form-actions {
    margin-top: 0;
    margin-bottom: 0;
}

.views-exposed-form .button  {
  /* Szín és lekerekítés beállításai */
  background-color: var(--secondary) !important;
  border-radius: 30px !important;
  border: none !important;
  
  /* Méretezés (állítsd be a neked tetsző méretre, de legyen négyzetes a körhöz) */
  width: 70px !important;
  height: 45px !important;
  
  /* Az "Alkalmaz" szöveg teljes eltüntetése */
  color: transparent !important;
  font-size: 0 !important;
  text-indent: -9999px !important;
  
  /* Az SVG ikon berakása háttérként */
  background-image: url('../images/search.svg') !important; /* Ellenőrizd a pontos elérési utat az SVG-hez! */
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 20px 20px !important; /* Itt tudod méretezni magát az ikont a gombon belül */
  
  /* Interakciók */
  cursor: pointer !important;
  transition: background-color 0.2s ease-in-out !important;
    margin-right: -28px;
}

.views-exposed-form .button:hover {
  filter: brightness(90%) !important;
}

@media screen and (max-width:1399px) {
	#block-alphapatika-szlogen img { 
		padding:0px 20px;	
	}
	
	.path-frontpage header {
    background-size: 40%, cover;
    background-position: left bottom, center;
}
}

@media screen and (max-width:1280px) {	
	.navbar-nav .nav-item a.nav-link {
    padding-left: 15px;
    padding-right: 15px;
}

.navbar  .container {
	max-width:98%;
	margin:0 auto;
}

.navbar  .container:before, 
.navbar  .container:after {
	display:none;
}

.navbar-brand {
    float: left;
    height: auto;
	padding: 5px 0;
}

.navbar::before,
footer > .container::before {
    left: 0;
    right: 0;
    border-bottom-right-radius: 0px;
    border-top-left-radius: 0px;
} 


#block-alphapatika-views-block-patikak-block-1 {
	/*display:none;  temporary */
}
}

@media screen and (max-width:1210px) {
nav.slick__arrow {
    position: relative;
    width: 100px;
    margin:0 auto;
    margin-top: 50px;
}
.slick-slide {
    width: 230px;
    padding: 0px 8px;
}
.page-route-entity-flipbook-canonical header nav.navbar {
    padding: 10px 0px;
        margin: -1px;
}
}



@media screen and (max-width:999px) {
	
	.pdfcontainer {
    margin-top: -120px;
}
	
	body {
    background-image: url(../images/bg_small.png);
    background-position: top 120px right 10%;
}
	
	#block-alphapatika-footerbefore {
		display: block;
		text-align: center;
	}
	
	
	.path-frontpage header {
		background-size: 400px, cover;
        background-position: left bottom, right -400px bottom;
	}
	
	.views-exposed-form::before {
		background-position: left 100px top;
		background-size: contain;
	}
	
	.views-exposed-form {
		padding-top: 70px;
	}
	
	.views-exposed-form .form-item-field-cim-adatok-value,
	.views-exposed-form .form--inline {
		width: 100%;
	}
	
	.views-exposed-form .form-item-field-cim-adatok-value label {
		left: 30px;
		top: 10px;
	}
	
	.webform-submission-form,
	.row-text-image	{
		display: block;
	}
	
	.node__content .field--name-field-patika-kep img {
    margin-top: 20px;
    margin-bottom: 30px;
}
	
	#block-alphapatika-footerbefore img {
		margin-left: 0px;
	}
	
	#block-alphapatika-footerbefore ul.nav {
		justify-content: center;
		margin-top:30px;
	}
		
	.blazy.b-flexbox--md-5 > .grid {
			flex: 0 2 calc(50% - var(--bfb-col-gap));
		}
		
	.views-field-field-patika-kep {
			text-align:center;
		}
}

@media screen and (max-width:800px) {
	#block-alphapatika-footerbefore ul.nav {
		display:block;
	}
	
	#block-alphapatika-szlogen > div {
		text-align:center;
        margin-top: 260px;
	}
	
	.path-frontpage header {
        background-image: url(/themes/alphapatika/images/header_motiv.png), url(/themes/alphapatika/images/header_image.jpg);
        background-size: 300px, cover;
        background-position: left bottom, right -400px bottom;
    }
		
	#block-alphapatika-szlogen img {
		width:85%;
	}
	
}

@media screen and (max-width:700px) {
	.slick-track img {
    width:100%;
}

.view-display-id-page_1 .views-field-field-cim-adatok,
.slick-slide .views-field-field-cim-adatok,
.views-field-field-patika-kep img {
	width:100%;
	max-width:100%;
}



}

@media screen and (max-width:480px) {
.blazy.b-flexbox--md-5 > .grid {
        margin-bottom: 20px;
    }
}