/* ============================= */
/* LOGIN FORMA NA LOGIN STRANI */
/* ============================= */


/* centriranje */
.login-wrapper {
    height: 90vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* glass card */
.login-form {
    width: 360px;
    padding: 40px 30px;
    border-radius: 20px;
    background: rgba(255,255,255,0.05);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255,255,255,0.1);
    box-shadow: 0 20px 40px rgba(0,0,0,0.5);
    text-align: center;
    color: #fff;
}

/* logo */
.logo-box img {
    width: 160px;
    margin-bottom: 20px;
}

/* naslov */
.login-form h2 {
    margin-bottom: 30px;
    font-weight: 500;
}

/* input grupa sa ikonicom */
.input-group {
    position: relative;
    margin-bottom: 25px;
}

/* IKONA */
.input-group i {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(255,255,255,0.6);
    font-size: 14px;
}

/* input pomeren zbog ikonice */
.input-group input {
    width: 100%;
    padding: 14px 10px 14px 30px;
    border: none;
    outline: none;
    background: transparent;
    border-bottom: 1px solid rgba(255,255,255,0.3);
    color: #fff;
    font-size: 14px;
}

/* label */
.input-group label {
    position: absolute;
    top: 14px;
    left: 30px;
    color: rgba(255,255,255,0.6);
    font-size: 13px;
    pointer-events: none;
    transition: 0.3s;
}

/* fokus efekat */
.input-group input:focus + label,
.input-group input:valid + label {
    top: -8px;
    font-size: 11px;
    color: #c9a86a;
}

/* gold efekat na ikonici */
.input-group input:focus ~ i {
    color: #c9a86a;
}

/* border fokus */
.input-group input:focus {
    border-bottom: 1px solid #c9a86a;
}

/* remember + forgot */
.form-row {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    margin-bottom: 25px;
}

.form-row a {
    color: #c9a86a;
    text-decoration: none;
}

/* dugme */
.login-btn {
    width: 100%;
    padding: 12px;
    border-radius: 30px;
    border: none;
    background: linear-gradient(135deg, #c9a86a, #b89650);
    color: #000;
    font-weight: 600;
    cursor: pointer;
    transition: 0.3s;
}

.login-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(201,168,106,0.3);
}


/* eye dugme */
.toggle-password {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: rgba(255,255,255,0.6);
    font-size: 14px;
    transition: 0.3s;
}

.toggle-password:hover {
    color: #c9a86a;
}

/* pomeri input da ne udara u eye */
.input-group input {
    padding: 14px 35px 14px 30px;
}

/* ===== FIX ZA BOJU POLJA (VAŽNO) ===== */

/* uklanja autofill žutu */
input:-webkit-autofill,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
    -webkit-text-fill-color: #fff !important;
    transition: background-color 9999s ease-in-out 0s;
}

/* uklanja promenu pozadine kad je valid */
input:valid,
input:focus,
input:active {
    background: transparent !important;
    box-shadow: none !important;
}

/* zadržava boju teksta */
.input-group input {
    color: #fff;
}

/************************************
        ANIMACIJA LOGIN GORMA 
*************************************/
/* ===============================
   LOGIN MARBLE PREMIUM ANIMATION
================================ */

.marble-anim {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    background-size: cover;
    background-position: center;

    /* glow + shadow */
    box-shadow:
        0 20px 40px rgba(0,0,0,0.6),
        0 0 30px rgba(201,168,106,0.15);

    animation: glowPulse 4s ease-in-out infinite;
}

/* ===============================
   GOLD SWEEP (lux efekat)
================================ */
.marble-anim::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -75%;
    width: 200%;
    height: 200%;
    pointer-events: none;

    background: linear-gradient(
        120deg,
        transparent 40%,
        rgba(201,168,106,0.15) 50%,
        rgba(255,215,150,0.25) 52%,
        rgba(201,168,106,0.15) 54%,
        transparent 60%
    );

    transform: rotate(25deg);
    animation: goldSweep 6s linear infinite;
}

/* ===============================
   SHIMMER (suptilno kretanje svetla)
================================ */
.marble-anim::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;

    background: radial-gradient(
        circle at 20% 30%,
        rgba(255,255,255,0.06),
        transparent 60%
    );

    animation: shimmer 8s ease-in-out infinite alternate;
}

/* ===============================
   ANIMACIJE
================================ */

@keyframes goldSweep {
    0% {
        transform: translateX(-100%) rotate(25deg);
    }
    100% {
        transform: translateX(100%) rotate(25deg);
    }
}

@keyframes shimmer {
    0% {
        opacity: 0.3;
        transform: translateY(0);
    }
    100% {
        opacity: 0.6;
        transform: translateY(-10px);
    }
}

/* glow pulsiranje */
@keyframes glowPulse {
    0%,100% {
        box-shadow:
            0 20px 40px rgba(0,0,0,0.6),
            0 0 20px rgba(201,168,106,0.1);
    }
    50% {
        box-shadow:
            0 25px 50px rgba(0,0,0,0.7),
            0 0 40px rgba(201,168,106,0.25);
    }
}

/* ===============================
   BELI MERMER BACKGROUND
================================ */
.bg-mermer-beli {
    background-image: url('../../slike/pozadina/beli-mermer-zlatne-zile.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* opcioni overlay za kontrast (lagano zatamnjenje) */
.bg-mermer-beli.overlay::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.4);
    pointer-events: none;
}


/* ===============================
   CRNI MERMER BACKGROUND
================================ */
.bg-mermer-crni {
    background-image: url('../../slike/pozadina/crni-mermer-zlatne-zile.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* opcioni overlay za bolji kontrast */
.bg-mermer-crni.overlay::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.4);
    pointer-events: none;
}

.bg-mermer-beli,
.bg-mermer-crni {
    background-attachment: fixed;
}

/********************************************
ADMIN PANEL
********************************************/
.admin-wrap{
    padding:100px 0;
    min-height:100vh;
}
.admin-sidebar{
    padding:25px;
    border-radius:20px;
    box-shadow:0 20px 40px rgba(0,0,0,0.15);
}
.admin-btn{
    display:block;
    width:100%;
    padding:15px 18px;
    margin-bottom:12px;
    border-radius:14px;
    color:#fff;
	font-size: 14px;
    text-decoration:none;
    font-weight:600;
    background:linear-gradient(135deg,#1b1b1b,#2b2b2b);
    transition:0.3s;
    border:1px solid rgba(201,168,106,0.15);
}
.admin-btn:hover{
    background:linear-gradient(135deg,#c9a86a,#b89650);
    color:#000;
    padding-left:25px;
}
.admin-content{
    background:#fff;
    border-radius:20px;
    padding:35px;
    box-shadow:0 20px 40px rgba(0,0,0,0.08);
    min-height:650px;
}
.admin-title{
    font-size:28px;
    font-weight:700;
    margin-bottom:25px;
	color: #c9a86a
}
.admin-actions a{
    margin-right:10px;
    margin-bottom:10px;
}
.admin-form input,
.admin-form select{
    width:100%;
    height:50px;
    border:1px solid #ddd;
    border-radius:12px;
    padding:9px 15px;
    margin-bottom:15px;
}
.admin-form button{
    background:linear-gradient(135deg,#c9a86a,#b89650);
    border:none;
    padding:12px 30px;
    border-radius:12px;
    font-weight:700;
}
/********************************************
  LUXURY TABLE (DESNI DEO)
********************************************/
.kat-table{
    width:100%;
    border-collapse:separate;
    border-spacing:0 10px;
    margin-top:15px;
}

.kat-table th{
    background:linear-gradient(135deg,#111,#1c1c1c);
    color:#c9a86a;
    padding:14px 16px;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:1px;
    border:none;
}

.kat-table th:first-child{
    border-radius:12px 0 0 12px;
}

.kat-table th:last-child{
    border-radius:0 12px 12px 0;
}

.kat-table td{
    background:#fff;
    padding:14px 16px;
    font-size:14px;
    color:#222;
    border-top:1px solid rgba(201,168,106,0.15);
    border-bottom:1px solid rgba(201,168,106,0.15);
    transition:0.3s ease;
    box-shadow:0 6px 14px rgba(0,0,0,0.04);
}

.kat-table td:first-child{
    border-radius:12px 0 0 12px;
    font-weight:700;
    color:#b89045;
}

.kat-table td:last-child{
    border-radius:0 12px 12px 0;
}

.kat-table tr:hover td{
    background:linear-gradient(90deg,#fff,#faf7f0);
    transform:scale(1.01);
    box-shadow:0 10px 22px rgba(0,0,0,0.08);
}

/* zebra */
.kat-table tr:nth-child(even) td{
    background:#fcfcfc;
}
/* =========================
   BUTTON VARIANTS (DELUXE)
========================= */

/* COMMON BASE (za sve dugmice) */
.admin-actions a{
    position:relative;
    overflow:hidden;
    transition:all 0.35s ease;
}

/* shiny sweep efekat */
.admin-actions a::before{
    content:'';
    position:absolute;
    top:0;
    left:-130%;
    width:120%;
    height:100%;
    background:linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,0.35),
        transparent
    );
    transition:0.7s ease;
}

.admin-actions a:hover::before{
    left:130%;
}

/* lift efekat */
.admin-actions a:hover{
    transform:translateY(-4px) scale(1.02);
}

/* =========================
   DARK PREMIUM (PRIMARY)
========================= */
.admin-actions .btn-primary{
    background:linear-gradient(135deg,#111111,#000000,#1a1a1a);
    color:#d4b06a !important;
    border:1px solid rgba(212,176,106,0.7);
    box-shadow:0 12px 30px rgba(0,0,0,0.25);
}

.admin-actions .btn-primary:hover{
    box-shadow:0 18px 45px rgba(0,0,0,0.4);
}

/* =========================
   GOLD LUXE
========================= */
.admin-actions .btn-info{
    background:linear-gradient(135deg,#f7e6b0,#d4b06a,#c9a86a);
    color:#111 !important;
    border:none;
    box-shadow:0 10px 25px rgba(201,168,106,0.25);
    position:relative;
    overflow:hidden;
}

.admin-actions .btn-info:hover{
    box-shadow:0 18px 45px rgba(201,168,106,0.4);
}

/* gold inner shine */
.admin-actions .btn-info::after{
    content:'';
    position:absolute;
    inset:0;
    background:radial-gradient(circle at top left, rgba(255,255,255,0.4), transparent 60%);
    opacity:0;
    transition:0.4s;
}

.admin-actions .btn-info:hover::after{
    opacity:1;
}

/* =========================
   RED PREMIUM
========================= */
.admin-actions .btn-danger{
    background:linear-gradient(135deg,#2a0000,#6d0000,#a10000);
    color:#fff !important;
    border:none;
    box-shadow:0 12px 28px rgba(161,0,0,0.25);
}

.admin-actions .btn-danger:hover{
    box-shadow:0 18px 45px rgba(161,0,0,0.4);
}
.admin-actions a{
    font-size:15px;
    font-weight:600;
    letter-spacing:1.5px;
	border-radius:999px; /* full pill dugmad */
}

/* **********************
DUGME ADMIN SACUVAJ
***********************/
.admin-save-btn{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:14px 32px;
    border-radius:14px;

    font-size:13px;
    font-weight:800;
    letter-spacing:1.5px;
    text-transform:uppercase;

    color:#111;
    background:linear-gradient(135deg,#f7e6b0,#d4b06a,#c9a86a);
    border:none;

    cursor:pointer;
    transition:all 0.35s ease;

    box-shadow:0 12px 28px rgba(201,168,106,0.25);
    overflow:hidden;
}

/* shine efekat */
.admin-save-btn::before{
    content:'';
    position:absolute;
    top:0;
    left:-130%;
    width:120%;
    height:100%;
    background:linear-gradient(120deg,transparent,rgba(255,255,255,0.4),transparent);
    transition:0.7s ease;
}

.admin-save-btn:hover::before{
    left:130%;
}

/* hover efekat */
.admin-save-btn:hover{
    transform:translateY(-3px) scale(1.03);
    box-shadow:0 18px 45px rgba(201,168,106,0.4);
}

/* klik efekat */
.admin-save-btn:active{
    transform:translateY(0px) scale(0.98);
}
/********************************************
CSS (LUXURY DROPDOWN – dodaj u admin CSS)
********************************************/

.admin-select-premium{
    width:100%;
    height:56px;
    font-size:16px;
    font-weight:600;
    padding:0 18px;
    border-radius:14px;

    color:#111;
    background:linear-gradient(145deg,#ffffff,#f7f7f7);

    border:1px solid rgba(201,168,106,0.35);

    box-shadow:0 10px 25px rgba(0,0,0,0.06);

    transition:0.3s ease;
    cursor:pointer;

    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
}

/* hover luks efekat */
.admin-select-premium:hover{
    border-color:#c9a86a;
    box-shadow:0 14px 35px rgba(201,168,106,0.25);
    transform:translateY(-1px);
}

/* focus premium glow */
.admin-select-premium:focus{
    outline:none;
    border-color:#b89650;
    box-shadow:0 0 0 4px rgba(201,168,106,0.18);
}

/* mala "arrow" estetika (moderni UI trik) */
.admin-select-premium{
    background-image:
        linear-gradient(45deg, transparent 50%, #c9a86a 50%),
        linear-gradient(135deg, #c9a86a 50%, transparent 50%);
    background-position:
        calc(100% - 22px) 50%,
        calc(100% - 16px) 50%;
    background-size:6px 6px, 6px 6px;
    background-repeat:no-repeat;
}
/********************************************
CSS (LUXURY INPUT – dodaj u admin CSS)
********************************************/
.admin-input-premium{
    width:100%;
    height:58px;
    font-size:16px;
    font-weight:600;
    padding:0 18px;

    color:#111;

    background:linear-gradient(145deg,#ffffff,#f6f6f6);
    border:1px solid rgba(201,168,106,0.35);

    border-radius:16px;

    box-shadow:
        0 10px 25px rgba(0,0,0,0.06),
        inset 0 1px 0 rgba(255,255,255,0.8);

    transition:all .3s ease;

    outline:none;
}

/* hover – isti kao select */
.admin-input-premium:hover{
    border-color:#c9a86a;
    box-shadow:
        0 16px 40px rgba(201,168,106,0.25),
        inset 0 1px 0 rgba(255,255,255,0.9);
    transform:translateY(-2px);
}

/* focus – luxury glow */
.admin-input-premium:focus{
    border-color:#b89650;
    box-shadow:
        0 0 0 4px rgba(201,168,106,0.18),
        0 16px 40px rgba(0,0,0,0.08);
}

/* placeholder stil (ako koristiš) */
.admin-input-premium::placeholder{
    color:#888;
    font-weight:500;
}

/* ===========================
   PREMIUM ADMIN PORUKE
=========================== */

.admin-msg{
    width:100%;
    padding:16px 20px;
    margin-bottom:25px;
    border-radius:14px;
    font-size:13px;
    font-weight:600;
    letter-spacing:.3px;
    box-shadow:0 10px 25px rgba(0,0,0,0.08);
    border-left:4px solid transparent;
    animation:fadeAdmin .3s ease;
}

/* SUCCESS - soft green */
.admin-msg.success{
    background:#f2fbf5;
    color:#1f7a3a;
    border-left-color:#2ecc71;
}

/* ERROR - soft red */
.admin-msg.error{
    background:#fff2f2;
    color:#a12a2a;
    border-left-color:#e74c3c;
}

/* WARNING - soft gold */
.admin-msg.warning{
    background:#fff9ed;
    color:#8a6a1a;
    border-left-color:#d4af37;
}

@keyframes fadeAdmin{
    from{opacity:0; transform:translateY(-8px);}
    to{opacity:1; transform:translateY(0);}
}

/********************************************
DASHBOARD PREMIUM
********************************************/
.dash-head{
    margin-bottom:35px;
    text-align:center;
}

.dash-head h2{
    font-size:34px;
    font-weight:800;
    color:#111;
    margin-bottom:8px;
}

.dash-head p{
    color:#8a7a55;
    font-size:15px;
    letter-spacing:1px;
}

.dash-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-bottom:35px;
}

/* TABLET */
@media (max-width: 992px){
    .dash-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

/* MOBILE */
@media (max-width: 576px){
    .dash-grid{
        grid-template-columns:1fr;
    }
}

.dash-card{
    background:linear-gradient(145deg,#ffffff,#f8f5ef);
    border:1px solid rgba(201,168,106,0.25);
    border-radius:22px;
    padding:30px 20px;
    text-align:center;
    box-shadow:0 12px 30px rgba(0,0,0,0.06);
    transition:.35s;
}

.dash-card:hover{
    transform:translateY(-5px);
    box-shadow:0 20px 45px rgba(201,168,106,0.18);
}

.dash-card i{
    font-size:28px;
    color:#c9a86a;
    margin-bottom:15px;
}

.dash-card h3{
    font-size:28px;
    font-weight:800;
    margin-bottom:5px;
}

.dash-card span{
    font-size:13px;
    text-transform:uppercase;
    color:#777;
    letter-spacing:1px;
}

.dash-bottom-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:25px;
}

/* TABLET */
@media (max-width: 992px){
    .dash-bottom-row{
        grid-template-columns:1fr;
    }
}

.dash-panel-left,
.dash-panel-right{
    background:linear-gradient(145deg,#fff,#faf7f0);
    border:1px solid rgba(201,168,106,0.22);
    border-radius:22px;
    padding:25px;
    box-shadow:0 12px 30px rgba(0,0,0,0.05);
}

.dash-panel-left h4,
.dash-panel-right h4{
    margin-bottom:20px;
    font-size:20px;
    font-weight:700;
}

.quick-btn{
    display:block;
    margin-bottom:15px;
    padding:14px 18px;
    border-radius:14px;
    text-decoration:none;
    font-weight:700;
    background:linear-gradient(135deg,#111,#1b1b1b);
    color:#d4b06a;
    transition:.3s;
}

.quick-btn:hover{
    background:linear-gradient(135deg,#c9a86a,#b89650);
    color:#111;
    padding-left:25px;
}

.status-line{
    display:flex;
    justify-content:space-between;
    padding:12px 0;
    border-bottom:1px solid rgba(201,168,106,0.15);
    font-size:14px;
}

.status-line b{
    color:#2d7a32;
}

/********************************************
LIVE SAT U DASHBOARD HEADERU
********************************************/
.dash-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    margin-bottom:35px;
    flex-wrap:wrap;
}

.dash-head-left h2{
    margin-bottom:8px;
}

.dash-live-clock{
    min-width:240px;
    padding:18px 22px;
    border-radius:18px;

    background:linear-gradient(135deg,#111,#222);
    border:1px solid rgba(212,176,106,0.25);

    box-shadow:
        0 15px 35px rgba(0,0,0,0.20),
        0 0 18px rgba(212,176,106,0.08);

    text-align:center;
    position:relative;
    overflow:hidden;
}

.dash-live-clock::before{
    content:'';
    position:absolute;
    top:0;
    left:15%;
    width:70%;
    height:2px;
    background:linear-gradient(90deg,transparent,#d4b06a,transparent);
}

@media (max-width: 768px){
    .dash-head{
        flex-direction:column;
        text-align:center;
    }

    .dash-live-clock{
        width:100%;
    }
}

#liveTime{
    font-size:32px;
    font-weight:800;
    color:#d4b06a;
    letter-spacing:3px;
    line-height:1;
    text-shadow:0 0 10px rgba(212,176,106,0.20);
}

#liveDate{
    margin-top:8px;
    font-size:12px;
    color:#ddd;
    text-transform:uppercase;
    letter-spacing:1px;
    font-weight:600;
}

.dash-activity-log{
    margin-top:25px;
    padding-top:15px;
    border-top:1px solid rgba(201,168,106,0.25);
	 width:100%;
    grid-column:1 / -1;
}

.dash-activity-log h4{
    font-size:14px;
    font-weight:800;
    letter-spacing:1px;
    text-transform:uppercase;
    margin-bottom:15px;
    color:#111;
}

/* item */
.log-item{
    background:linear-gradient(135deg,#fff,#f7f7f7);
    border:1px solid rgba(0,0,0,0.05);
    border-left:4px solid #c9a86a;
    padding:10px 12px;
    border-radius:12px;
    margin-bottom:10px;
    transition:0.3s ease;
}

/* hover luks */
.log-item:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

/* top row */
.log-top{
    display:flex;
    justify-content:space-between;
    font-size:11px;
    font-weight:700;
    margin-bottom:4px;
}

.log-action{
    color:#c9a86a;
    text-transform:uppercase;
}

.log-time{
    color:#777;
}

/* opis */
.log-desc{
    font-size:13px;
    color:#222;
    margin-bottom:4px;
}

/* user */
.log-user{
    font-size:11px;
    color:#999;
    font-weight:600;
}

@media (max-width: 576px){
    .dash-activity-log{
        width:100%;
    }

    .log-item{
        font-size:13px;
    }
}

.status-line{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:8px 0;
    font-size:13px;
    color:#222;
    border-bottom:1px dashed rgba(0,0,0,0.08);
}

.status-line span{
    color:#444;
    font-weight:600;
}

/* BASE BADGE */
.status-badge{
    padding:4px 10px;
    border-radius:999px;
    font-size:11px;
    font-weight:800;
    letter-spacing:1px;
    text-transform:uppercase;
}

/* ONLINE */
.status-badge.online{
    background:linear-gradient(135deg,#0f3d1f,#1f7a3a);
    color:#b9ffcf;
    box-shadow:0 6px 15px rgba(31,122,58,0.25);
}

/* ACTIVE SESSION */
.status-badge.active{
    background:linear-gradient(135deg,#1a2a4a,#2d4f8f);
    color:#cfe3ff;
    box-shadow:0 6px 15px rgba(45,79,143,0.25);
}

/* DATE */
.status-date{
    font-weight:700;
    color:#111;
}

.status-badge.online{
    animation:pulseOnline 1.8s infinite;
}

@keyframes pulseOnline{
    0%{opacity:1; box-shadow:0 0 10px rgba(31,122,58,0.2);}
    50%{opacity:0.7; box-shadow:0 0 20px rgba(31,122,58,0.5);}
    100%{opacity:1; box-shadow:0 0 10px rgba(31,122,58,0.2);}
}

.log-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:5px;
}

/* LEFT SIDE (dot + action) */
.log-left{
    display:flex;
    align-items:center;
    gap:8px;
}

/* DOT */
.log-dot{
    width:10px;
    height:10px;
    border-radius:50%;
    background:#999;
    box-shadow:0 0 10px rgba(0,0,0,0.1);
}

/* ACTION TEXT */
.log-action{
    font-size:11px;
    font-weight:800;
    letter-spacing:1px;
    text-transform:uppercase;
}

/* =========================
   COLOR RULES
========================= */

/* DODAVANJE - ZELENO */
.log-item.dodavanje .log-dot{
    background:#28c76f;
    box-shadow:0 0 12px rgba(40,199,111,0.6);
}

.log-item.dodavanje .log-action{
    color:#28c76f;
}

/* IZMENA - PLAVO */
.log-item.izmena .log-dot{
    background:#2f80ed;
    box-shadow:0 0 12px rgba(47,128,237,0.6);
}

.log-item.izmena .log-action{
    color:#2f80ed;
}

/* BRISANJE - CRVENO */
.log-item.brisanje .log-dot{
    background:#eb5757;
    box-shadow:0 0 12px rgba(235,87,87,0.6);
}

.log-item.brisanje .log-action{
    color:#eb5757;
}
/* =========================
   ADMIN AKTIVNOSTI
========================= */
.log-filter-bar{
    display:grid;
    grid-template-columns:2fr 2fr 3fr 2fr 1fr;
    gap:15px;
    margin-bottom:25px;
    align-items:center;
}

.badge-green,
.badge-blue,
.badge-red{
    padding:6px 12px;
    border-radius:999px;
    font-size:11px;
    font-weight:800;
    letter-spacing:1px;
}

.badge-green{
    background:#eefcf2;
    color:#1f7a3a;
}

.badge-blue{
    background:#eef4ff;
    color:#2f80ed;
}

.badge-red{
    background:#fff1f1;
    color:#d63031;
}

.pagination-wrap{
    margin-top:25px;
    text-align:center;
}

.pagination-wrap a{
    display:inline-block;
    padding:10px 14px;
    margin:0 4px;
    border-radius:10px;
    background:#f3f3f3;
    color:#111;
    text-decoration:none;
    font-weight:700;
    transition:.3s;
}

.pagination-wrap a:hover{
    background:#d4b06a;
}

.pagination-wrap .active-page{
    background:#111;
    color:#d4b06a;
}
.pagination-wrap .dots{
    display:inline-block;
    padding:10px 8px;
    font-weight:700;
    color:#999;
}

/* PREMIMUM AKTIVNOSTI LOG*/
.audit-stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
    margin-bottom:30px;
}

.audit-card{
    background:linear-gradient(145deg,#fff,#faf7f0);
    border-radius:18px;
    padding:22px;
    box-shadow:0 12px 30px rgba(0,0,0,0.05);
    border:1px solid rgba(201,168,106,0.18);
    color:#111 !important;
}

.audit-card *{
    color:#111 !important;
}

.audit-card span{
    font-size:12px;
    text-transform:uppercase;
    color:#444 !important;
    letter-spacing:1px;
    font-weight:700;
}

.audit-card h3{
    margin-top:10px;
    font-size:30px;
    font-weight:800;
    color:#111 !important;
}

/* brojevi po akciji ostaju obojeni */
.audit-card.add h3{ color:#1f7a3a !important; }
.audit-card.edit h3{ color:#2f80ed !important; }
.audit-card.del h3{ color:#d63031 !important; }

.activity-row{
    cursor:pointer;
}

.activity-row td{
    color:#111 !important;
}

.activity-row:hover td{
    background:#faf7f0 !important;
}

/* MODAL */
.activity-modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.65);
    display:none;
    justify-content:center;
    align-items:center;
    z-index:999999;
}

.activity-modal.show{
    display:flex;
}

.activity-modal-box{
    width:520px;
    background:#fff;
    border-radius:22px;
    padding:35px;
    box-shadow:0 25px 60px rgba(0,0,0,0.25);
    position:relative;
    color:#111 !important;
}

.activity-modal-box *{
    color:#111 !important;
}

.activity-modal-box h3{
    margin-bottom:25px;
    font-size:24px;
    font-weight:800;
    color:#111 !important;
}

.close-activity-modal{
    position:absolute;
    top:18px;
    right:20px;
    font-size:28px;
    cursor:pointer;
    color:#111 !important;
}

.modal-line{
    padding:10px 0;
    border-bottom:1px solid #eee;
    font-size:14px;
    color:#111 !important;
}

.gallery-badge{
    position:absolute;
    top:15px;
    left:15px;
    background:#c9a24e;
    color:#111;
    padding:5px 10px;
    font-size:12px;
    font-weight:600;
    border-radius:20px;
    z-index:2;
    text-transform:uppercase;
    letter-spacing:0.5px;
}