:root{
    /* minimalna paleta: tinta + neutralni tonovi + jedan akcent */
    --toa-primary:#3b3d45;
    --toa-primary-dark:#16171b;
    --toa-primary-soft:#eeeef0;
    --toa-sage:#9a9ca4;
    --toa-bg:#f6f6f7;
    --toa-card:#ffffff;
    --toa-text:#16171b;
    --toa-muted:#86878f;
    --toa-danger:#b4483c;
    --toa-danger-soft:#f6e6e3;
    --toa-ok:#2f6f57;
    --toa-ok-soft:#e6efea;
    --toa-border:#e6e6e9;
    --toa-line:#f0f0f2;
    --toa-gold:#a8813c;
    --toa-gold-soft:#f5eee0;
    --toa-indigo:#16171b;
    --toa-pink:#f0eeea;
    --toa-shadow:0 1px 2px rgba(22,23,27,.05);
    --toa-shadow-lg:0 4px 16px rgba(22,23,27,.08);
    --toa-radius:14px;
}

/* sigurnosna mreža: sakrij WP admin traku ako se ipak pojavi (npr. keširana stranica) */
html{ margin-top:0 !important; }
#wpadminbar{ display:none !important; }
html.wp-toolbar{ padding-top:0 !important; }

#toa-app{
    max-width:600px;
    margin:0 auto;
    min-height:100vh;
    background:var(--toa-bg);
    color:var(--toa-text);
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
    position:relative;
    padding-bottom:80px;
    box-sizing:border-box;
    letter-spacing:.1px;
}
#toa-app *{ box-sizing:border-box; }

/* ---------- ZAGLAVLJE ---------- */
.toa-header{
    position:sticky; top:0; z-index:20;
    background:var(--toa-bg);
    color:var(--toa-text);
    padding:calc(16px + env(safe-area-inset-top)) 20px 12px;
    display:flex; align-items:center; justify-content:flex-start;
    border-bottom:none;
}
.toa-header-brand{ display:flex; align-items:center; gap:10px; }
.toa-header-logo{ width:38px; height:38px; border-radius:12px; display:block; box-shadow:var(--toa-shadow); }
.toa-header-title{ font-size:19px; font-weight:800; color:var(--toa-primary-dark); letter-spacing:.2px; }
.toa-version-badge{
    font-size:10px; font-weight:700; color:var(--toa-primary-dark); background:var(--toa-primary-soft);
    padding:3px 8px; border-radius:20px; letter-spacing:.3px;
}
.toa-header-btn{
    position:absolute; top:50%; transform:translateY(-50%);
    color:var(--toa-muted); text-decoration:none; font-size:16px;
    width:38px; height:38px; display:flex; align-items:center; justify-content:center;
    border-radius:50%; background:var(--toa-card); border:none; box-shadow:var(--toa-shadow); cursor:pointer;
}
.toa-header-btn-right{ right:18px; }
.toa-header-btn-right:hover{ color:var(--toa-danger); }

.toa-main{ padding:6px 16px 110px; min-height:60vh; }
.toa-loading{ text-align:center; color:var(--toa-muted); padding:40px 0; font-size:14px; }

/* ---------- POZDRAV I DANAŠNJI DAN ---------- */
.toa-greeting{ margin:6px 2px 16px; }
.toa-greeting h2{ margin:0 0 4px; font-size:26px; font-weight:800; color:var(--toa-primary-dark); letter-spacing:-.2px; }
.toa-greeting p{ margin:0; font-size:14px; color:var(--toa-muted); line-height:1.5; }

.toa-today-card{
    background:var(--toa-card); border-radius:var(--toa-radius); box-shadow:var(--toa-shadow);
    padding:14px 16px; margin-bottom:20px;
    display:flex; align-items:center; gap:12px;
}
.toa-today-card > span:last-child{ min-width:0; }
.toa-today-icon{
    width:42px; height:42px; flex-shrink:0; border-radius:13px;
    background:var(--toa-primary-soft); color:var(--toa-primary-dark);
    display:flex; align-items:center; justify-content:center;
}
.toa-today-icon .toa-ico{ display:block; }
.toa-today-label{ font-size:12px; color:var(--toa-muted); }
.toa-today-value{ font-size:15px; font-weight:700; color:var(--toa-text); }

.toa-section-title{
    font-size:17px; font-weight:800; color:var(--toa-primary-dark);
    margin:0 2px 10px; letter-spacing:-.1px;
}

/* ---------- FILTER ---------- */
.toa-filter{
    display:block; width:100%;
    padding:16px 42px 16px 16px; margin-bottom:16px;
    border:none; border-radius:14px; box-shadow:var(--toa-shadow);
    background:var(--toa-card); font-size:16px; font-weight:600; color:var(--toa-text);
    line-height:1.3; min-height:54px;
    appearance:none; -webkit-appearance:none;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237b8177' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");
    background-repeat:no-repeat; background-position:right 16px center;
    text-overflow:ellipsis;
}

/* ---------- KARTICE ---------- */
.toa-card{
    background:var(--toa-card);
    border:none; box-shadow:var(--toa-shadow);
    border-radius:var(--toa-radius);
    padding:15px 16px;
    margin-bottom:10px;
    display:flex; justify-content:space-between; align-items:center; gap:10px;
}
.toa-card-main{ flex:1; min-width:0; }
.toa-card-title{ font-size:15px; font-weight:600; margin-bottom:3px; color:var(--toa-text); }
.toa-card-sub{ font-size:13px; color:var(--toa-muted); }
.toa-card-badge{
    display:inline-block; padding:3px 11px; border-radius:20px;
    font-size:12px; font-weight:700; background:var(--toa-primary-soft); color:var(--toa-primary-dark);
}
.toa-card-badge.bad{ background:var(--toa-danger-soft); color:var(--toa-danger); }
.toa-card-badge.ok{ background:var(--toa-ok-soft); color:var(--toa-primary-dark); }

.toa-card-actions{ display:flex; gap:6px; flex-shrink:0; }
.toa-icon-btn{
    width:38px; height:38px; border-radius:12px; border:none;
    background:var(--toa-bg); display:flex; align-items:center; justify-content:center;
    font-size:16px; cursor:pointer; color:var(--toa-muted);
}
.toa-icon-btn.danger{ color:var(--toa-danger); }

.toa-empty{ text-align:center; color:var(--toa-muted); padding:50px 15px; font-size:14px; line-height:1.6; }

/* ---------- TJEDNI PLANER ---------- */
.toa-week-nav{
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    margin-bottom:12px;
}
.toa-week-label{ font-size:14px; font-weight:600; color:var(--toa-muted); text-align:center; flex:1; }
.toa-week-today{ width:100%; margin-bottom:16px; }

.toa-day-card{
    background:var(--toa-card); border:none; box-shadow:var(--toa-shadow); border-radius:var(--toa-radius);
    padding:14px 16px; margin-bottom:10px;
    transition:box-shadow .2s;
}
.toa-day-card.toa-day-open{ box-shadow:var(--toa-shadow-lg); padding-bottom:16px; }
.toa-day-header{
    font-size:14px; font-weight:800; color:var(--toa-primary-dark);
    text-transform:uppercase; letter-spacing:.4px;
    margin-bottom:0; padding-bottom:0; border-bottom:none;
    display:flex; justify-content:space-between; align-items:center;
    cursor:pointer; padding:0;
}
.toa-day-card.toa-day-open .toa-day-header{ margin-bottom:12px; padding-bottom:12px; border-bottom:1px solid var(--toa-line); }
.toa-day-title-group{ display:flex; align-items:center; gap:10px; min-width:0; }
.toa-day-header > .toa-day-title-group:first-child{ flex:1 1 auto; min-width:0; }
.toa-day-header > .toa-day-title-group:last-child{ flex:0 0 auto; }
.toa-day-icon{
    width:40px; height:40px; flex-shrink:0; border-radius:13px;
    display:flex; align-items:center; justify-content:center;
    background:var(--toa-primary-soft); color:var(--toa-primary-dark);
}
.toa-day-icon .toa-ico{ display:block; }
.toa-day-icon.c1{ background:#ece8f8; color:#4a3e8c; }
.toa-day-icon.c2{ background:#e3ddf5; color:#5e51a3; }
.toa-day-icon.c3{ background:#f0dce8; color:#a3567f; }
.toa-day-icon.c4{ background:#faf1dc; color:#a8842a; }
.toa-day-icon.c5{ background:#ece8f8; color:#4a3e8c; }
.toa-day-names{ min-width:0; flex:1 1 auto; overflow:hidden; }
.toa-day-name{ display:block; font-size:14px; font-weight:800; letter-spacing:.4px;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.toa-day-sub{
    display:block; font-weight:400; color:var(--toa-muted); text-transform:none;
    letter-spacing:0; font-size:12px; margin-top:2px;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.toa-day-date{ font-weight:600; color:var(--toa-muted); text-transform:none; letter-spacing:0; font-size:12px; }
.toa-day-summary{ font-weight:400; color:var(--toa-muted); text-transform:none; letter-spacing:0; font-size:12px; }
.toa-day-chevron{ transition:transform .2s; color:var(--toa-muted); font-size:16px; }
.toa-day-card.toa-day-open .toa-day-chevron{ transform:rotate(90deg); }
.toa-day-body{ display:none; }
.toa-day-card.toa-day-open .toa-day-body{ display:block; }
.toa-day-card.toa-day-today{ box-shadow:0 0 0 2px var(--toa-primary-soft), var(--toa-shadow); }

.toa-periods{ display:flex; flex-direction:column; gap:8px; margin-bottom:12px; }
.toa-period-row{ display:flex; align-items:center; gap:0; background:var(--toa-bg); border-radius:12px; padding:4px; }
.toa-period-num{
    width:30px; height:30px; flex-shrink:0; border-radius:9px; background:var(--toa-card);
    color:var(--toa-primary-dark); font-size:12px; font-weight:700;
    display:flex; align-items:center; justify-content:center; box-shadow:var(--toa-shadow);
}
.toa-period-input{
    flex:1; padding:8px 12px; font-size:14px; border:none;
    border-radius:9px; background:transparent; color:var(--toa-text); min-width:0;
}
.toa-period-input::placeholder{ color:#a8a6bb; }
.toa-period-input:focus{ outline:none; background:var(--toa-card); box-shadow:var(--toa-shadow); }
.toa-day-note{
    width:100%; min-height:56px; padding:11px 13px; font-size:13px; font-family:inherit;
    border:none; border-radius:12px; background:var(--toa-bg); color:var(--toa-text);
    resize:vertical;
}
.toa-day-note:focus{ outline:none; background:var(--toa-card); box-shadow:var(--toa-shadow); }

.toa-group-header{
    font-size:14px; font-weight:800; color:var(--toa-primary-dark);
    margin:24px 2px 10px; padding-bottom:8px; border-bottom:1px solid var(--toa-border);
    text-transform:uppercase; letter-spacing:.4px;
}
.toa-group-header:first-child{ margin-top:2px; }
.toa-group-sub{ font-weight:400; color:var(--toa-muted); font-size:12px; text-transform:none; letter-spacing:0; }
.toa-empty-inline{ color:var(--toa-muted); font-size:13px; padding:0 2px 10px; }
.toa-back-btn{ width:100%; margin-bottom:14px; }

.toa-summary{
    background:var(--toa-card); border:none; box-shadow:var(--toa-shadow);
    border-radius:20px; padding:20px; margin-bottom:16px;
}
.toa-summary h2{ margin:0 0 14px; font-size:18px; font-weight:800; color:var(--toa-primary-dark); }
.toa-summary .toa-stats{ display:flex; gap:10px; flex-wrap:wrap; margin:10px 0; }
.toa-summary .toa-stats > div{
    flex:1; min-width:90px; background:var(--toa-bg); border-radius:14px; padding:14px 10px; text-align:center;
}
.toa-summary .toa-stat-num{ font-size:23px; font-weight:800; color:var(--toa-primary-dark); }
.toa-summary .toa-stat-label{ font-size:11px; color:var(--toa-muted); margin-top:2px; }
.toa-export-row{ display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; }
.toa-export-row a{
    flex:1; text-align:center; padding:13px; border-radius:13px; font-weight:600;
    text-decoration:none; font-size:14px; min-width:140px; border:none;
}
.toa-btn-excel{ background:var(--toa-ok-soft); color:var(--toa-primary-dark); }
.toa-btn-pdf{ background:var(--toa-gold-soft); color:#a8842a; }

/* ---------- FAB ---------- */
.toa-fab .toa-ico{ display:block; margin:0 auto; }
.toa-header-btn .toa-ico{ display:block; }
.toa-ico{ flex-shrink:0; }
.toa-fab{
    position:fixed; z-index:30;
    right:calc(50% - 300px + 20px);
    bottom:92px;
    width:56px; height:56px; border-radius:50%;
    background:var(--toa-primary-dark); color:#fff; border:none;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 8px 20px rgba(74,62,140,.32);
    cursor:pointer;
}
@media (max-width:640px){
    .toa-fab{ right:20px; }
}
.toa-fab.toa-fab-raised{ bottom:152px; }

/* ---------- DONJA NAVIGACIJA ---------- */
.toa-nav{
    position:fixed; left:0; right:0; bottom:0; z-index:25;
    max-width:600px; margin:0 auto;
    background:var(--toa-card); border-top:none;
    border-radius:22px 22px 0 0;
    box-shadow:0 -4px 20px rgba(74,62,140,.08);
    display:flex; padding:10px 8px calc(10px + env(safe-area-inset-bottom));
    gap:2px;
}
.toa-nav-btn{
    flex:1; background:none; border:none; padding:8px 2px 6px; border-radius:14px;
    display:flex; flex-direction:column; align-items:center; gap:4px;
    color:var(--toa-muted); font-size:10.5px; font-weight:600; cursor:pointer;
    transition:color .15s;
}
.toa-nav-btn .toa-ico{ display:block; }
.toa-nav-btn small{ white-space:nowrap; }
.toa-nav-btn.active{ color:var(--toa-primary-dark); background:none; }
.toa-nav-btn.active .toa-ico{ stroke-width:2.1; }
.toa-nav-btn.active small{ font-weight:800; }

/* ---------- BOTTOM SHEET ---------- */
.toa-sheet-overlay{
    position:fixed; inset:0; background:rgba(36,36,61,.35);
    z-index:40; display:none;
}
.toa-sheet{
    position:fixed; left:0; right:0; bottom:0; z-index:41;
    max-width:600px; margin:0 auto;
    background:var(--toa-card); border-radius:24px 24px 0 0;
    padding:8px 20px 26px;
    transform:translateY(100%);
    transition:transform .25s ease;
    max-height:88vh; overflow-y:auto;
}
.toa-sheet.open{ transform:translateY(0); }
.toa-sheet-overlay.open{ display:block; }
.toa-sheet-handle{
    width:40px; height:4px; background:var(--toa-border); border-radius:4px;
    margin:10px auto 18px;
}
.toa-sheet h3{ margin:0 0 16px; font-size:17px; font-weight:800; color:var(--toa-primary-dark); }
.toa-field{ margin-bottom:14px; }
.toa-field label{ display:block; font-weight:600; margin-bottom:6px; font-size:13px; color:var(--toa-muted); }
.toa-field input[type=text],
.toa-field input[type=date],
.toa-field select{
    width:100%; padding:14px 16px; font-size:16px; font-weight:500;
    border:1px solid var(--toa-border); border-radius:13px; background:var(--toa-bg); color:var(--toa-text);
    min-height:50px; line-height:1.3;
    appearance:none; -webkit-appearance:none;
}
.toa-field select{
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237b8177' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");
    background-repeat:no-repeat; background-position:right 14px center;
    padding-right:40px;
}
.toa-field-checkbox{ display:flex; align-items:center; gap:10px; }
.toa-field-checkbox input{ width:20px; height:20px; accent-color:var(--toa-primary-dark); }
.toa-sheet-actions{ display:flex; gap:10px; margin-top:18px; }
.toa-btn{
    flex:1; padding:14px; border-radius:14px; border:none; font-size:15px; font-weight:700; cursor:pointer;
}
.toa-btn-primary{ background:var(--toa-primary-dark); color:#fff; }
.toa-btn-secondary{ background:var(--toa-bg); color:var(--toa-text); border:1px solid var(--toa-border); }
.toa-btn-danger{ background:var(--toa-danger); color:#fff; }

/* ---------- TOAST ---------- */
.toa-toast{
    position:fixed; left:50%; bottom:104px; transform:translate(-50%,20px);
    background:var(--toa-primary-dark); color:#fff; padding:12px 20px; border-radius:14px;
    font-size:13px; z-index:50; opacity:0; pointer-events:none;
    transition:opacity .2s, transform .2s;
}
.toa-toast.show{ opacity:1; transform:translate(-50%,0); }

/* ---------- POTVRDA ---------- */
.toa-confirm-overlay{
    position:fixed; inset:0; background:rgba(36,36,61,.4);
    z-index:60; display:none; align-items:center; justify-content:center; padding:20px;
}
.toa-confirm-overlay.open{ display:flex; }
.toa-confirm-box{
    background:var(--toa-card); border-radius:22px; padding:24px 22px; width:100%; max-width:320px;
    box-shadow:0 12px 32px rgba(36,36,61,.18); text-align:center;
}
.toa-confirm-box p{ margin:0 0 18px; font-size:15px; color:var(--toa-text); line-height:1.5; }
.toa-confirm-actions{ display:flex; gap:10px; }

/* ---------- LANDING / LOGIN ---------- */
.toa-landing{
    min-height:100vh;
    max-width:600px; margin:0 auto;
    background:var(--toa-bg);
    display:flex; flex-direction:column;
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
    padding:0 20px 40px;
    box-sizing:border-box;
}
.toa-landing-hero{
    text-align:center; color:var(--toa-text); padding:calc(64px + env(safe-area-inset-top)) 10px 34px;
}
.toa-landing-emblem{
    width:92px; height:92px; margin:0 auto 18px; border-radius:26px;
    display:block; object-fit:cover; box-shadow:var(--toa-shadow-lg);
}
.toa-landing-hero h1{ margin:0 0 8px; font-size:27px; font-weight:800; letter-spacing:-.2px; color:var(--toa-primary-dark); }
.toa-landing-hero p{ margin:0; color:var(--toa-muted); font-size:14px; }
.toa-landing-hero a{ color:var(--toa-primary-dark); text-decoration:underline; }

.toa-login-card{
    background:var(--toa-card); border:none; border-radius:22px; padding:26px 22px;
    box-shadow:var(--toa-shadow-lg);
    max-width:400px; width:100%; margin:0 auto;
}
.toa-login-card h2{ margin:0 0 18px; font-size:18px; font-weight:800; text-align:center; color:var(--toa-primary-dark); }
.toa-login-error{
    background:var(--toa-danger-soft); color:var(--toa-danger); padding:10px 12px; border-radius:12px;
    font-size:13px; margin-bottom:14px; text-align:center;
}
.toa-login-submit{ width:100%; margin-top:8px; }

@media (min-width:641px){
    #toa-app, .toa-landing{ box-shadow:0 0 40px rgba(74,62,140,.07); }
}

/* telefon u horizontalnom (landscape) polozaju: popuni cijelu sirinu ekrana */
@media (orientation:landscape) and (max-width:950px){
    #toa-app, .toa-landing{ max-width:100%; box-shadow:none; }
    .toa-nav, .toa-sheet{ max-width:100%; }
    .toa-fab{ right:24px; }
    .toa-main{ padding-left:max(16px, env(safe-area-inset-left)); padding-right:max(16px, env(safe-area-inset-right)); }
    .toa-header{ padding-left:max(20px, env(safe-area-inset-left)); padding-right:max(20px, env(safe-area-inset-right)); }
    .toa-nav{ padding-left:max(6px, env(safe-area-inset-left)); padding-right:max(6px, env(safe-area-inset-right)); }
}

/* ---------- LITURGIJSKI BLAGDANI ---------- */
.toa-feast{ color:#a8842a; font-weight:600; }
.toa-today-card .toa-feast{ font-size:12.5px; display:inline-block; margin-top:2px; }
.toa-day-sub .toa-feast{ font-size:12px; }

/* ---------- GODIŠNJI PLANOVI ---------- */
.toa-plan-picker{ background:var(--toa-card); border-radius:var(--toa-radius); box-shadow:var(--toa-shadow);
    padding:12px 14px; margin:0 0 14px; }
.toa-plan-row{ display:flex; align-items:center; gap:10px; padding:5px 0; flex-wrap:wrap; }
.toa-plan-row + .toa-plan-row{ border-top:1px solid var(--toa-line); padding-top:10px; margin-top:5px; }
.toa-plan-prog{ flex:0 0 auto; font-weight:700; font-size:12px; color:var(--toa-muted);
    text-transform:uppercase; letter-spacing:.4px; min-width:104px; }
.toa-plan-grades{ display:flex; gap:6px; flex-wrap:wrap; }
.toa-chip{
    border:1px solid var(--toa-border); background:var(--toa-bg); color:var(--toa-text);
    border-radius:999px; min-width:40px; padding:7px 12px; font-size:13px; font-weight:700; cursor:pointer;
}
.toa-chip.active{ background:var(--toa-primary-dark); color:#fff; border-color:var(--toa-primary-dark); }
.toa-plan-total{ font-size:12px; color:var(--toa-muted); margin:0 2px 12px; }
.toa-plan-list{ list-style:none; margin:0; padding:2px 0 0; }
.toa-plan-list li{ padding:9px 2px; border-bottom:1px solid var(--toa-line); font-size:14px; line-height:1.4;
    display:flex; gap:8px; align-items:baseline; }
.toa-plan-list li:last-child{ border-bottom:0; padding-bottom:0; }
.toa-plan-num{ flex:0 0 auto; min-width:46px; color:var(--toa-muted); font-size:12.5px;
    font-weight:700; font-variant-numeric:tabular-nums; }
.toa-plan-cjelina{ font-weight:800; color:var(--toa-primary-dark); font-size:13px;
    text-transform:uppercase; letter-spacing:.3px; }
.toa-plan-type{ color:var(--toa-sage); font-size:11.5px; font-style:normal; font-weight:600; }
.toa-plan-empty{ color:var(--toa-muted); font-style:italic; }

/* ==========================================================
   v2.4 — HERO, CITAT, KALENDAR, DAN
   ========================================================== */

/* hero */
.toa-hero{
    position:relative; overflow:hidden;
    border-radius:22px; padding:22px 20px 24px; margin:2px 0 14px;
    background:linear-gradient(135deg,#4a3e8c 0%,#5e51a3 55%,#8b7bc8 100%);
    color:#fff; box-shadow:0 10px 26px rgba(74,62,140,.22);
}
.toa-hero-glow{
    position:absolute; right:-40px; top:-60px; width:190px; height:190px; border-radius:50%;
    background:radial-gradient(circle at 35% 35%, rgba(217,169,76,.55), rgba(217,169,76,0) 70%);
    pointer-events:none;
}
.toa-hero-glow::after{
    content:""; position:absolute; right:60px; top:96px; width:120px; height:120px; border-radius:50%;
    background:radial-gradient(circle, rgba(255,255,255,.16), rgba(255,255,255,0) 70%);
}
.toa-hero-inner{ position:relative; z-index:1; }
.toa-hero h2{ margin:0 0 6px; font-size:27px; font-weight:800; letter-spacing:-.4px; }
.toa-hero p{ margin:0; font-size:14px; opacity:.88; line-height:1.5; max-width:80%; }

/* citat dana */
.toa-quote{
    background:var(--toa-card); border-radius:var(--toa-radius); box-shadow:var(--toa-shadow);
    padding:15px 17px; margin-bottom:12px; display:flex; gap:12px; align-items:flex-start;
    border-left:3px solid var(--toa-gold);
}
.toa-quote-mark{ color:var(--toa-gold); flex-shrink:0; margin-top:1px; }
.toa-quote-text{ margin:0 0 4px; font-size:15px; font-weight:600; color:var(--toa-primary-dark); line-height:1.42; }
.toa-quote-ref{ font-size:12px; color:var(--toa-muted); }
.toa-quote-big{ padding:19px; margin-bottom:16px; }
.toa-quote-big .toa-quote-text{ font-size:17px; line-height:1.4; }

/* traka blagdana */
.toa-feast-banner{
    display:flex; gap:10px; align-items:center;
    background:var(--toa-gold-soft); border-radius:14px; padding:11px 14px; margin-bottom:14px;
}
.toa-feast-dot{ width:9px; height:9px; border-radius:50%; background:var(--toa-gold); flex-shrink:0; }
.toa-feast-banner strong{ display:block; font-size:13.5px; color:#8a6d1f; font-weight:700; line-height:1.3; }
.toa-feast-banner small{ display:block; font-size:11.5px; color:#b09455; text-transform:lowercase; }

/* prekidač sedmica / mjesec */
.toa-seg{
    display:flex; gap:4px; background:var(--toa-card); border-radius:14px; padding:4px;
    box-shadow:var(--toa-shadow); margin-bottom:16px;
}
.toa-seg-btn{
    flex:1; border:none; background:none; border-radius:11px; padding:10px 8px; cursor:pointer;
    display:flex; align-items:center; justify-content:center; gap:7px;
    font-size:13.5px; font-weight:700; color:var(--toa-muted);
}
.toa-seg-btn.active{ background:var(--toa-primary-dark); color:#fff; }

.toa-flip{ transform:scaleX(-1); }
.toa-btn-ghost{
    background:var(--toa-card); color:var(--toa-primary-dark); box-shadow:var(--toa-shadow);
    border:none; font-weight:700;
}
.toa-month-label{ font-size:16px; font-weight:800; color:var(--toa-primary-dark); }

/* kalendar */
.toa-cal{
    display:grid; grid-template-columns:repeat(7,1fr); gap:5px;
    background:var(--toa-card); border-radius:20px; padding:12px 10px 14px; box-shadow:var(--toa-shadow);
}
.toa-cal-dow{
    text-align:center; font-size:11px; font-weight:800; color:var(--toa-muted);
    padding:2px 0 6px; letter-spacing:.4px;
}
.toa-cal-dow.weekend{ color:#c2a05e; }
.toa-cal-cell{
    position:relative; border:none; background:var(--toa-bg); border-radius:12px;
    aspect-ratio:1/1; padding:5px 4px 4px; cursor:pointer;
    display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:2px;
    font-family:inherit;
}
.toa-cal-cell.empty{ background:transparent; }
.toa-cal-num{ font-size:13.5px; font-weight:700; color:var(--toa-text); line-height:1.1; }
.toa-cal-marks{ display:flex; align-items:center; gap:3px; min-height:14px; }
.toa-cal-feast{ width:5px; height:5px; border-radius:50%; background:var(--toa-gold); }
.toa-cal-load{
    font-size:9.5px; font-weight:800; color:#fff; background:var(--toa-primary);
    border-radius:20px; padding:1px 5px; line-height:1.35;
}
.toa-cal-cell.weekend{ background:transparent; cursor:default; }
.toa-cal-cell.weekend .toa-cal-num{ color:#b8b6c8; }
.toa-cal-cell.today{ background:var(--toa-primary-dark); }
.toa-cal-cell.today .toa-cal-num{ color:#fff; }
.toa-cal-cell.today .toa-cal-load{ background:var(--toa-gold); color:#2f2405; }
.toa-cal-cell.solemn{ box-shadow:inset 0 0 0 2px var(--toa-gold); }
.toa-cal-cell.feastday{ box-shadow:inset 0 0 0 1px #ecd9a8; }
.toa-cal-cell.has:not(.today){ background:var(--toa-primary-soft); }

/* popis blagdana u mjesecu */
.toa-feast-list{ background:var(--toa-card); border-radius:var(--toa-radius); box-shadow:var(--toa-shadow); padding:4px 16px; }
.toa-feast-item{ display:flex; align-items:baseline; gap:10px; padding:10px 0; border-bottom:1px solid var(--toa-line); }
.toa-feast-item:last-child{ border-bottom:0; }
.toa-feast-day{ flex:0 0 26px; font-size:13px; font-weight:800; color:var(--toa-primary-dark); }
.toa-feast-name{ flex:1; font-size:13.5px; line-height:1.35; }
.toa-feast-rank{ font-size:10.5px; font-weight:700; padding:2px 8px; border-radius:20px;
    background:var(--toa-primary-soft); color:var(--toa-primary-dark); text-transform:lowercase; }
.toa-feast-rank.svetkovina{ background:var(--toa-gold-soft); color:#8a6d1f; }

/* pojedini dan */
.toa-daybar{ display:flex; align-items:center; gap:12px; margin:2px 0 16px; }
.toa-daybar-title{ flex:1; font-size:18px; font-weight:800; color:var(--toa-primary-dark); letter-spacing:-.2px; }
.toa-daybar-badge{ font-size:12px; font-weight:700; color:var(--toa-primary-dark);
    background:var(--toa-primary-soft); border-radius:20px; padding:5px 11px; }
.toa-periods-big .toa-period-row{ padding:5px; }
.toa-periods-big .toa-period-num{ width:34px; height:34px; font-size:13px; }
.toa-periods-big .toa-period-input{ font-size:15px; padding:10px 12px; }

/* dan-kartica je sada dugme koje otvara dan */
.toa-day-card[data-open-day]{ cursor:pointer; }
.toa-day-card[data-open-day]:active{ transform:scale(.995); }
.toa-day-chevron{ display:flex; transform:scaleX(-1); }
.toa-day-card.toa-day-today{ box-shadow:0 0 0 2px var(--toa-primary-soft), var(--toa-shadow-lg); }

/* ==========================================================
   v2.5 — HERO S CITATOM, TRAKA DANA, PLAN DANA, NAV S "+"
   ========================================================== */
.toa-hero p.toa-hero-verse{
    margin:2px 0 4px; font-size:14.5px; font-style:italic; opacity:.95; max-width:66%; line-height:1.45;
}
.toa-hero-ref{ position:relative; z-index:1; font-size:12px; opacity:.7; }
.toa-hero h2{ margin-bottom:8px; }

/* traka "Danas je …" */
.toa-todaybar{
    display:flex; align-items:center; gap:12px; cursor:pointer;
    background:var(--toa-primary-dark); color:#fff;
    border-radius:var(--toa-radius); padding:13px 14px; margin:0 0 20px;
    box-shadow:0 6px 16px rgba(74,62,140,.18);
}
.toa-todaybar-icon{
    width:38px; height:38px; flex-shrink:0; border-radius:12px;
    background:rgba(255,255,255,.14); display:flex; align-items:center; justify-content:center;
}
.toa-todaybar-txt{ flex:1; min-width:0; }
.toa-todaybar-txt small{ display:block; font-size:11.5px; opacity:.72; }
.toa-todaybar-txt strong{ display:block; font-size:14.5px; font-weight:700; }
.toa-todaybar-cta{
    flex-shrink:0; display:flex; align-items:center; gap:4px;
    background:#fff; color:var(--toa-primary-dark);
    font-size:12.5px; font-weight:700; border-radius:20px; padding:8px 12px;
}
.toa-todaybar-cta .toa-ico{ transform:scaleX(-1); }

/* plan dana — kartice sa satnicom */
.toa-slots{ display:flex; flex-direction:column; gap:9px; }
.toa-slot{
    display:flex; align-items:center; gap:12px;
    background:var(--toa-card); border-radius:15px; box-shadow:var(--toa-shadow); padding:11px 13px;
}
.toa-slot.filled{ box-shadow:0 0 0 1.5px var(--toa-primary-soft), var(--toa-shadow); }
.toa-slot-icon{
    width:38px; height:38px; flex-shrink:0; border-radius:12px;
    display:flex; align-items:center; justify-content:center;
    background:var(--toa-primary-soft); color:var(--toa-primary-dark);
}
.toa-slot-icon.c1{ background:#ece8f8; color:#4a3e8c; }
.toa-slot-icon.c2{ background:#faf1dc; color:#a8842a; }
.toa-slot-icon.c3{ background:#f0dce8; color:#a3567f; }
.toa-slot-icon.c4{ background:#e3ddf5; color:#5e51a3; }
.toa-slot-icon.c5{ background:#e0eef0; color:#3f7f88; }
.toa-slot-body{ flex:1; min-width:0; }
.toa-slot-time{
    display:flex; align-items:baseline; gap:8px;
    font-size:11.5px; font-weight:700; color:var(--toa-muted); margin-bottom:2px;
}
.toa-slot-time em{ font-style:normal; font-weight:600; opacity:.75; }
.toa-slot .toa-period-input{
    width:100%; padding:2px 0; font-size:15px; font-weight:600; background:transparent;
    border:none; border-radius:0; color:var(--toa-text);
}
.toa-slot .toa-period-input:focus{ outline:none; background:transparent; box-shadow:none; }
.toa-slot .toa-period-input::placeholder{ font-weight:400; }

/* legenda kalendara */
.toa-legend{ display:flex; gap:14px; flex-wrap:wrap; justify-content:center; margin:12px 0 2px; }
.toa-legend span{ display:flex; align-items:center; gap:6px; font-size:11.5px; color:var(--toa-muted); }
.toa-legend i{ width:11px; height:11px; border-radius:4px; display:block; }
.toa-legend .lg-load{ background:var(--toa-primary-soft); box-shadow:inset 0 0 0 1px var(--toa-primary); }
.toa-legend .lg-feast{ background:var(--toa-gold); border-radius:50%; width:7px; height:7px; }
.toa-legend .lg-solemn{ background:transparent; box-shadow:inset 0 0 0 2px var(--toa-gold); }
.toa-legend .lg-today{ background:var(--toa-primary-dark); }

/* navigacija s istaknutim "+" u sredini */
.toa-nav{ align-items:center; }
.toa-nav .toa-fab{
    position:static; flex:0 0 auto; width:52px; height:52px; margin:-22px 4px 0;
    border-radius:50%; background:var(--toa-primary-dark); color:#fff; border:4px solid var(--toa-card);
    box-shadow:0 8px 18px rgba(74,62,140,.30);
    display:flex; align-items:center; justify-content:center;
}
.toa-nav .toa-fab .toa-ico{ display:block; }
@media (max-width:640px){ .toa-nav .toa-fab{ right:auto; } }

/* ==========================================================
   v2.6 — OSTALE RUBRIKE (ocjene, izostanci, izvješća, planovi)
   ========================================================== */
.toa-pagehead{ margin:4px 2px 14px; }
.toa-pagehead h2{ margin:0 0 3px; font-size:25px; font-weight:800; color:var(--toa-primary-dark); letter-spacing:-.3px; }
.toa-pagehead p{ margin:0; font-size:13.5px; color:var(--toa-muted); }

/* odabir škole */
.toa-picker{
    display:flex; align-items:center; gap:10px;
    background:var(--toa-card); border-radius:15px; box-shadow:var(--toa-shadow);
    padding:4px 12px 4px 12px; margin-bottom:16px;
}
.toa-picker-icon{
    width:36px; height:36px; flex-shrink:0; border-radius:11px;
    background:var(--toa-primary-soft); color:var(--toa-primary-dark);
    display:flex; align-items:center; justify-content:center;
}
.toa-filter-bare{
    background:transparent !important; box-shadow:none !important; border:none !important;
    margin:0 !important; padding:14px 30px 14px 0 !important; min-height:46px !important;
    background-position:right 4px center !important; font-size:15px !important;
}

/* inicijali umjesto fotografije */
.toa-avatar{
    width:40px; height:40px; flex-shrink:0; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:13.5px; font-weight:800; letter-spacing:.3px;
}
.toa-avatar.a1{ background:#ece8f8; color:#4a3e8c; }
.toa-avatar.a2{ background:#faf1dc; color:#a8842a; }
.toa-avatar.a3{ background:#f0dce8; color:#a3567f; }
.toa-avatar.a4{ background:#e3ddf5; color:#5e51a3; }
.toa-avatar.a5{ background:#e0eef0; color:#3f7f88; }

/* kartica učenika s unosima */
.toa-person{
    background:var(--toa-card); border-radius:var(--toa-radius); box-shadow:var(--toa-shadow);
    padding:13px 14px; margin-bottom:11px;
}
.toa-person-head{ display:flex; align-items:center; gap:11px; }
.toa-person-names{ flex:1; min-width:0; }
.toa-person-names strong{ display:block; font-size:15px; font-weight:700; color:var(--toa-text); line-height:1.25; }
.toa-person-names small{ display:block; font-size:12px; color:var(--toa-muted); }
.toa-person-stat{ display:flex; gap:5px; flex-shrink:0; }
.toa-pill{
    font-size:12.5px; font-weight:800; border-radius:20px; padding:5px 11px;
    background:var(--toa-primary-soft); color:var(--toa-primary-dark);
}
.toa-pill.strong{ background:var(--toa-primary-dark); color:#fff; }
.toa-pill.ok{ background:var(--toa-ok-soft); color:#3f7a5c; }
.toa-pill.bad{ background:var(--toa-danger-soft); color:var(--toa-danger); }
.toa-pill.muted{ background:var(--toa-bg); color:var(--toa-muted); font-weight:600; }

.toa-entries{ margin-top:10px; border-top:1px solid var(--toa-line); padding-top:4px; }
.toa-entry{ display:flex; align-items:center; gap:11px; padding:8px 0; border-bottom:1px solid var(--toa-line); }
.toa-entry:last-child{ border-bottom:0; }
.toa-entry-body{ flex:1; min-width:0; }
.toa-entry-main{ display:block; font-size:13.5px; font-weight:600; color:var(--toa-text); }
.toa-entry-note{ display:block; font-size:12px; color:var(--toa-muted); }
.toa-entry-actions{ display:flex; gap:5px; flex-shrink:0; }
.toa-icon-btn.sm{ width:31px; height:31px; border-radius:10px; }

/* ocjena kao krug u boji */
.toa-grade{
    width:32px; height:32px; flex-shrink:0; border-radius:11px;
    display:inline-flex; align-items:center; justify-content:center;
    font-size:15px; font-weight:800; color:#fff;
}
.toa-grade.g1{ background:#c4566e; }
.toa-grade.g2{ background:#d99356; }
.toa-grade.g3{ background:#cbab52; }
.toa-grade.g4{ background:#6f9a8a; }
.toa-grade.g5{ background:#3f7a5c; }
.toa-chiprow{ display:flex; flex-wrap:wrap; gap:7px;
    background:var(--toa-card); border-radius:var(--toa-radius); box-shadow:var(--toa-shadow); padding:14px; }

.toa-abs{
    width:32px; height:32px; flex-shrink:0; border-radius:11px;
    display:inline-flex; align-items:center; justify-content:center;
}
.toa-abs.ok{ background:var(--toa-ok-soft); color:#3f7a5c; }
.toa-abs.bad{ background:var(--toa-danger-soft); color:var(--toa-danger); }

/* jednostavan popis (učenici u izvješćima) */
.toa-list{ background:var(--toa-card); border-radius:var(--toa-radius); box-shadow:var(--toa-shadow); padding:2px 14px; }
.toa-row{ display:flex; align-items:center; gap:11px; padding:11px 0; border-bottom:1px solid var(--toa-line); cursor:pointer; }
.toa-row:last-child{ border-bottom:0; }
.toa-row-body{ flex:1; min-width:0; }
.toa-row-body strong{ display:block; font-size:14.5px; font-weight:700; }
.toa-row-body small{ display:block; font-size:12px; color:var(--toa-muted); }
.toa-row-chev{ color:var(--toa-muted); display:flex; transform:scaleX(-1); }

/* statistika u izvješću */
.toa-statgrid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.toa-stat{
    background:var(--toa-card); border-radius:var(--toa-radius); box-shadow:var(--toa-shadow);
    padding:15px 16px; display:flex; flex-direction:column; gap:2px;
}
.toa-stat-label{ font-size:12px; color:var(--toa-muted); font-weight:600; }
.toa-stat-num{ font-size:30px; font-weight:800; color:var(--toa-primary-dark); line-height:1.1; }
.toa-stat-foot{ font-size:11.5px; color:var(--toa-muted); }
.toa-daybar .toa-avatar{ margin-left:auto; }

/* ==========================================================
   v2.7 — SVJETLIJI HERO, UREDNA NAVIGACIJA, PLAN DANA BEZ SATNICE
   ========================================================== */

/* --- hero: svjetlije, niže, s križem i otvorenom knjigom --- */
.toa-hero{
    background:linear-gradient(135deg,#f3f0fb 0%,#ede9f8 55%,#e6e1f5 100%);
    color:var(--toa-primary-dark);
    box-shadow:var(--toa-shadow);
    border-radius:20px; padding:16px 18px 17px; margin:2px 0 14px;
}
.toa-hero-glow{
    right:-70px; top:-70px; width:170px; height:170px;
    background:radial-gradient(circle at 40% 40%, rgba(217,169,76,.28), rgba(217,169,76,0) 70%);
}
.toa-hero-glow::after{ display:none; }
.toa-hero-art{
    position:absolute; right:10px; bottom:-14px; z-index:0;
    color:var(--toa-primary-dark); opacity:.13; pointer-events:none;
}
.toa-hero h2{ font-size:21px; margin:0 0 5px; letter-spacing:-.2px; }
.toa-hero p.toa-hero-verse{
    margin:0 0 3px; font-size:13.5px; font-style:italic; opacity:1;
    color:#6b5db3; max-width:64%; line-height:1.4;
}
.toa-hero-ref{ font-size:11.5px; color:var(--toa-muted); opacity:1; }
.toa-hero p{ color:#6b5db3; }

/* --- navigacija: pet jednakih polja, "+" pluta iznad --- */
.toa-nav{ padding:9px 6px calc(9px + env(safe-area-inset-bottom)); gap:0; }
.toa-nav-btn{ flex:1 1 0; min-width:0; padding:6px 1px 4px; gap:3px; }
.toa-nav-btn small{ font-size:10px; letter-spacing:-.1px; }
.toa-nav .toa-fab{ display:none; }

.toa-fab{
    position:fixed; z-index:30;
    right:calc(50% - 300px + 18px);
    bottom:calc(92px + env(safe-area-inset-bottom));
    width:54px; height:54px; border-radius:50%;
    background:var(--toa-primary-dark); color:#fff; border:none;
    box-shadow:0 8px 20px rgba(74,62,140,.32);
    display:flex; align-items:center; justify-content:center; cursor:pointer;
}
@media (max-width:640px){ .toa-fab{ right:18px; } }

/* --- plan dana bez vremena --- */
.toa-slot-time{ font-size:11px; letter-spacing:.3px; text-transform:uppercase; }


/* ==========================================================
   v2.8 — ZNAK APLIKACIJE (bez slike i bez oznake verzije)
   ========================================================== */
.toa-mark{ display:block; border-radius:11px; box-shadow:var(--toa-shadow); }
.toa-header-brand{ gap:11px; }
.toa-header-title{ font-size:20px; letter-spacing:-.2px; }
.toa-version-badge{ display:none; }
.toa-landing-emblem{
    display:block; width:88px; height:88px; margin:0 auto 18px;
}
.toa-landing-emblem .toa-mark{ border-radius:24px; box-shadow:var(--toa-shadow-lg); }

/* ==========================================================
   v2.9 — HARMONIKA ZA MJESECE U GODIŠNJEM PLANU
   ========================================================== */
.toa-acc{
    background:var(--toa-card); border-radius:var(--toa-radius); box-shadow:var(--toa-shadow);
    padding:12px 15px; margin-bottom:10px;
}
.toa-acc-head{
    display:flex; align-items:center; justify-content:space-between; gap:10px; cursor:pointer;
}
.toa-acc-title{
    font-size:14px; font-weight:800; color:var(--toa-primary-dark);
    text-transform:uppercase; letter-spacing:.4px;
}
.toa-acc-meta{ display:flex; align-items:center; gap:9px; flex-shrink:0; }
.toa-acc-meta .toa-pill{ font-size:11.5px; padding:4px 10px; }
.toa-acc-chev{ display:flex; color:var(--toa-muted); transform:scaleX(-1); transition:transform .2s; }
.toa-acc.toa-acc-open .toa-acc-chev{ transform:rotate(90deg); }
.toa-acc-body{ display:none; }
.toa-acc.toa-acc-open{ box-shadow:var(--toa-shadow-lg); }
.toa-acc.toa-acc-open .toa-acc-head{
    margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid var(--toa-line);
}
.toa-acc.toa-acc-open .toa-acc-body{ display:block; }
.toa-plan-title{ flex:1; min-width:0; }


/* v2.10 — "+" podignut iznad donje trake i na telefonima sa safe-area */
.toa-fab{ bottom:calc(92px + env(safe-area-inset-bottom)) !important; }
.toa-toast{ bottom:calc(108px + env(safe-area-inset-bottom)); }

/* ==========================================================
   v3.0 — PUNI LITURGIJSKI KALENDAR
   ========================================================== */
.toa-lit{ background:var(--toa-card); border-radius:var(--toa-radius); box-shadow:var(--toa-shadow); padding:2px 14px; }
.toa-lit-row{ display:flex; align-items:flex-start; gap:11px; padding:9px 0; border-bottom:1px solid var(--toa-line); }
.toa-lit-row:last-child{ border-bottom:0; }
.toa-lit-date{ flex:0 0 34px; text-align:center; line-height:1.1; padding-top:1px; }
.toa-lit-date b{ display:block; font-size:14px; font-weight:800; color:var(--toa-text); }
.toa-lit-date i{ display:block; font-size:10px; font-style:normal; color:var(--toa-muted); text-transform:uppercase; }
.toa-lit-body{ flex:1; min-width:0; }
.toa-lit-name{ display:block; font-size:13.5px; font-weight:600; color:var(--toa-text); line-height:1.35; }
.toa-lit-name.plain{ font-weight:400; color:var(--toa-muted); }
.toa-lit-also{ display:block; font-size:12px; color:var(--toa-muted); }
.toa-lit-week{ display:block; font-size:11px; color:#a3a1b6; margin-top:1px; }
.toa-lit-rank{
    flex:0 0 auto; font-size:9.5px; font-weight:800; text-transform:uppercase; letter-spacing:.3px;
    border-radius:20px; padding:3px 7px; background:var(--toa-bg); color:var(--toa-muted); margin-top:2px;
}
.toa-lit-rank.svetkovina{ background:var(--toa-gold-soft); color:#8a6d1f; }
.toa-lit-rank.blagdan{ background:var(--toa-primary-soft); color:var(--toa-primary-dark); }
.toa-lit-rank.nedjelja{ background:#f0dce8; color:#a3567f; }
.toa-lit-row.sun .toa-lit-date b{ color:var(--toa-danger); }
.toa-lit-row.solemn{ background:linear-gradient(90deg, rgba(217,169,76,.10), rgba(217,169,76,0) 60%); }

.toa-season{
    font-size:12.5px; color:var(--toa-muted); margin:-8px 2px 14px; font-weight:600;
}

/* ==========================================================
   v3.1 — KOMPAKTNIJA DONJA TRAKA
   ========================================================== */
.toa-nav{
    padding:5px 6px calc(5px + env(safe-area-inset-bottom));
    border-radius:18px 18px 0 0;
    box-shadow:0 -3px 14px rgba(74,62,140,.07);
}
.toa-nav-btn{ padding:5px 1px 3px; gap:2px; border-radius:11px; }
.toa-nav-btn .toa-ico{ width:19px; height:19px; }
.toa-nav-btn small{ font-size:9.5px; letter-spacing:0; line-height:1.2; }
.toa-nav-btn.active .toa-ico{ stroke-width:2.2; }

#toa-app{ padding-bottom:64px; }
.toa-main{ padding-bottom:86px; }
.toa-fab{
    width:50px; height:50px;
    bottom:calc(70px + env(safe-area-inset-bottom)) !important;
    box-shadow:0 6px 16px rgba(74,62,140,.30);
}
.toa-fab .toa-ico{ width:23px; height:23px; }
.toa-toast{ bottom:calc(86px + env(safe-area-inset-bottom)); }


/* ==========================================================
   v3.2 — SVJETLIJA LJUBIČASTA PALETA (dorada)
   ========================================================== */

/* hero: svijetli lavanda prijelaz */
.toa-hero{
    background:linear-gradient(135deg,#f3f0fb 0%,#ece8f8 50%,#e6e1f5 100%);
    color:var(--toa-primary-dark);
}
.toa-hero-glow{
    background:radial-gradient(circle at 40% 40%, rgba(212,169,74,.26), rgba(212,169,74,0) 70%);
}
.toa-hero p.toa-hero-verse{ color:#5e51a3; }
.toa-hero p{ color:#5e51a3; }

/* traka "Danas je" — puna ljubičasta kao u predlošku */
.toa-todaybar{
    background:linear-gradient(135deg,#5a4ca6 0%,#4a3e8c 100%);
    box-shadow:0 6px 16px rgba(74,62,140,.24);
}

/* pločice dana i sati — pet tonova iz palete */
.toa-day-icon.c1, .toa-slot-icon.c1, .toa-avatar.a1{ background:#ece8f8; color:#5e51a3; }
.toa-day-icon.c2, .toa-slot-icon.c2, .toa-avatar.a2{ background:#faf1dc; color:#a8842a; }
.toa-day-icon.c3, .toa-slot-icon.c3, .toa-avatar.a3{ background:#f0dce8; color:#a3567f; }
.toa-day-icon.c4, .toa-slot-icon.c4, .toa-avatar.a4{ background:#e0eef0; color:#3f7f88; }
.toa-day-icon.c5, .toa-slot-icon.c5, .toa-avatar.a5{ background:#e3ddf5; color:#4a3e8c; }

/* ocjene — od tople do hladne, u tonu palete */
.toa-grade.g1{ background:#c4566e; }
.toa-grade.g2{ background:#d99356; }
.toa-grade.g3{ background:#cbab52; }
.toa-grade.g4{ background:#7d8fc4; }
.toa-grade.g5{ background:#4a3e8c; }

/* kalendar */
.toa-cal-cell.today{ background:var(--toa-primary-dark); }
.toa-cal-load{ background:var(--toa-primary); }
.toa-cal-cell.has:not(.today){ background:var(--toa-primary-soft); }
.toa-legend .lg-load{ background:var(--toa-primary-soft); box-shadow:inset 0 0 0 1px var(--toa-primary); }

/* liturgijski popis */
.toa-lit-rank.nedjelja{ background:#f0dce8; color:#a3567f; }
.toa-lit-row.sun .toa-lit-date b{ color:#a3567f; }
.toa-lit-row.solemn{ background:linear-gradient(90deg, rgba(212,169,74,.12), rgba(212,169,74,0) 60%); }

/* gumbi za izvoz */
.toa-btn-excel{ background:var(--toa-primary-soft); color:var(--toa-primary-dark); }
.toa-btn-pdf{ background:var(--toa-gold-soft); color:#a8842a; }

/* v3.3 — obični dani (ferije) u liturgijskom popisu */
.toa-lit-name.plain{ font-weight:500; color:var(--toa-muted); }
.toa-lit-rank.ferija{ background:transparent; color:#b8b6c8; font-weight:600; padding-left:0; padding-right:0; }
.toa-lit-rank.osmina, .toa-lit-rank.veliki, .toa-lit-rank.došašće{
    background:var(--toa-gold-soft); color:#a8842a;
}

/* ==========================================================
   v4.0 — MINIMALNI STIL
   tanke linije umjesto sjena, manje zaobljenja, jedan akcent
   ========================================================== */
#toa-app{ letter-spacing:-.005em; }

.toa-card, .toa-day-card, .toa-person, .toa-list, .toa-lit, .toa-acc,
.toa-picker, .toa-plan-picker, .toa-quote, .toa-slot, .toa-stat,
.toa-cal, .toa-feast-list, .toa-seg, .toa-chiprow, .toa-summary, .toa-filter{
    box-shadow:none;
    border:1px solid var(--toa-border);
    border-radius:12px;
}
.toa-today-card, .toa-login-card{ box-shadow:none; border:1px solid var(--toa-border); border-radius:12px; }
.toa-day-card.toa-day-open, .toa-acc.toa-acc-open{ box-shadow:none; border-color:#d8d8dc; }
.toa-day-card.toa-day-today{ box-shadow:none; border-color:var(--toa-primary-dark); }

/* zaglavlje */
.toa-header{ padding-bottom:10px; }
.toa-header-title{ font-weight:700; letter-spacing:-.02em; }
.toa-mark{ box-shadow:none; border-radius:8px; }
.toa-header-btn{ box-shadow:none; border:1px solid var(--toa-border); }

/* naslovi */
.toa-pagehead h2{ font-weight:700; letter-spacing:-.03em; font-size:24px; }
.toa-section-title{ font-weight:700; letter-spacing:-.02em; font-size:15px;
    text-transform:uppercase; color:var(--toa-muted); font-size:11.5px; letter-spacing:.08em; }

/* hero: bez prijelaza, samo tanki okvir */
.toa-hero{
    background:var(--toa-card); border:1px solid var(--toa-border); border-radius:12px;
    box-shadow:none; padding:18px; color:var(--toa-text);
}
.toa-hero-glow{ display:none; }
.toa-hero-art{ opacity:.06; color:var(--toa-text); right:14px; bottom:-10px; }
.toa-hero h2{ font-size:20px; font-weight:700; letter-spacing:-.03em; color:var(--toa-text); }
.toa-hero p.toa-hero-verse{ color:var(--toa-muted); font-style:normal; }
.toa-hero-ref{ color:#aaabb2; }

/* traka danas: tinta */
.toa-todaybar{ background:var(--toa-primary-dark); box-shadow:none; border-radius:12px; }
.toa-todaybar-icon{ background:rgba(255,255,255,.10); border-radius:9px; }
.toa-todaybar-cta{ background:#fff; color:var(--toa-primary-dark); border-radius:8px; font-weight:600; }

/* prekidač i gumbi */
.toa-seg{ padding:3px; border-radius:10px; }
.toa-seg-btn{ border-radius:8px; font-weight:600; }
.toa-seg-btn.active{ background:var(--toa-primary-dark); color:#fff; }
.toa-btn{ border-radius:10px; font-weight:600; }
.toa-btn-primary{ background:var(--toa-primary-dark); }
.toa-btn-ghost{ box-shadow:none; border:1px solid var(--toa-border); }
.toa-icon-btn{ background:var(--toa-card); border:1px solid var(--toa-border); border-radius:9px; }
.toa-chip{ border-radius:8px; font-weight:600; background:var(--toa-card); }
.toa-chip.active{ background:var(--toa-primary-dark); border-color:var(--toa-primary-dark); }

/* pločice: bez boje, samo neutralno + akcent za današnji */
.toa-day-icon, .toa-slot-icon, .toa-today-icon,
.toa-day-icon.c1, .toa-day-icon.c2, .toa-day-icon.c3, .toa-day-icon.c4, .toa-day-icon.c5,
.toa-slot-icon.c1, .toa-slot-icon.c2, .toa-slot-icon.c3, .toa-slot-icon.c4, .toa-slot-icon.c5{
    background:var(--toa-primary-soft); color:var(--toa-primary); border-radius:9px;
}
.toa-avatar, .toa-avatar.a1, .toa-avatar.a2, .toa-avatar.a3, .toa-avatar.a4, .toa-avatar.a5{
    background:var(--toa-primary-soft); color:var(--toa-primary); border-radius:9px; font-weight:600;
}

/* ocjene: sivi stupnjevi, peticа istaknuta */
.toa-grade{ border-radius:8px; font-weight:700; }
.toa-grade.g1{ background:#b4483c; }
.toa-grade.g2{ background:#a97b4a; }
.toa-grade.g3{ background:#9a9ca4; }
.toa-grade.g4{ background:#54565f; }
.toa-grade.g5{ background:#16171b; }

/* oznake */
.toa-pill, .toa-card-badge, .toa-lit-rank, .toa-daybar-badge, .toa-version-badge{
    border-radius:6px; font-weight:600; letter-spacing:.02em;
}
.toa-pill.strong{ background:var(--toa-primary-dark); }
.toa-lit-rank{ text-transform:lowercase; letter-spacing:0; font-weight:600; }
.toa-lit-rank.svetkovina{ background:var(--toa-primary-dark); color:#fff; }
.toa-lit-rank.blagdan{ background:var(--toa-primary-soft); color:var(--toa-primary-dark); }
.toa-lit-rank.nedjelja{ background:var(--toa-gold-soft); color:var(--toa-gold); }
.toa-lit-rank.ferija{ background:transparent; color:#c2c3c8; }
.toa-lit-row.solemn{ background:transparent; }
.toa-lit-row.sun .toa-lit-date b{ color:var(--toa-gold); }
.toa-lit-imendan{ display:block; font-size:11.5px; color:var(--toa-muted); margin-top:2px; }
.toa-imendan{ font-size:13px; color:var(--toa-muted); margin:-6px 2px 14px; }
.toa-imendan b{ color:var(--toa-text); font-weight:600; }

/* kalendar */
.toa-cal-cell{ background:transparent; border:1px solid transparent; border-radius:8px; }
.toa-cal-cell.has:not(.today){ background:var(--toa-primary-soft); }
.toa-cal-cell.today{ background:var(--toa-primary-dark); }
.toa-cal-feast{ background:var(--toa-gold); }
.toa-cal-load{ background:var(--toa-primary); border-radius:6px; }
.toa-cal-cell.solemn{ box-shadow:none; border-color:var(--toa-gold); }
.toa-cal-cell.feastday{ box-shadow:none; border-color:var(--toa-border); }
.toa-legend .lg-solemn{ box-shadow:inset 0 0 0 1px var(--toa-gold); }
.toa-legend .lg-today{ background:var(--toa-primary-dark); }

/* traka blagdana i citat */
.toa-feast-banner{ background:var(--toa-gold-soft); border-radius:10px; }
.toa-feast-banner strong{ color:var(--toa-gold); }
.toa-feast-banner small{ color:#b09a70; }
.toa-feast-dot{ background:var(--toa-gold); }
.toa-quote{ border-left:2px solid var(--toa-gold); border-radius:12px; }
.toa-quote-mark{ color:var(--toa-gold); }
.toa-quote-text{ color:var(--toa-text); font-weight:500; }

/* navigacija */
.toa-nav{ box-shadow:none; border-top:1px solid var(--toa-border); border-radius:0; }
.toa-nav-btn.active{ color:var(--toa-primary-dark); }
.toa-fab{ background:var(--toa-primary-dark); box-shadow:0 2px 8px rgba(22,23,27,.20); }
.toa-toast{ background:var(--toa-primary-dark); border-radius:10px; }
.toa-feast{ color:var(--toa-gold); }

/* ==========================================================
   v4.3 — TAMNA TEMA
   Bira se gumbom u zaglavlju; ako korisnik nije birao, uzima
   se postavka uređaja. Izbor se pamti na tom uređaju.
   ========================================================== */
.toa-header-btn-theme{ right:62px; background:var(--toa-card); }
.toa-theme-light{ display:none; }
.toa-theme-dark{ display:flex; }
html[data-toa-theme="dark"] .toa-theme-dark{ display:none; }
html[data-toa-theme="dark"] .toa-theme-light{ display:flex; }

html[data-toa-theme="dark"]{ background:#0f1012; }
html[data-toa-theme="dark"] body{ background:#0f1012; }

html[data-toa-theme="dark"] #toa-app,
html[data-toa-theme="dark"] .toa-landing{
    --toa-bg:#0f1012;
    --toa-card:#17181c;
    --toa-text:#e9eaec;
    --toa-muted:#8b8d95;
    --toa-border:#26272d;
    --toa-line:#212228;
    --toa-primary-soft:#22242a;
    --toa-primary:#a8aab3;
    --toa-primary-dark:#f0f0f2;
    --toa-gold:#d4a24d;
    --toa-gold-soft:#2a2418;
    --toa-danger:#e0796a;
    --toa-danger-soft:#2d1e1b;
    --toa-ok:#5ea986;
    --toa-ok-soft:#18241f;
    --toa-shadow:none;
    --toa-shadow-lg:none;
}

/* elementi kojima je tinta bila pozadina — u tamnoj temi se okreću */
html[data-toa-theme="dark"] .toa-todaybar{ color:#16171b; }
html[data-toa-theme="dark"] .toa-todaybar-txt small{ color:#4a4c53; opacity:1; }
html[data-toa-theme="dark"] .toa-todaybar-icon{ background:rgba(22,23,27,.10); }
html[data-toa-theme="dark"] .toa-todaybar-cta{ background:#16171b; color:#f0f0f2; }
html[data-toa-theme="dark"] .toa-btn-primary,
html[data-toa-theme="dark"] .toa-fab,
html[data-toa-theme="dark"] .toa-chip.active,
html[data-toa-theme="dark"] .toa-seg-btn.active,
html[data-toa-theme="dark"] .toa-pill.strong,
html[data-toa-theme="dark"] .toa-lit-rank.svetkovina,
html[data-toa-theme="dark"] .toa-toast{ color:#16171b; }
html[data-toa-theme="dark"] .toa-cal-cell.today .toa-cal-num{ color:#16171b; }
html[data-toa-theme="dark"] .toa-cal-load{ background:#4a4d56; color:#f0f0f2; }
html[data-toa-theme="dark"] .toa-grade.g5{ background:#f0f0f2; color:#16171b; }
html[data-toa-theme="dark"] .toa-grade.g4{ background:#6c6f79; }
html[data-toa-theme="dark"] .toa-grade.g3{ background:#4a4d56; }
html[data-toa-theme="dark"] .toa-lit-rank.ferija{ color:#4e5058; }
html[data-toa-theme="dark"] .toa-hero-art{ opacity:.10; }
html[data-toa-theme="dark"] .toa-filter,
html[data-toa-theme="dark"] .toa-field select{
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238b8d95' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");
}
html[data-toa-theme="dark"] .toa-mark rect{ fill:#f0f0f2; }
html[data-toa-theme="dark"] .toa-mark path:nth-of-type(1){ stroke:#16171b; }
html[data-toa-theme="dark"] .toa-mark path:nth-of-type(2){ stroke:#a8813c; }
html[data-toa-theme="dark"] .toa-sheet-overlay,
html[data-toa-theme="dark"] .toa-confirm-overlay{ background:rgba(0,0,0,.55); }
html[data-toa-theme="dark"] .toa-period-input::placeholder{ color:#5b5d65; }

/* ==========================================================
   v4.3 — TABLET
   ========================================================== */
@media (min-width:820px){
    #toa-app{ max-width:900px; padding-bottom:92px; }
    .toa-main{ padding:12px 24px 104px; }
    .toa-header{ padding:calc(18px + env(safe-area-inset-top)) 24px 14px; }
    .toa-header-title{ font-size:22px; }
    .toa-pagehead h2{ font-size:28px; }
    .toa-hero{ padding:22px 24px; }
    .toa-hero h2{ font-size:24px; }
    .toa-hero-art{ width:140px; height:140px; }

    .toa-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start; }
    .toa-grid > *{ margin-bottom:0 !important; }

    .toa-slots{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
    .toa-statgrid{ grid-template-columns:repeat(3,1fr); }
    .toa-cal-cell{ aspect-ratio:auto; min-height:62px; }
    .toa-cal-num{ font-size:15px; }

    .toa-lit{ columns:2; column-gap:28px; padding:10px 20px; }
    .toa-lit-row{ break-inside:avoid; }

    .toa-seg{ max-width:340px; }
    .toa-week-nav{ max-width:420px; }

    /* donja traka postaje plutajuća pilula na sredini */
    .toa-nav{
        max-width:620px; left:0; right:0;
        margin:0 auto calc(14px + env(safe-area-inset-bottom));
        border:1px solid var(--toa-border); border-radius:16px;
        padding:7px 10px;
    }
    .toa-nav-btn small{ font-size:11px; }
    .toa-nav-btn .toa-ico{ width:20px; height:20px; }
    .toa-fab{
        right:calc(50% - 450px + 24px);
        bottom:calc(92px + env(safe-area-inset-bottom)) !important;
    }
    .toa-toast{ bottom:calc(104px + env(safe-area-inset-bottom)); }
    .toa-sheet{ max-width:620px; border-radius:18px; margin:0 auto calc(14px + env(safe-area-inset-bottom)); }
}

@media (min-width:1024px){
    #toa-app{ max-width:1040px; }
    .toa-fab{ right:calc(50% - 520px + 24px); }
    .toa-lit{ columns:2; }
    .toa-slots{ grid-template-columns:repeat(3,1fr); }
}

/* ==========================================================
   v4.4 — DANI U PLANERU UVIJEK JEDAN ISPOD DRUGOG
   i međukorak za tablete u okomitom položaju (iPad mini i sl.)
   ========================================================== */

/* dani u tjednu se nikad ne dijele u dva stupca — jedan dan, jedan red */
.toa-grid-days{ display:block !important; }
.toa-grid-days > .toa-day-card{ margin-bottom:10px !important; }

/* tablet u okomitom položaju: šira ploha, ali sve u jednom stupcu */
@media (min-width:700px) and (max-width:819px){
    #toa-app{ max-width:720px; }
    .toa-main{ padding:10px 22px 96px; }
    .toa-header{ padding-left:22px; padding-right:22px; }
    .toa-header-title{ font-size:21px; }
    .toa-pagehead h2{ font-size:26px; }
    .toa-hero{ padding:20px 22px; }
    .toa-hero h2{ font-size:22px; }
    .toa-seg{ max-width:340px; }
    .toa-week-nav{ max-width:420px; }
    .toa-cal-cell{ aspect-ratio:auto; min-height:58px; }
    .toa-nav{
        max-width:560px; left:0; right:0;
        margin:0 auto calc(12px + env(safe-area-inset-bottom));
        border:1px solid var(--toa-border); border-radius:16px;
    }
    .toa-fab{
        right:calc(50% - 360px + 22px);
        bottom:calc(88px + env(safe-area-inset-bottom)) !important;
    }
    .toa-sheet{ max-width:560px; border-radius:18px;
        margin:0 auto calc(12px + env(safe-area-inset-bottom)); }
    .toa-toast{ bottom:calc(100px + env(safe-area-inset-bottom)); }
}
