/* =====================================================
   STOLOVI – CORE UI LAYER (structure & layout only)
   ===================================================== */
:root{
  --radius:6px;
  --radius-b:300px;
  --space:30px;            /* koristi se samo za .wrap na >1024px */
  --gap-s:12px;
  --gap-m:16px;
  --gap-ml: 20px;
  --gap-l:24px;
  --gap-lx: 36px;
  --gap-tb: 20px;
  --gap-link:24px;

  --fs-menu-link:2.25rem;
  --fw-menu-link:700;
  --ff-menu-link:inherit;
  --fs-logout:1rem;
  --fw-logout:600;

  /* boje se podešavaju u theme-layeru */
  --c-bg:transparent;
  --c-text:currentColor;
  --c-primary:currentColor;
  --c-muted:currentColor;
  --c-placeholder:currentColor;
}

/* ------------ RESET ------------ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{line-height:1.45;background:var(--c-bg);color:var(--c-text);}
a{color:inherit;text-decoration:none;}
.comments-area a, .page-content a { text-decoration: none; }

/* ------------ LAYOUT ------------ */
header,main,footer{padding:0;}                 /* <-- uklonjen globalni 30 px gutter */
.wrap{max-width:1024px;margin:auto;padding:0 var(--space);}   /* samo za ≥1024px */

.site-header{
  position:sticky;top:0;z-index:30;
  display:flex;justify-content:space-between;align-items:center;
}
.site-header:not(.dynamic-header){
  padding: 20px 30px;
}

.hamburger,.menu-close{
  background:none;border:0;cursor:pointer;line-height:0;color:var(--c-text);
}
h1,h2,h3,h4,h5,h6, p, span, li, input,  textarea, select {
  color:var(--c-text);
}
input::placeholder, textarea::placeholder {
  color: var(--c-placeholder);
}

h2{margin:var(--gap-l) 0;font-size:1.25rem;}
.section:first-child h2{margin-top:0;}
h3{font-size:1rem;}

ul.wp-block-list {
  list-style-position: inside;
}

/* Animacija: prvo drži element potpuno vidljiv, pa se na kraju fade + pomak */
@keyframes fadeDown {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  30% {
    opacity: 1;
    transform: translateY(80px);
  }
  100% {
    opacity: 0;
    transform: translateY(20px);
  }
}
@keyframes showDown {
  0% {
    transform: translateY(0);
  }
  30% {
    transform: translateY(60px);
  }
  100% {
    transform: translateY(80px);
  }
}

.sts-box {
    position: fixed;
    top: 0%;
    left: 4%;
    font-size: 14px;
    padding: 4px 8px !important;
    border-radius: 100px;
    background-color: var(--c-primary);
    color: #fff;
    z-index: 1;

    /* animacija: traje 4s, prvih 80% drži potpuno vidljivo, a u zadnja 20% fade + pomak */
    animation: fadeDown 4s ease forwards;
}
.sts-box.sts-no {
  background-color: #D64045;
  animation: showDown 4s ease forwards;
}




/* ------------ BUTTONS & INPUTS ------------ */
a:active, a:hover {
  color: var(--c-primary);
}
[type=button], [type=submit], button  {
  padding: 0;
}
.term-btn,.carousel-btn{
  display:inline-flex;justify-content:center;align-items:center;
  border:0;border-radius:var(--radius-b);cursor:pointer;
  transition:opacity .2s;font-size:.875rem;padding: 6px 24px;
}
.btn {
  display:inline-flex;justify-content:center;align-items:center;
  border:0;border-radius:var(--radius-b);cursor:pointer;
  font-size:16px;padding: 16px 8px;
  width: 100%;
  transition: all 0.2 ease-out;
}
.btn-primo {
  background-color: var(--c-primary);;
  color: #fff;
  transition: all 0.2 ease-out;
}
.btn-primo:disabled, .btn:disabled {
  background-color: var(--c-muted);
  cursor: not-allowed;
}
.btn:hover, .term-btn:hover { background-color: var(--c-primary-hover); color: #fff;}

.term-buttons{display:flex; justify-content: flex-start; column-gap: 8px;margin-bottom:var(--gap-l); width: 100%; }
.term-btn{flex:1;padding:6px 12px; max-width: 140px; border-radius:9999px;}

.term-btn:active,.carousel-btn:active, .btn:active {
  background-color: var(--c-primary);
  color: #fff;;
}
#glavni-popis .term-btn, .rez-wrap .term-btn {
  padding: 4px 8px;
}
h2#rez-heading {
    margin: 56px 0 12px 0;
}
/*section.rez-wrap {
    margin-top: 30px;
}*/
.outlined.term-btn, .rez-wrap .term-btn {
  background-color: transparent;
  color: var(--c-primary);
  border: 1px solid var(--c-primary);
}
button.hamburger:hover, button.menu-close:hover {
  color: var(--c-muted);
  background: transparent;
}
.info{
  display: flex;
  flex-direction: column;
  row-gap: 6px;
  align-items: flex-start;
}

input.input-date {
    width: 100%;
    padding: .75rem;
    border-radius: 8px;
    background-color: #fff;
    background-image: url(../images/Calendar.svg);
    background-position: 94% 50%;
    background-repeat: no-repeat;
    background-size: 18px;
    min-height: 56px;
    border: none;
}
.flatpickr-input{
  width:100%;
  padding:.75rem;
  border-radius:var(--radius);
  border:1px solid var(--c-placeholder);
  font-family:inherit;
  font-size:1rem;
}
/* Flatpickr injected input = .flatpickr-input */
.flatpickr-input{
  width:100%;
  padding:.75rem;
  border-radius:var(--radius);
  border:1px solid var(--c-placeholder);
  font-family:inherit;
  font-size:1rem;
}
.filter-section {
  margin-bottom: var(--gap-l);
}



/* ------------ CAROUSEL (“Danas dostupno”) ------------ */
.carousel{position:relative;}
.carousel-track{
  display:flex;gap:var(--gap-ml);overflow-x:auto;padding-bottom: 0;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
}
.carousel-track::-webkit-scrollbar{display:none;}

.carousel-btn{
  position:absolute;top:50%;transform:translateY(-50%);
  width:32px;height:32px;border-radius:50%;font-size:1.25rem;
}
.carousel-btn.prev{left:-12px;} .carousel-btn.next{right:-12px;}
/* ----------  CARD -------------------------------------------------- */
.card{
  
  overflow:hidden;                 /* da se radius primijeni i na img */
  display:flex;
  flex-direction:column;
}

/* unutar kartice: */
.card img{width:100%;aspect-ratio:1/1;object-fit:cover; border-radius: 8px;}
.card-body{padding:8px 0;display:flex;justify-content:space-between;align-items:center;}
h3.card-title{margin:0; margin-bottom:0;font-size:var(--fs-h3); font-weight: 900}
.card-price{font-weight:600; font-size: var(--fs-14);}



.today-card{max-width:130px;scroll-snap-align:start;flex:0 0 calc((100% - var(--gap-m)) / 2.75);}
@media(min-width:480px){.today-card{flex:0 0 calc((100% - var(--gap-m)) / 3);}}
@media(min-width:768px){.today-card{flex:0 0 240px;}}

/* bijela kartica oko slike + naslova + cijene */
.today-card .card{
  background:#fff;border-radius:var(--radius);
  box-shadow:0 2px 4px rgba(0,0,0,.08);overflow:hidden;
}
.today-card img{width:100%;aspect-ratio:1/1;object-fit:cover;}
.today-card .meta{
  display:flex;justify-content:space-between;align-items:center;
  padding:.75rem .85rem;font-size:14px;
}
article.card.zauzet {
    position: relative;
}
article.card.zauzet:before {
    position: absolute;
    top: 8px;
    right: 5px;
    background-color: var(--c-primary);
    color: #fff;
    font-size: 14px;
    padding: 3px 8px;
    content: "Rezervirano";
    border-radius: 50px;
}

h2#date-heading {
  margin: 48px 0 24px 0;
}

/* ------------ LIST ROW (glavni popis) ------------ */
.post-row{
  display:flex;align-items:center;gap:var(--gap-m);
  padding:1rem 0;margin-bottom:4px;
  /*border-radius:var(--radius);*/
  position: relative;
}
a.post-row:before {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 1px;
    background: #ffffffbd;
    width: 73%;
    content: "";
}
.post-row img, .post-row .stol-number{width:64px;height:64px;flex-shrink:0;border-radius:var(--radius);object-fit:cover;}
.stol-number {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 26px;
  background-color: var(--c-primary);
  color: #fff;
  font-family: var(--ff-menu-link);
}

.surface{display:inline-block;padding:.125rem .5rem;font-size:.75rem;border-radius:var(--radius);margin-top:.25rem;}
.price{margin-left:auto;font-weight:600; display: flex; flex-direction: column; align-self: start; margin-top: 2px;}

/* ------------ MOBILE MENU ------------ */
.mobile-menu{
  position:fixed;inset:0;z-index:40;background:var(--c-bg);color:var(--c-text);
  transform:translateX(100%);transition:transform .3s ease;
  overflow-y:auto;padding: 20px 30px;
}
.mobile-container {
  margin:0 auto;display:flex;flex-direction:column;justify-content: space-between;max-width: 1024px; width:100%;
}
.mobile-menu.open{transform:translateX(0);}
body.no-scroll{overflow:hidden;}

.menu-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--gap-l);}
.menu-links{list-style:none;margin-bottom:var(--gap-l);}
.menu-link{display:block;}

.contact-chips{display:flex;flex-wrap:wrap;/*gap:var(--gap-s);*/gap:6px;margin-bottom:var(--gap-lx);}
.chip{font-size:14px;padding:4px 8px;border-radius:9999px;border:1px solid var(--c-primary);}

.h4{font-size:14px;font-weight:600;margin-top:var(--gap-m);}
.payment-info{font-size:14px;margin-top:var(--gap-s); margin-bottom: 36px; line-height:1.4;}
.logout-btn, { text-align: center;display:block;width:100%;padding:1rem 0;border-radius:9999px;font-size:var(--fs-logout);font-weight:var(--fw-logout);margin-top:var(--gap-l);}
.legal{font-size:12px;margin-top:var(--gap-l);}
.thebutton { text-align: center; background-color: var(--c-primary); color: #fff; display:block;width:100%;padding:1rem 0;border-radius:9999px;font-size:var(--fs-logout);font-weight:var(--fw-logout);margin-top:var(--gap-l);}

/* ------------ SINGLE HERO (individualni stol) ------------ */
p.back-button {
    margin: 0;
    display: flex;
    position: relative;
}
.back-button a {
    margin: 0;
    position: fixed;
    right: 21px;
    top: 94px;
    width: 44px;
    height: 44px;
    z-index: 10;
    background-color: var(--c-primary);
    border-radius: 100px;
    display: flex;
    align-items: center;
    /* justify-content: center; */
}
.back-button a:hover {
  background-color: var(--c-placeholder);
}
p.back-button a svg {
    margin-left: 2px;
}
p.back-button a path {
    stroke: #fff;
}
.single-hero img{width:100%;border-radius:var(--radius);margin-bottom:var(--gap-s);}
.hero-meta{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--gap-m);flex-wrap:wrap;}
.price-block{text-align:right;}
.price{font-weight:700;}
.price-label{font-size:14px;}

.info-chips{display:flex;gap:var(--gap-s);margin-bottom:var(--gap-m);flex-wrap:wrap;}
.single-content{margin-bottom:var(--gap-l);}

/* ------------ FORME ------------ */
.form-group{display:flex;flex-direction:column;margin-bottom:var(--gap-m);}
.form-group.checkbox{flex-direction:row;gap:var(--gap-s);align-items:start;font-size:14px;}
input.form-control,select.form-control,textarea.form-control{
  width:100%;border-radius:var(--radius);
  padding: 16px;font-family:inherit;
}

textarea.form-control{min-height:80px;resize:vertical;}
/* 1) Remove the native appearance and size all checkboxes */

.login-remember {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
}
.login-remember label {
  width: auto;
  font-weight: 600;
}
label > input[type="checkbox"]{
  margin-top: 0 !important;
}
input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 16px;
  height: 16px;
  border-radius: 4px !important;
  background-color: #fff;
  vertical-align: middle;         /* align with surrounding text */
  cursor: pointer;
  position: relative;
  padding: 0;
}

/* 2) On focus, you might want an outline for accessibility */
input[type="checkbox"]:focus {
  outline: 2px solid rgba(0, 123, 255, 0.25);
  outline-offset: 2px;
}

/* 3) When checked, show your SVG checkmark */
input[type="checkbox"]:checked {
  background-image: url('../images/checkmark-trv.svg');
  background-repeat: no-repeat;
  background-position: center center;
  /* optionally adjust the size of the SVG if it’s too big: */
  background-size: 12px 12px;
  border-color: transparent;      /* hide the border if you like */
}

/* 4) Disabled state (optional) */
input[type="checkbox"]:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}


/* ------------ FOOTER ------------ */
.global-footer{text-align:center;font-size:.75rem;color:var(--c-placeholder);border-top:1px solid currentColor;margin-top:calc(var(--gap-l)*2);}



/*PROFILE*/
/* =========================================================
   PROFILE DROPDOWN
   ========================================================= */
.tsb-profile-menu {
  margin-top: 20px;
  position: relative;
  display: inline-block;
  font-family: sans-serif;
}
.tsb-profile-menu .tsb-user-name {
  cursor: pointer;
  padding: 8px 0;
  font-size: 24px;
  font-family: 'Fraunces';
  transition: background 0.2s ease;
  display: block;
  position: relative;
}
.tsb-profile-menu .tsb-user-name:before {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: var(--c-primary);
    content: "";
}

.tsb-profile-menu .tsb-user-name:hover {
  
}
.tsb-profile-menu ul {
  /*position: absolute;*/
  top: calc(100%);
  right: 0;
  
  list-style: none;
  margin: 0;
  padding: 4px 0;
  display: none;
  min-width: 160px;
  z-index: 1000;
}
.tsb-profile-menu:hover ul {
  display: block;
}
.tsb-profile-menu ul li {
  margin: 0;
}
.tsb-profile-menu ul li a {
  display: block;
  padding: 8px 0px;
  font-size: 24px;
  line-height: 1.4em;
  color: var(--c-primary);
  text-decoration: none;
  transition: background 0.2s ease;
}
.tsb-profile-menu ul li a:hover {
  background: #f0f0f0;
}
#tsb-account-section form {
    margin-bottom: 56px;
}
/*#tsb-account-section form:first-of-type{
  padding-top: 30px;
}*/
#tsb-account-section h2 {
  margin-bottom: 36px;
}
#tsb-account-profile > h2:first-of-type {
  margin-top: 0;
}

form p {
  margin-bottom: 20px;
}
form > p:last-of-type {
  margin-bottom: 0;
}
#tsb-account-section form > p {
  margin-bottom: 0;
}
#tsb-account-form button {
  margin-top: 16px;
}
.tsb-button:active {
  color: #fff;
}

/* ──────────────────────────────────────────────────────────────────────────
   Two-Step Registration Wizard (korak 1 + korak 2)
   ────────────────────────────────────────────────────────────────────────── */
/* ──────────────────────────────────────────────────────────────────────────
   Two-Step Registration Form Tweaks
   ────────────────────────────────────────────────────────────────────────── */

/* Container cards: no white background, transparent */
.intro {
  /*margin-top: 50px;*/
  margin-bottom: 36px;
  text-align: center;
  display: flex;
  flex-direction: column;
  row-gap: 24px;
}
#tsb-register-step1,
#tsb-register-step2 {
  background: transparent;
  padding: var(--gap-l);
  border-radius: var(--radius);
  max-width: 480px;
  margin: var(--gap-l) auto;
}
/* CSS */
/* Container positions the pseudo‐icon */

form.wpcf7-form.init br {
    display: none;
}
.wpcf7-acceptance span {
    font-size: 14px;
}
.wpcf7-not-valid-tip {
  margin-top: 7px;
  margin-left: 15px;
}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
  border-radius: 100px;
  text-align: center;
}
.custom-select {
  position: relative;        /* adjust as needed */
}

/* Remove native arrow, add padding for our icon */
.custom-select select {
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
}

/* Our custom arrow, via ::after on the wrapper */
.custom-select::after {
  content: "";
  position: absolute;
  top: 55%;
  right: 22px;          /* matches select’s right padding */
  transform: translateY(-50%);
  width: 1rem;           /* size of your SVG */
  height: 1rem;
  background: url("https://dev.michel.hr/trznica-vodice/wp-content/uploads/2025/07/dropdown-iconv2.svg") 
              no-repeat center center;
  pointer-events: none;  /* so clicks go through to the select */
}

/* All inputs—including selects—min-height 56px, rounded 8px */
#tsb-register-step1 input, select, input[type="email"], textarea,
#tsb-register-step2 input:not(input[type="checkbox"]),
form input[type="text"], form input[type="password"] {
  margin-top: 8px;
  min-height: 56px;
  padding: 0 1rem;
  border: none;
  border-radius: 8px;
  font-size: 1rem;
  font-family: inherit;
  transition: border .2s, box-shadow .2s;
  font-weight: 600;
}
#tsb-register-step1 input::placeholder, select::placeholder, input[type="email"]::placeholder, textarea::placeholder,
#tsb-register-step2 input:not(input[type="checkbox"])::placeholder,
form input[type="text"]::placeholder, form input[type="password"]::placeholder{
  font-weight: 400;
}
textarea {
  padding: 1rem;
}
#tsb-register-step2 input[type="checkbox"], #tsb-register-step2 input[type="radio"]{
  min-height: 0;
}
#tsb-register-step1 input:focus,
#tsb-register-step1 select:focus,
#tsb-register-step2 input:focus {
  outline: none;
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px rgba(17,87,62,.15);
}

/* Primary button (“Dalje” / “Registriraj se”): fully pill-shaped, bg #76B68A */
#tsb-register-step1 button[type="submit"],
#tsb-register-step2 button[name="tsb_do_register"],
.thForm button, .thForm input[type="submit"] {
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 9999px;
  padding: 16px 5px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s, transform .2s;
  width: 100%;
}
#tsb-register-step1 button[type="submit"]:disabled,
#tsb-register-step2 button[name="tsb_do_register"]:disabled,
.thForm button:disabled, .thForm input[type="submit"]:disabled {
  background: var(--c-muted);
  cursor: not-allowed;
}

#tsb-register-step1 button[type="submit"]:hover,
#tsb-register-step2 button[name="tsb_do_register"]:hover,
.primButton:hover {
  opacity: .9;
  transform: translateY(-1px);
}
.thForm .intro p {
	margin-bottom: 0 !important;
}
.thForm .intro img {
	width: 300px !important;
	height: auto;
	align-self: center;
	padding-bottom: 40px;
}
/* Secondary link-buttons centered with lines (“Još nemaš račun?” / “Već si domaći?”) */
.tsb-register-alt {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: var(--gap-l);
  margin-bottom: var(--gap-l);
  gap: var(--gap-s);
  font-size: .875rem;
}
.tsb-register-alt::before,
.tsb-register-alt::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--c-primary);
}
.tsb-register-alt p {
  margin-bottom: 0;
}
.tsb-register-alt a, .tsb-register-alt-a {
  display: inline-block;
  padding: 16px 5px;
  border: 1px solid var(--c-primary);
  border-radius: 9999px;
  color: var(--c-primary);
  text-decoration: none;
  white-space: nowrap;
  transition: background .2s, color .2s;
  text-align: center;
  width: 100%;
}
.tsb-register-alt a:hover, .tsb-register-alt-a:hover {
  background: var(--c-primary);
  color: #fff;
}

/* “Or” text between lines */
.tsb-register-alt span {
  padding: 0 .5rem;
  color: var(--c-primary);
}

/* “Povratak” outline button */
#tsb-register-step2 button[type="button"] {
  background: transparent;
  color: var(--c-primary);
  border: 1px solid var(--c-primary);
  border-radius: 9999px;
  padding: .5rem 1.5rem;
  font-size: 1rem;
  cursor: pointer;
  transition: background .2s, color .2s;
}
#tsb-register-step2 button[type="button"]:hover {
  background: var(--c-primary);
  color: #fff;
}
#tsb-register-step2 p label > a {
  font-weight: 600;
}

/* Password toggle text */
.toggle-password {
  margin-left: .5rem;
  font-size: .875rem;
  color: var(--c-muted);
  cursor: pointer;
  user-select: none;
  position: absolute;
  bottom: 17px;
  right: 16px;
}

/* Error messages */
.error {
  background: none;
  color: #BD2619;
  /*margin-bottom: var(--gap-m);*/
  margin-bottom: 0;
  font-size: .875rem;
  font-weight: 600;
}

#tsb-register-step1 > p,
#tsb-register-step2 > p {
    display: flex;
    column-gap: 8px;
}





/*
Single stolovi post page template
*/
.single-stol-container {
  padding: 30px 30px 0 30px;
  max-width: 1024px;
  margin: 0 auto;
}
main#content {
  padding: 0;
  min-height: 76vh;
}
main#content, .single-stol-container {
    background-image: url('../images/bg-main.svg');
    background-repeat: repeat-y;
    background-position: top right;
    background-size: 280px;
    background-attachment: fixed;
}
/*main#content .page-content > section {
  padding: 0 30px;
}
main#content .page-content > section.offsetdiv {
  padding: 0 0 0 30px;
}*/
.thForm {
    max-width: 480px;
    margin: 0 auto;
}
.single-sveinfo {
  width: 100%;
}


/* QUICK FIXEVI */

form label {
    width: 100%;
    line-height: normal;
    position: relative;
}
form .wpcf7-list-item label {
  margin-top: 0;
}

.page-header {
    display: none !important;
}
.menu ul {
    list-style: none;
}
.menu li a, .page_item a, .menu-item a{
    font-size: 36px;
    font-family: 'Fraunces';
    line-height: normal;
}


.page-content > * {
    /*padding: 10px 30px;*/
	padding: 0 24px;
}
main#content .page-content > section.section.today-sec {
    /*padding: 15px 0 0 30px;*/
}

/* assets/css/style.css */
.card[hidden] { display:none !important; }
.term-btn.active { background:#0d9488;color:#fff; }

@media(min-width:576px) {
  .page-header .entry-title,
  .site-footer .footer-inner,
  .site-footer:not(.dynamic-footer),
  .site-header .header-inner,
  .site-header:not(.dynamic-header),
  body:not([class*=elementor-page-]) .site-main {
    max-width:100%;
  }
}
@media screen and (min-width: 730px){
  .page-header .entry-title, .site-footer .footer-inner, .site-footer:not(.dynamic-footer), .site-header .header-inner, .site-header:not(.dynamic-header), body:not([class*=elementor-page-]) .site-main {
    max-width: 1024px; 
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  main#content .page-content > section.section.today-sec {
    /*padding: 15px 30px 0;*/
	  /*padding: 30px 30px 0;*/
  }
  .carousel-track {
    flex-wrap: wrap;
  }
  input.input-date {
      background-position: 98% 50%;
  }
}
@media screen and (min-width: 1100px){
  .single-stol-container {
    padding: 30px 0;
  }
  main#content, .single-stol-container {
    background-image: none;
  }
  main#content .page-content > section.section.today-sec {
    padding-left: 0;
    padding-right: 0;
  }
  main#content .page-content > section {
      padding-left: 0;
      padding-right: 0;
  }

  section.single-hero {
      display: flex;
      column-gap: 2rem;
  }
  .single-featured-image {
      flex: 0 0 50%;
  }
  .back-button a {
    position: absolute;
    right: 0;
    top: 0;
    left: -60px;
  }


}





/* zaboravljena lozinka