:root{
  --navy:#0a2540;
  --green:#14845f;
  --bg:#f4f7fa;
  --text:#17263a;
  --muted:#64748b;
  --line:#e2e8f0;
  --red:#b42318;
  --blue:#1d4ed8;
  --amber:#a16207
}

*{
  box-sizing:border-box
}

html{
  scroll-behavior:smooth
}

body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.55
}

.container{
  width:min(1180px,90%);
  margin:auto
}

.topbar{
  background:var(--navy);
  color:#fff;
  position:sticky;
  top:0;
  z-index:10
}

.nav{
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px
}

.brand{
  color:#fff;
  text-decoration:none;
  font-weight:800
}

.nav nav,
.nav-actions{
  display:flex;
  gap:20px;
  align-items:center
}

.nav nav a{
  color:#fff;
  text-decoration:none;
  font-weight:600
}

.hero{
  min-height:520px;
  background:
    linear-gradient(
      110deg,
      #071c31 0%,
      #123b5a 100%
    );
  color:#fff;
  display:flex;
  align-items:center
}

.hero-inner{
  padding:70px 0;
  max-width:850px
}

.eyebrow{
  display:inline-block;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  background:#14845f;
  padding:7px 12px;
  border-radius:99px
}

.eyebrow.green{
  background:transparent;
  color:var(--green);
  padding:0
}

.eyebrow.red{
  background:transparent;
  color:var(--red);
  padding:0
}

.eyebrow.blue{
  background:transparent;
  color:var(--blue);
  padding:0
}

.hero h1{
  font-size:clamp(38px,6vw,64px);
  line-height:1.05;
  margin:20px 0
}

.hero h1 span{
  color:#75dfb7
}

.hero p{
  max-width:760px;
  color:#dbe7f0;
  font-size:18px
}

.hero-actions,
.form-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:28px
}

.button{
  display:inline-block;
  border:0;
  border-radius:9px;
  padding:13px 20px;
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
  font-size:14px
}

.button:disabled{
  opacity:.55;
  cursor:not-allowed
}

.primary{
  background:var(--green);
  color:#fff
}

.light{
  background:#fff;
  color:var(--navy)
}

.dark{
  background:var(--navy);
  color:#fff
}

.danger{
  background:var(--red);
  color:#fff
}

.expense-button{
  background:var(--red);
  color:#fff
}

.ghost{
  background:#fff;
  color:var(--text);
  border:1px solid var(--line)
}

.small{
  padding:9px 13px
}

.full{
  width:100%
}

.stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  padding:45px 0
}

.stat{
  background:#fff;
  border:1px solid var(--line);
  border-radius:15px;
  padding:25px;
  box-shadow:
    0 8px 25px
    rgba(15,23,42,.05)
}

.stat span{
  display:block;
  color:var(--muted);
  margin-bottom:7px
}

.stat strong{
  font-size:28px
}

.stat.accent{
  background:var(--green);
  color:#fff
}

.stat.accent span{
  color:#d9f6e9
}

.stat.expense{
  border-color:#fecaca
}

.stat.expense strong{
  color:var(--red)
}

.section{
  padding:70px 0
}

.section.white{
  background:#fff
}

.section-head{
  max-width:780px;
  margin-bottom:30px
}

.section-head h2{
  font-size:36px;
  margin:7px 0
}

.section-head p{
  color:var(--muted)
}

.bank-card,
.panel{
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:30px;
  box-shadow:
    0 8px 25px
    rgba(15,23,42,.05)
}

.expense-panel{
  border-color:#fecaca
}

.bank-card{
  max-width:760px;
  background:#f8fafc
}

.bank-card>div{
  display:flex;
  justify-content:space-between;
  gap:25px;
  padding:16px 0;
  border-bottom:1px solid var(--line)
}

.bank-card span{
  color:var(--muted)
}

.bank-card strong{
  text-align:right
}

.bank-card .button{
  margin-top:22px
}

.tools{
  display:flex;
  gap:12px;
  margin-bottom:18px
}

.tools input,
.tools select,
.form-grid input,
.login-card input{
  border:1px solid #cfd8e3;
  border-radius:9px;
  padding:13px 14px;
  font-size:15px;
  background:#fff
}

.tools input{
  flex:1
}

.tools select{
  min-width:200px
}

.table-wrap{
  overflow:auto;
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px
}

table{
  width:100%;
  border-collapse:collapse;
  min-width:760px
}

th,
td{
  text-align:left;
  padding:15px 17px;
  border-bottom:1px solid var(--line)
}

thead{
  background:var(--navy);
  color:#fff
}

.expense-head{
  background:#7f1d1d
}

.amount{
  color:#078151;
  font-weight:800
}

.expense-amount{
  color:var(--red);
  font-weight:800
}

.empty{
  text-align:center;
  background:#fff;
  padding:28px;
  border-radius:12px;
  color:var(--muted)
}

footer{
  background:#071c31;
  color:#cbd5e1;
  padding:32px 0;
  text-align:center
}

.login-page{
  min-height:100vh;
  display:grid;
  place-items:center;
  background:
    linear-gradient(
      135deg,
      #071c31,
      #164766
    );
  padding:20px
}

.login-card{
  width:min(440px,100%);
  background:#fff;
  border-radius:20px;
  padding:40px;
  box-shadow:
    0 25px 70px
    rgba(0,0,0,.25)
}

.login-card h1{
  margin-bottom:5px
}

.login-card>p{
  color:var(--muted);
  margin-bottom:25px
}

.login-card label,
.form-grid label{
  display:flex;
  flex-direction:column;
  gap:7px;
  font-weight:700;
  margin-bottom:17px
}

.lock{
  font-size:30px
}

.error{
  color:var(--red)!important
}

.back{
  display:block;
  text-align:center;
  margin-top:20px;
  color:var(--muted);
  text-decoration:none
}

.admin-main{
  padding:40px 0 70px
}

.admin-stats{
  grid-template-columns:repeat(4,1fr);
  padding:0 0 25px
}

.panel{
  margin-bottom:25px
}

.form-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px
}

.form-grid .wide{
  grid-column:1/-1
}

.form-grid input[readonly]{
  background:#eef2f6;
  color:#475569
}

.privacy{
  border:1px solid var(--line);
  border-radius:12px;
  background:#f8fafc;
  padding:20px;
  margin-top:10px
}

.privacy legend{
  font-weight:800
}

.privacy label{
  display:flex;
  gap:10px;
  background:#fff;
  border-radius:9px;
  padding:13px;
  margin:10px 0
}

.privacy label span{
  display:flex;
  flex-direction:column
}

.privacy small{
  color:var(--muted)
}

.message{
  min-height:22px;
  color:var(--muted)
}

.status{
  display:inline-block;
  border-radius:99px;
  padding:5px 9px;
  font-size:12px;
  font-weight:800
}

.status.public{
  background:#dcfce7;
  color:#166534
}

.status.anonymous{
  background:#eef2f6;
  color:#475569
}

.status.warning{
  background:#fef3c7;
  color:#92400e
}

.actions{
  white-space:nowrap
}

.mini{
  border:0;
  border-radius:7px;
  padding:8px 10px;
  font-weight:700;
  cursor:pointer
}

.mini.edit{
  background:#e7f0ff;
  color:#174f94
}

.mini.delete{
  background:#fee2e2;
  color:#991b1b
}

/* PDF */

.pdf-upload-box{
  border:2px dashed #cbd5e1;
  background:#f8fafc;
  border-radius:14px;
  padding:30px;
  display:flex;
  flex-direction:column;
  gap:15px;
  align-items:flex-start
}

.pdf-upload-box input[type="file"]{
  width:100%;
  padding:12px;
  background:#fff;
  border:1px solid #d7dee8;
  border-radius:8px
}

.pdf-preview{
  margin-top:24px;
  border:1px solid #b8decf;
  background:#fbfffd;
  border-radius:16px;
  padding:28px
}

.preview-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:24px
}

.preview-heading h3{
  margin:6px 0 0;
  font-size:26px
}

@media(max-width:900px){
  .admin-stats,
  .stats{
    grid-template-columns:repeat(2,1fr)
  }

  .nav nav{
    display:none
  }
}

@media(max-width:800px){
  .form-grid{
    grid-template-columns:1fr
  }

  .form-grid .wide{
    grid-column:auto
  }

  .tools{
    flex-direction:column
  }

  .tools select{
    width:100%
  }

  .bank-card>div{
    flex-direction:column
  }

  .bank-card strong{
    text-align:left
  }
}

@media(max-width:520px){
  .stats,
  .admin-stats{
    grid-template-columns:1fr
  }

  .nav-actions{
    gap:6px
  }

  .section-head h2{
    font-size:30px
  }

  .login-card,
  .panel,
  .pdf-preview{
    padding:22px
  }

  .preview-heading{
    flex-direction:column
  }
}


/* MODERNIJA VERZIJA — vizualne izmjene bez promjene funkcija */
body{background:radial-gradient(circle at top right,rgba(20,132,95,.06),transparent 34rem),var(--bg)}
.topbar{background:rgba(7,28,49,.96);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08)}
.brand{letter-spacing:.02em}.nav nav a{opacity:.86;transition:opacity .2s ease,transform .2s ease}.nav nav a:hover{opacity:1;transform:translateY(-1px)}
.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 80% 18%,rgba(117,223,183,.18),transparent 22rem),linear-gradient(120deg,#06192d 0%,#0b2e4d 52%,#135b57 145%)}
.hero::after{content:"";position:absolute;width:440px;height:440px;right:-120px;bottom:-220px;border-radius:50%;border:1px solid rgba(255,255,255,.10);box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.018);pointer-events:none}
.hero-inner{position:relative;z-index:1}.hero-copy{max-width:900px}.hero-lead{font-size:20px!important;line-height:1.65;max-width:780px!important}
.hero-trust{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.hero-trust span{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);border-radius:999px;padding:8px 13px;color:#e8f6f1;font-size:14px;font-weight:700}
.button{transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease}.button:hover{transform:translateY(-2px)}.button.primary{box-shadow:0 10px 24px rgba(20,132,95,.22)}
.stats{position:relative;z-index:2;margin-top:-22px}.stat{border:1px solid rgba(226,232,240,.85);box-shadow:0 14px 35px rgba(15,23,42,.07)}.stat strong{letter-spacing:-.03em}
.section{padding:82px 0}.section-head h2{letter-spacing:-.03em}
.modern-bank-card{max-width:900px;padding:0;overflow:hidden;background:#fff;border:1px solid #dfe7ee;box-shadow:0 20px 55px rgba(15,23,42,.08)}
.modern-bank-card .bank-row-modern{padding:19px 26px;background:#fff}.modern-bank-card .bank-row-modern:nth-child(2){background:#f8fbfa}.bank-label{font-size:13px;font-weight:800;letter-spacing:.055em;text-transform:uppercase}
.visibility-guide{display:grid;grid-template-columns:42px 1fr;gap:16px;padding:26px;background:linear-gradient(135deg,#f1fbf7 0%,#f8fbff 100%);border-top:1px solid #dcebe4;border-bottom:1px solid #dcebe4}
.visibility-guide-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:900;font-family:Georgia,serif;font-size:20px;box-shadow:0 8px 20px rgba(20,132,95,.22)}
.visibility-guide h3{margin:0 0 8px;font-size:21px;letter-spacing:-.02em}.visibility-guide>div>p{margin:0 0 18px;color:#526274}
.visibility-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.visibility-option{display:flex;gap:13px;align-items:flex-start;padding:16px;border:1px solid #dce8e2;border-radius:14px;background:rgba(255,255,255,.88)}
.visibility-option strong{display:block;margin-bottom:5px}.visibility-option p{margin:0 0 6px;color:#536273;font-size:14px}.visibility-option small{display:block;color:#7a8795;line-height:1.5}.visibility-option code{padding:3px 7px;border-radius:6px;background:#eef3f6;color:#233447;font-family:Consolas,monospace;font-size:13px;white-space:normal}
.visibility-badge{flex:0 0 auto;border-radius:999px;padding:5px 8px;font-size:10px;font-weight:900;letter-spacing:.05em}.public-badge{background:#dcfce7;color:#166534}.anonymous-badge{background:#e8edf3;color:#475569}
.visibility-note{margin:16px 0 0!important;padding-top:14px;border-top:1px dashed #cbd8d2;font-size:13px;color:#64748b!important}.copy-iban-modern{margin:22px 26px 26px!important}
.table-wrap{border:1px solid #e0e7ee;box-shadow:0 10px 30px rgba(15,23,42,.045)}thead{background:linear-gradient(90deg,#08243f,#103b5e)}.expense-head{background:linear-gradient(90deg,#651919,#8f2525)}tbody tr{transition:background .15s ease}tbody tr:hover{background:#f8fbfa}
.reset-password-button{width:100%;margin-top:12px;padding:12px;border:none;background:transparent;color:#14845f;font-size:14px;font-weight:700;cursor:pointer}.reset-password-button:hover{text-decoration:underline}.reset-password-button:disabled{opacity:.6;cursor:not-allowed}.reset-message{margin-top:14px;color:#166534;font-size:14px;line-height:1.5}
@media(max-width:760px){.visibility-options{grid-template-columns:1fr}.visibility-guide{grid-template-columns:1fr}.visibility-guide-icon{margin-bottom:2px}.stats{margin-top:0}}
/* =========================================================
   DODATAK: ROTIRAJUĆE ZAHVALE + KONTAKT FORMA
   Zalijepiti na KRAJ postojećeg style.css
   ========================================================= */

.donor-showcase{
  padding:0 0 34px;
}

.donor-showcase-card{
  position:relative;
  overflow:hidden;
  border-radius:22px;
  padding:28px 32px;
  background:
    radial-gradient(circle at 95% 5%,rgba(117,223,183,.24),transparent 18rem),
    linear-gradient(120deg,#071c31 0%,#0f3a55 65%,#11634f 145%);
  color:#fff;
  box-shadow:0 18px 45px rgba(15,23,42,.14);
}

.donor-showcase-label{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:18px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.10em;
  color:#ccefe0;
}

.donor-live-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#75dfb7;
  box-shadow:0 0 0 5px rgba(117,223,183,.12);
}

.donor-showcase-content{
  display:flex;
  align-items:center;
  gap:22px;
  min-height:110px;
}

.donor-heart{
  flex:0 0 auto;
  width:76px;
  height:76px;
  border-radius:22px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
  font-size:34px;
  color:#75dfb7;
}

.donor-showcase-text{
  min-width:0;
}

.donor-counter{
  display:block;
  margin-bottom:3px;
  font-size:13px;
  color:#bdd1df;
}

.donor-showcase h2{
  margin:0 0 5px;
  font-size:clamp(25px,4vw,38px);
  letter-spacing:-.025em;
}

.donor-showcase p{
  margin:0;
  color:#d9e7ef;
  font-size:16px;
}

.donor-change{
  animation:donorFade .55s ease;
}

@keyframes donorFade{
  from{
    opacity:.18;
    transform:translateY(7px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}


/* Kontakt */

.contact-section{
  background:
    radial-gradient(circle at 10% 10%,rgba(20,132,95,.08),transparent 22rem),
    #f7f9fb;
}

.contact-layout{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:44px;
  align-items:start;
}

.contact-intro h2{
  margin:10px 0 12px;
  font-size:clamp(34px,4vw,48px);
  letter-spacing:-.035em;
}

.contact-intro>p{
  color:var(--muted);
  font-size:17px;
}

.thank-you-info{
  display:grid;
  grid-template-columns:54px 1fr;
  gap:16px;
  margin-top:30px;
  padding:22px;
  border:1px solid #d7e9e1;
  border-radius:17px;
  background:#fff;
  box-shadow:0 10px 30px rgba(15,23,42,.045);
}

.thank-you-icon{
  width:52px;
  height:52px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:#e5f7ef;
  color:var(--green);
  font-size:25px;
}

.thank-you-info h3{
  margin:1px 0 8px;
  font-size:20px;
}

.thank-you-info p{
  margin:0;
  color:#526274;
}

.contact-note{
  margin-top:13px!important;
  padding-top:13px;
  border-top:1px dashed #d7e2dd;
  font-size:13px;
  color:#718096!important;
}

.contact-card{
  padding:28px;
  border:1px solid #e0e7ee;
  border-radius:20px;
  background:#fff;
  box-shadow:0 18px 50px rgba(15,23,42,.07);
}

.contact-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.contact-form-grid label{
  display:flex;
  flex-direction:column;
  gap:7px;
  font-weight:800;
}

.contact-form-grid .contact-wide{
  grid-column:1/-1;
}

.contact-form-grid input,
.contact-form-grid textarea{
  width:100%;
  border:1px solid #ccd7e1;
  border-radius:11px;
  padding:13px 14px;
  background:#fff;
  color:var(--text);
  font:inherit;
  font-weight:400;
  outline:none;
  transition:border-color .18s ease,box-shadow .18s ease;
}

.contact-form-grid textarea{
  resize:vertical;
  min-height:145px;
}

.contact-form-grid input:focus,
.contact-form-grid textarea:focus{
  border-color:#67af94;
  box-shadow:0 0 0 4px rgba(20,132,95,.10);
}

.thank-checkbox{
  display:flex;
  align-items:flex-start;
  gap:11px;
  margin:19px 0;
  padding:15px;
  border:1px solid #dde7e2;
  border-radius:12px;
  background:#f8fbfa;
  cursor:pointer;
}

.thank-checkbox input{
  margin-top:4px;
}

.thank-checkbox span{
  display:flex;
  flex-direction:column;
}

.thank-checkbox small{
  margin-top:2px;
  color:var(--muted);
  font-weight:400;
}

.contact-submit{
  width:100%;
}

.contact-status{
  min-height:24px;
  margin:14px 0 0;
  font-size:14px;
  font-weight:700;
}

.contact-status.success{
  color:#166534;
}

.contact-status.error{
  color:#b42318;
}

.website-field{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  opacity:0!important;
  pointer-events:none!important;
}

@media(max-width:820px){
  .contact-layout{
    grid-template-columns:1fr;
    gap:28px;
  }

  .contact-form-grid{
    grid-template-columns:1fr;
  }

  .contact-form-grid .contact-wide{
    grid-column:auto;
  }
}

@media(max-width:580px){
  .donor-showcase-card{
    padding:23px 20px;
  }

  .donor-showcase-content{
    align-items:flex-start;
  }

  .donor-heart{
    width:55px;
    height:55px;
    border-radius:16px;
    font-size:25px;
  }

  .thank-you-info{
    grid-template-columns:1fr;
  }

  .contact-card{
    padding:21px;
  }
}

/* =========================================================
   ADMIN PANEL — KOMPLETAN MODERNI IZGLED
   ========================================================= */

.admin-page{
  background:#eef3f7;
}

.admin-page .topbar{
  position:sticky;
  top:0;
  z-index:100;
  box-shadow:0 4px 20px rgba(7,28,49,.12);
}

.admin-dashboard-main{
  padding:0;
}

.admin-shell{
  width:min(1500px,96%);
  margin:28px auto 70px;
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  gap:26px;
  align-items:start;
}

.admin-sidebar{
  position:sticky;
  top:98px;
  min-height:calc(100vh - 126px);
  padding:22px 16px;
  border-radius:20px;
  background:linear-gradient(180deg,#071c31 0%,#0a2946 100%);
  color:#fff;
  box-shadow:0 18px 45px rgba(7,28,49,.16);
  display:flex;
  flex-direction:column;
}

.admin-sidebar-title{
  padding:4px 10px 20px;
  margin-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.10);
}

.admin-sidebar-kicker{
  display:block;
  margin-bottom:4px;
  color:#75dfb7;
  font-size:10px;
  font-weight:900;
  letter-spacing:.13em;
}

.admin-sidebar-title strong{
  display:block;
  font-size:19px;
  line-height:1.25;
}

.admin-side-nav{
  display:flex;
  flex-direction:column;
  gap:7px;
  padding-top:10px;
}

.admin-nav-item{
  width:100%;
  min-height:48px;
  border:0;
  border-radius:12px;
  padding:10px 12px;
  display:flex;
  align-items:center;
  gap:11px;
  background:transparent;
  color:#dce8f2;
  font:inherit;
  font-size:14px;
  font-weight:750;
  text-align:left;
  cursor:pointer;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}

.admin-nav-item>span{
  width:28px;
  height:28px;
  flex:0 0 28px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:13px;
  font-weight:900;
}

.admin-nav-item:hover{
  background:rgba(255,255,255,.08);
  color:#fff;
  transform:translateX(2px);
}

.admin-nav-item.active{
  background:#14845f;
  color:#fff;
  box-shadow:0 8px 22px rgba(20,132,95,.24);
}

.admin-nav-item.active>span{
  background:rgba(255,255,255,.15);
}

.admin-nav-message{
  position:relative;
}

.admin-nav-badge{
  margin-left:auto;
  min-width:23px;
  height:23px;
  padding:0 7px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#ef4444;
  color:#fff;
  font-size:11px;
  line-height:1;
}

.admin-sidebar-footer{
  margin-top:auto;
  padding:20px 10px 4px;
  border-top:1px solid rgba(255,255,255,.10);
}

.admin-sidebar-footer a{
  color:#bcd0df;
  text-decoration:none;
  font-size:13px;
  font-weight:700;
}

.admin-sidebar-footer a:hover{
  color:#fff;
}

.admin-workspace{
  min-width:0;
}

.admin-view{
  display:none;
}

.admin-view.active{
  display:block;
}

.admin-workspace .admin-stats{
  display:none;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  padding:0;
  margin:0 0 22px;
}

.admin-workspace .admin-stats.active{
  display:grid;
}

.admin-workspace .stat{
  min-height:145px;
  padding:23px;
  border-radius:18px;
  box-shadow:0 12px 32px rgba(15,23,42,.06);
}

.admin-workspace .stat strong{
  font-size:clamp(24px,2.2vw,32px);
}

.admin-overview-extra.active{
  display:block;
}

.admin-overview-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:15px;
  margin-bottom:24px;
}

.admin-overview-card{
  min-width:0;
  border:1px solid #dfe7ee;
  border-radius:17px;
  padding:19px;
  background:#fff;
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:13px;
  align-items:start;
  color:var(--text);
  text-align:left;
  font:inherit;
  cursor:pointer;
  box-shadow:0 8px 25px rgba(15,23,42,.045);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

.admin-overview-card:hover{
  transform:translateY(-3px);
  border-color:#b9d7ca;
  box-shadow:0 14px 34px rgba(15,23,42,.08);
}

.admin-overview-icon{
  width:42px;
  height:42px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:#e9f6f1;
  color:#0f7253;
  font-weight:900;
}

.admin-overview-card small{
  display:block;
  margin-bottom:4px;
  color:#718096;
  font-size:10px;
  font-weight:900;
  letter-spacing:.09em;
}

.admin-overview-card strong{
  display:block;
  color:#10243a;
  font-size:15px;
}

.admin-overview-card p{
  margin:5px 0 0;
  color:#64748b;
  font-size:13px;
  line-height:1.45;
}

.admin-workspace>.panel{
  margin:0;
  padding:32px;
  border-radius:20px;
  box-shadow:0 12px 34px rgba(15,23,42,.055);
}

.admin-workspace .section-head{
  margin-bottom:28px;
}

.admin-workspace .section-head h2{
  margin:7px 0;
  font-size:clamp(27px,3vw,38px);
}

.admin-workspace .form-grid input,
.admin-workspace .form-grid select,
.admin-workspace .form-grid textarea{
  width:100%;
  min-height:48px;
  border:1px solid #ccd7e1;
  border-radius:11px;
  padding:12px 14px;
  background:#fff;
  color:var(--text);
  font:inherit;
  outline:none;
  transition:border-color .18s ease,box-shadow .18s ease;
}

.admin-workspace .form-grid input:focus,
.admin-workspace .form-grid select:focus,
.admin-workspace .form-grid textarea:focus{
  border-color:#67af94;
  box-shadow:0 0 0 4px rgba(20,132,95,.10);
}

.admin-workspace .privacy label{
  border:1px solid #e0e7ee;
  transition:border-color .18s ease,background .18s ease;
}

.admin-workspace .privacy label:hover{
  border-color:#a9cfbf;
  background:#fbfefd;
}

.admin-workspace .tools{
  padding:14px;
  border:1px solid #e1e8ef;
  border-radius:14px;
  background:#f8fafc;
}

.admin-workspace .tools input,
.admin-workspace .tools select,
.message-filter-bar input,
.message-filter-bar select{
  min-height:45px;
  outline:none;
}

.admin-workspace .table-wrap{
  border-radius:15px;
  box-shadow:none;
}

.admin-workspace tbody tr:last-child td{
  border-bottom:0;
}

.admin-section-head-row{
  max-width:none;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
}

.message-filter-bar{
  display:grid;
  grid-template-columns:minmax(0,1fr) 240px;
  gap:12px;
  margin-bottom:20px;
  padding:14px;
  border:1px solid #e1e8ef;
  border-radius:14px;
  background:#f8fafc;
}

.message-filter-bar input,
.message-filter-bar select{
  width:100%;
  border:1px solid #ccd7e1;
  border-radius:10px;
  padding:11px 13px;
  background:#fff;
  color:var(--text);
  font:inherit;
}

.admin-message-list{
  display:flex;
  flex-direction:column;
  gap:13px;
}

.admin-message-card,
.message-card{
  border:1px solid #dfe7ee;
  border-radius:16px;
  padding:19px;
  background:#fff;
  box-shadow:0 7px 22px rgba(15,23,42,.04);
}

.messages-panel{
  min-height:480px;
}

@media(max-width:1180px){
  .admin-shell{
    grid-template-columns:220px minmax(0,1fr);
    gap:18px;
  }

  .admin-overview-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .admin-workspace .admin-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:850px){
  .admin-shell{
    width:min(94%,760px);
    grid-template-columns:1fr;
    margin-top:18px;
  }

  .admin-sidebar{
    position:static;
    min-height:auto;
    padding:14px;
  }

  .admin-sidebar-title{
    padding-bottom:13px;
  }

  .admin-side-nav{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .admin-sidebar-footer{
    margin-top:12px;
  }

  .admin-nav-item:hover{
    transform:none;
  }

  .admin-workspace>.panel{
    padding:24px;
  }

  .admin-section-head-row{
    flex-direction:column;
  }
}

@media(max-width:600px){
  .admin-shell{
    width:94%;
  }

  .admin-side-nav,
  .admin-overview-grid,
  .admin-workspace .admin-stats,
  .message-filter-bar{
    grid-template-columns:1fr;
  }

  .admin-nav-item{
    min-height:44px;
  }

  .admin-workspace>.panel{
    padding:20px 16px;
    border-radius:16px;
  }

  .admin-workspace .stat{
    min-height:auto;
  }
}


/* =========================================================
   JAVNA STRANICA — MODERNI REDIZAJN
   ========================================================= */

.public-page{
  background:
    radial-gradient(circle at 8% 8%,rgba(20,132,95,.055),transparent 24rem),
    linear-gradient(180deg,#f6f9fb 0%,#eef4f6 100%);
}

.public-page .topbar{
  background:rgba(7,28,49,.94);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 7px 30px rgba(7,28,49,.12);
}

.public-page .nav{
  min-height:78px;
}

.public-page .brand{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:17px;
  letter-spacing:.01em;
}

.brand-mark{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#14845f;
  color:#fff;
  box-shadow:0 8px 20px rgba(20,132,95,.25);
}

.desktop-nav{
  display:flex;
  gap:24px;
  align-items:center;
}

.desktop-nav a{
  position:relative;
  color:#e8f0f6!important;
  font-size:14px;
  opacity:.88;
}

.desktop-nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-8px;
  height:2px;
  border-radius:999px;
  background:#75dfb7;
  transform:scaleX(0);
  transition:transform .18s ease;
}

.desktop-nav a:hover::after{
  transform:scaleX(1);
}

.nav-donate{
  background:#fff;
  color:#0a2540;
  padding:10px 15px;
  border-radius:999px;
}

.quick-rail{
  position:fixed;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  z-index:40;
  display:flex;
  flex-direction:column;
  gap:9px;
}

.quick-rail a{
  width:58px;
  min-height:58px;
  padding:8px 5px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  border:1px solid rgba(255,255,255,.75);
  border-radius:16px;
  background:rgba(255,255,255,.9);
  color:#0a2540;
  text-decoration:none;
  box-shadow:0 10px 28px rgba(15,23,42,.10);
  backdrop-filter:blur(12px);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}

.quick-rail a:hover{
  transform:translateX(-4px);
  background:#fff;
  box-shadow:0 15px 34px rgba(15,23,42,.15);
}

.quick-rail span{
  font-size:17px;
  font-weight:900;
}

.quick-rail small{
  font-size:9px;
  font-weight:900;
  letter-spacing:.02em;
}

.public-page .hero{
  min-height:auto;
  padding:88px 0 120px;
  background:
    radial-gradient(circle at 78% 18%,rgba(117,223,183,.17),transparent 22rem),
    radial-gradient(circle at 15% 90%,rgba(20,132,95,.14),transparent 20rem),
    linear-gradient(120deg,#05182a 0%,#0b2b49 52%,#0e4e49 135%);
}

.hero-layout{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);
  gap:54px;
  align-items:center;
}

.public-page .hero-copy{
  max-width:880px;
}

.public-page .hero h1{
  max-width:900px;
  margin:22px 0 22px;
  font-size:clamp(46px,6vw,76px);
  letter-spacing:-.045em;
  line-height:1.02;
}

.public-page .hero h1 span{
  display:block;
  color:#75dfb7;
}

.public-page .hero-lead{
  max-width:780px!important;
  color:#d8e6ef!important;
  font-size:19px!important;
  line-height:1.7;
}

.public-page .hero-trust{
  gap:9px;
}

.public-page .hero-actions{
  margin-top:30px;
}

.hero-primary{
  padding-inline:23px;
}

.hero-card{
  position:relative;
  overflow:hidden;
  padding:30px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:26px;
  background:linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.055));
  color:#fff;
  box-shadow:0 25px 70px rgba(0,0,0,.17);
  backdrop-filter:blur(8px);
}

.hero-card::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-70px;
  top:-70px;
  border-radius:50%;
  background:rgba(117,223,183,.10);
}

.hero-card-label{
  color:#a6d9c6;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
}

.hero-card-heart{
  width:66px;
  height:66px;
  margin:26px 0 18px;
  display:grid;
  place-items:center;
  border-radius:20px;
  background:#14845f;
  color:#fff;
  font-size:30px;
  box-shadow:0 14px 30px rgba(20,132,95,.30);
}

.hero-card h2{
  margin:0 0 9px;
  font-size:31px;
  letter-spacing:-.03em;
}

.hero-card>p{
  margin:0;
  color:#d6e5ed;
  font-size:15px;
  line-height:1.65;
}

.hero-card-note{
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,.12);
  display:flex;
  flex-direction:column;
  gap:4px;
}

.hero-card-note strong{
  font-size:13px;
}

.hero-card-note span{
  color:#c6d7e1;
  font-size:12px;
}

.public-stats{
  position:relative;
  z-index:5;
  margin-top:-60px;
  padding:0 0 46px;
}

.public-stats .stat{
  min-height:170px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-radius:20px;
  padding:25px;
  box-shadow:0 18px 45px rgba(15,23,42,.09);
}

.public-stats .stat strong{
  margin-bottom:6px;
  font-size:clamp(26px,3vw,34px);
}

.public-stats .stat small{
  color:#8190a0;
  font-size:12px;
  line-height:1.45;
}

.public-stats .stat.accent small{
  color:#d9f6e9;
}

.donor-showcase{
  padding:0 0 62px;
}

.donor-showcase-card{
  border-radius:24px;
  padding:28px 32px;
}

.section-heading-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,.45fr);
  gap:30px;
  align-items:end;
  margin-bottom:30px;
}

.section-heading-grid .section-head{
  margin-bottom:0;
}

.section-mini-note{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:12px;
  padding:16px;
  border:1px solid #dbe7e1;
  border-radius:16px;
  background:#f8fbfa;
}

.section-mini-note>span{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#14845f;
  color:#fff;
  font-family:Georgia,serif;
  font-weight:900;
}

.section-mini-note p{
  margin:0;
  color:#607082;
  font-size:13px;
}

.donation-layout{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);
  gap:24px;
  align-items:start;
}

.modern-bank-card{
  max-width:none;
  border-radius:22px;
}

.bank-card-top{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:14px!important;
  padding:18px 24px!important;
  background:#071c31!important;
  color:#fff;
  border-bottom:0!important;
}

.bank-card-top>span:first-child{
  color:#fff;
  font-weight:800;
}

.secure-pill{
  padding:6px 9px;
  border-radius:999px;
  background:rgba(117,223,183,.12);
  color:#bfead9!important;
  font-size:10px;
  font-weight:900;
  letter-spacing:.04em;
}

.modern-bank-card .bank-row-modern{
  padding:18px 24px;
}

.highlight-row{
  background:#f0faf6!important;
}

.visibility-guide{
  height:100%;
  border:1px solid #dbe9e3;
  border-radius:22px;
  padding:25px;
  background:
    radial-gradient(circle at 90% 10%,rgba(20,132,95,.09),transparent 15rem),
    #f8fbfa;
  box-shadow:0 14px 34px rgba(15,23,42,.045);
}

.visibility-options{
  grid-template-columns:1fr;
}

.section-head-wide{
  max-width:860px;
}

.transparency-section,
.expenses-section{
  position:relative;
}

.modern-tools{
  padding:13px;
  border:1px solid #dfe7ee;
  border-radius:15px;
  background:rgba(255,255,255,.75);
  box-shadow:0 8px 24px rgba(15,23,42,.035);
}

.modern-tools input,
.modern-tools select{
  min-height:46px;
}

.public-table{
  border-radius:18px;
  overflow:auto;
  box-shadow:0 14px 36px rgba(15,23,42,.05);
}

.public-table th{
  font-size:12px;
  letter-spacing:.025em;
}

.public-table td{
  background:#fff;
}

.public-table tbody tr:hover td{
  background:#f8fbfa;
}

.contact-section{
  background:
    radial-gradient(circle at 85% 15%,rgba(20,132,95,.07),transparent 22rem),
    linear-gradient(180deg,#f5f8fa,#eef4f6);
}

.contact-layout{
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:54px;
}

.contact-intro h2{
  max-width:540px;
  font-size:clamp(38px,4vw,54px);
}

.thank-you-info{
  border-radius:20px;
  padding:24px;
}

.contact-card{
  border-radius:22px;
  padding:30px;
  box-shadow:0 20px 55px rgba(15,23,42,.08);
}

.contact-card-head{
  display:flex;
  align-items:center;
  gap:13px;
  margin-bottom:22px;
  padding-bottom:17px;
  border-bottom:1px solid #e6edf2;
}

.contact-card-head>span{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#e9f6f1;
  color:#14845f;
  font-size:20px;
}

.contact-card-head small{
  display:block;
  margin-bottom:2px;
  color:#7b8896;
  font-size:10px;
  font-weight:900;
  letter-spacing:.10em;
}

.contact-card-head h3{
  margin:0;
  color:#0a2540;
  font-size:21px;
}

footer{
  padding:46px 0 24px;
}

.footer-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:30px;
  align-items:start;
}

.footer-grid strong{
  color:#fff;
  font-size:18px;
}

.footer-grid p{
  max-width:560px;
  margin:8px 0 0;
  color:#aebfcd;
  font-size:13px;
}

.footer-links{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
}

.footer-links a{
  color:#d7e3ec;
  text-decoration:none;
  font-size:13px;
  font-weight:700;
}

.footer-bottom{
  margin-top:24px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.10);
  color:#8fa4b5;
  font-size:12px;
}

@media(max-width:1180px){
  .quick-rail{
    right:10px;
  }

  .hero-layout{
    grid-template-columns:1fr .65fr;
    gap:34px;
  }

  .donation-layout{
    grid-template-columns:1fr;
  }
}

@media(max-width:920px){
  .desktop-nav{
    display:none;
  }

  .hero-layout{
    grid-template-columns:1fr;
  }

  .hero-card{
    max-width:650px;
  }

  .section-heading-grid{
    grid-template-columns:1fr;
  }

  .contact-layout{
    grid-template-columns:1fr;
  }

  .quick-rail{
    top:auto;
    bottom:12px;
    left:50%;
    right:auto;
    transform:translateX(-50%);
    flex-direction:row;
    padding:7px;
    border:1px solid rgba(255,255,255,.65);
    border-radius:18px;
    background:rgba(7,28,49,.92);
    box-shadow:0 14px 35px rgba(7,28,49,.25);
    backdrop-filter:blur(14px);
  }

  .quick-rail a{
    width:64px;
    min-height:52px;
    border:0;
    background:transparent;
    color:#e7f0f6;
    box-shadow:none;
  }

  .quick-rail a:hover{
    transform:none;
    background:rgba(255,255,255,.08);
  }

  .quick-rail small{
    color:#bcd0df;
  }

  footer{
    padding-bottom:95px;
  }
}

@media(max-width:700px){
  .nav-donate{
    display:none;
  }

  .public-page .hero{
    padding:68px 0 105px;
  }

  .public-page .hero h1{
    font-size:clamp(40px,12vw,58px);
  }

  .public-stats{
    margin-top:-48px;
  }

  .public-stats .stat{
    min-height:auto;
  }

  .hero-card{
    padding:24px;
  }

  .donor-showcase-card{
    padding:22px;
  }

  .footer-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:520px){
  .public-page .nav{
    min-height:68px;
  }

  .public-page .brand{
    font-size:14px;
  }

  .brand-mark{
    width:30px;
    height:30px;
  }

  .public-page .hero{
    padding-top:54px;
  }

  .public-page .hero h1{
    font-size:42px;
  }

  .public-page .hero-lead{
    font-size:17px!important;
  }

  .section{
    padding:62px 0;
  }

  .section-head h2{
    font-size:34px;
  }

  .modern-bank-card,
  .visibility-guide,
  .contact-card{
    border-radius:17px;
  }

  .contact-card{
    padding:22px;
  }

  .quick-rail{
    width:calc(100% - 22px);
    justify-content:space-around;
  }

  .quick-rail a{
    flex:1;
    max-width:80px;
  }
}


/* =========================================================
   ADMIN — MOBILNI REDIZAJN
   Dodano za telefone i manje tablete.
   Desktop izgled ostaje nepromijenjen.
   ========================================================= */

@media (max-width: 850px) {
  .admin-page {
    padding-bottom: 92px;
    overflow-x: hidden;
  }

  .admin-page .topbar {
    position: sticky;
    top: 0;
    z-index: 120;
  }

  .admin-page .topbar .nav {
    min-height: 64px;
    gap: 10px;
  }

  .admin-page .brand {
    font-size: 14px;
  }

  .admin-page .topbar .button,
  .admin-page #logoutButton {
    min-height: 40px;
    padding: 9px 12px;
    font-size: 12px;
  }

  .admin-dashboard-main {
    padding: 0;
  }

  .admin-shell {
    width: 100%;
    margin: 0;
    display: block;
  }

  /* Sidebar na mobitelu postaje donja navigacija */
  .admin-sidebar {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 10px;
    top: auto;
    z-index: 150;
    min-height: 0;
    height: auto;
    padding: 7px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 20px;
    background: rgba(7,28,49,.96);
    box-shadow: 0 16px 45px rgba(7,28,49,.30);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    display: block;
  }

  .admin-sidebar-title,
  .admin-sidebar-footer {
    display: none;
  }

  .admin-side-nav {
    display: flex;
    flex-direction: row;
    gap: 5px;
    padding: 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .admin-side-nav::-webkit-scrollbar {
    display: none;
  }

  .admin-nav-item {
    flex: 0 0 72px;
    width: 72px;
    min-height: 60px;
    padding: 6px 4px;
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    color: #cbd9e4;
    font-size: 9px;
    line-height: 1.15;
    text-align: center;
    white-space: normal;
  }

  .admin-nav-item > span {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    margin: 0 auto;
    border-radius: 9px;
    font-size: 12px;
  }

  .admin-nav-item:hover {
    transform: none;
  }

  .admin-nav-item.active {
    background: #14845f;
    color: #fff;
    box-shadow: none;
  }

  .admin-nav-badge {
    position: absolute;
    top: 3px;
    right: 5px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    font-size: 9px;
  }

  .admin-nav-message {
    position: relative;
  }

  .admin-workspace {
    width: 100%;
    padding: 16px 12px 10px;
    min-width: 0;
  }

  .admin-workspace > .panel,
  .admin-workspace .panel {
    width: 100%;
    margin: 0;
    padding: 18px 14px;
    border-radius: 17px;
  }

  .admin-workspace .section-head,
  .admin-section-head-row {
    margin-bottom: 20px;
  }

  .admin-workspace .section-head h2 {
    margin: 5px 0 8px;
    font-size: 27px;
    line-height: 1.08;
  }

  .admin-workspace .section-head p {
    font-size: 13px;
    line-height: 1.55;
  }

  /* Statistika */
  .admin-workspace .admin-stats,
  .admin-workspace .admin-stats.active {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
  }

  .admin-workspace .stat {
    min-width: 0;
    min-height: 118px;
    padding: 16px 13px;
    border-radius: 15px;
  }

  .admin-workspace .stat span {
    font-size: 10px;
  }

  .admin-workspace .stat strong {
    font-size: 20px;
    overflow-wrap: anywhere;
  }

  .admin-workspace .stat small {
    font-size: 10px;
    line-height: 1.35;
  }

  /* Kartice na početnom pregledu */
  .admin-overview-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .admin-overview-card {
    padding: 15px;
    border-radius: 15px;
  }

  /* Forme */
  .admin-workspace .form-grid,
  .admin-workspace .form-row,
  .admin-workspace .form-columns {
    grid-template-columns: 1fr !important;
    gap: 13px;
  }

  .admin-workspace .form-grid input,
  .admin-workspace .form-grid select,
  .admin-workspace .form-grid textarea {
    min-height: 48px;
    font-size: 16px; /* sprječava iOS zoom */
  }

  .admin-workspace textarea {
    min-height: 120px;
  }

  .admin-workspace .privacy {
    grid-template-columns: 1fr !important;
  }

  .admin-workspace .privacy label {
    min-height: 52px;
    padding: 12px;
  }

  .admin-workspace .button,
  .admin-workspace button[type="submit"] {
    min-height: 48px;
  }

  .admin-workspace .form-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 9px;
  }

  .admin-workspace .form-actions .button,
  .admin-workspace .form-actions button {
    width: 100%;
  }

  /* Pretraga/filteri */
  .admin-workspace .tools,
  .message-filter-bar {
    display: grid;
    grid-template-columns: 1fr;
    gap: 9px;
    padding: 10px;
  }

  .admin-workspace .tools input,
  .admin-workspace .tools select,
  .message-filter-bar input,
  .message-filter-bar select {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    font-size: 16px;
  }

  /* Tablice ostaju kompletne, ali uredno skrolaju unutar kartice */
  .admin-workspace .table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid #e1e8ef;
    border-radius: 14px;
    -webkit-overflow-scrolling: touch;
  }

  .admin-workspace table {
    min-width: 720px;
    margin: 0;
  }

  .admin-workspace th,
  .admin-workspace td {
    padding: 12px 11px;
    font-size: 12px;
    white-space: nowrap;
  }

  .admin-workspace td.actions {
    white-space: nowrap;
  }

  .admin-workspace .mini {
    min-height: 36px;
    padding: 7px 9px;
    font-size: 11px;
  }

  /* Poruke kao mobilni inbox */
  .messages-panel {
    min-height: 0;
  }

  .admin-message-list {
    gap: 10px;
  }

  .admin-message-card,
  .message-card {
    padding: 15px;
    border-radius: 15px;
    overflow-wrap: anywhere;
  }

  .admin-message-card .actions,
  .message-card .actions,
  .message-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .admin-message-card .actions button,
  .message-card .actions button,
  .message-actions button,
  .message-actions a {
    width: 100%;
    min-height: 40px;
    margin: 0;
    justify-content: center;
  }

  /* PDF dio */
  #pdfPreview {
    overflow: hidden;
  }

  #pdfPreview .form-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 480px) {
  .admin-workspace {
    padding-left: 9px;
    padding-right: 9px;
  }

  .admin-workspace .admin-stats,
  .admin-workspace .admin-stats.active {
    grid-template-columns: 1fr 1fr;
  }

  .admin-workspace .stat {
    min-height: 108px;
    padding: 14px 11px;
  }

  .admin-workspace .stat strong {
    font-size: 18px;
  }

  .admin-message-card .actions,
  .message-card .actions,
  .message-actions {
    grid-template-columns: 1fr;
  }

  .admin-nav-item {
    flex-basis: 68px;
    width: 68px;
  }
}