@tailwind base;
@tailwind components;
@tailwind utilities;

html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

/*body {
  margin-bottom: 60px;
}
*/
/* Globalni spodnji rob naj NE velja za portal (full-bleed) */
body:not(.full-bleed) {
    margin-bottom: 60px;
}
.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/*Za barvanje rdeče object validaciji nav formi*/
@layer components {
    .field-validation-error {
        @apply text-red-600 text-sm mt-1 block;
    }

    .input-validation-error {
        @apply border-red-500 ring-1 ring-red-500 focus:ring-red-500 focus:border-red-500;
    }

    .validation-summary-errors {
        @apply text-red-600 text-sm;
    }
}

/* --- Temporary override for validation colors --- */
span.field-validation-error,
.field-validation-error {
    color: #dc2626 !important; /* Tailwind red-600 */
}

.input-validation-error {
    border-color: #ef4444 !important; /* Tailwind red-500 */
    box-shadow: 0 0 0 1px #ef4444 !important;
}

.btn-orange {
    background-color: #f59e0b;
    color: #fff;
}

    .btn-orange:hover {
        background-color: #d97706;
    }

/* Oranžen status (enako kot gumb) */
.status-orange {
    color: #f59e0b;
    font-weight: 600;
}
    /* amber-500 */
    .status-orange:hover {
        color: #d97706;
    }
/* amber-600 (če kdaj hoveraš) */

/* (za referenco, če bi kdaj rabil še custom) */
.status-green {
    color: #16a34a;
    font-weight: 600;
}
/* green-600 */
.status-red {
    color: #dc2626;
    font-weight: 600;
}
/* red-600  */
.status-gray {
    color: #64748b;
    font-weight: 500;
}
/* slate-500 */
/* Modra (blue) */
.status-blue {
    color: #2563eb; /* Tailwind blue-600 */
    font-weight: 600;
}

    .status-blue:hover {
        color: #1d4ed8; /* Tailwind blue-700 */
    }
/* Portal scoping reset – prepreči globalna pravila, da zlomijo levi meni */
.he-portal .he-nav {
    display: flex;
    flex-direction: column;
}

    .he-portal .he-nav a {
        display: block;
        width: 100%;
    }
/* Failsafe, če kak globalni stil zlomi nav/linke */
.fixed.inset-x-0.top-16 .flex > aside nav {
    display: flex;
    flex-direction: column;
}

    .fixed.inset-x-0.top-16 .flex > aside nav a {
        display: block;
        width: 100%;
    }

.modal-backdrop.show {
    z-index: 2000 !important;
}

.modal.show {
    z-index: 2050 !important;
}

/*Za drop down menu na _layout*/
/* --- Profile dropdown polish --- */
.profile-trigger {
    border-color: #d0d7de;
    background-color: #fff;
    padding: .4rem .6rem;
}

    .profile-trigger:hover {
        background-color: #f8f9fa;
    }

/* Avatar krogec */
.avatar-circle {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.9rem;
    background: linear-gradient(180deg, #e9ecef, #dee2e6);
    color: #495057;
    border: 1px solid #d0d7de;
}

    .avatar-circle.lg {
        width: 36px;
        height: 36px;
        font-size: 1rem;
    }

/* Meni: širina, odstotki, senca */
.profile-menu {
    min-width: 320px;
    padding: 0;
    box-shadow: 0 10px 30px rgba(0,0,0,.12);
}

    /* Header znotraj menija */
    .profile-menu .menu-header {
        padding-bottom: .5rem;
    }

    /* Dropdown item stil */
    .profile-menu .dropdown-item {
        padding: .6rem .9rem;
        border-radius: .5rem;
        margin: .15rem .5rem;
    }

        .profile-menu .dropdown-item i {
            opacity: .85;
        }

        .profile-menu .dropdown-item:hover,
        .profile-menu .dropdown-item:focus {
            background-color: #f1f3f5;
        }

    /* Divider subtilen */
    .profile-menu .dropdown-divider {
        margin-left: .75rem;
        margin-right: .75rem;
        opacity: .15;
    }

    /* Gumb Logout “poln” in jasen */
    .profile-menu .btn-danger {
        border-radius: .6rem;
        padding: .5rem .75rem;
    }

/* Za ozke zaslone naj bo meni bolj kompakten */
@media (max-width: 375px) {
    .profile-menu {
        min-width: 260px;
    }
}

.e-grid .e-gridheader {
    position: sticky;
    top: 0;
    z-index: 5;
}