:root{
  --aw-brand:#ff6a3d; --aw-brand-shadow:rgba(255,106,61,.35); --aw-bg:#f6f8fb; --aw-card:#ffffff; --aw-text:#1f2937;
  --aw-muted:#6b7280; --aw-border:#e5e7eb; --aw-shadow:0 10px 24px rgba(17,23,42,.08);
}
/* Theme: Blue */
[data-theme="blue"]{
  --aw-brand:#3b82f6; --aw-brand-shadow:rgba(59,130,246,.35);
}
/* Theme: Green */
[data-theme="green"]{
  --aw-brand:#10b981; --aw-brand-shadow:rgba(16,185,129,.35);
}
/* Theme: Purple */
[data-theme="purple"]{
  --aw-brand:#8b5cf6; --aw-brand-shadow:rgba(139,92,246,.35);
}
*{box-sizing:border-box} html,body{height:100%}
body{font-family:'Roboto', system-ui, -apple-system, Segoe UI, Helvetica, Arial; background:var(--aw-bg); color:var(--aw-text)}
a{color:inherit;text-decoration:none}
.aw-bg-elev{background:var(--aw-card)} .aw-border{border-color:var(--aw-border)} .aw-shadow{box-shadow:var(--aw-shadow)}
.aw-bg-sidebar{
  background:
    radial-gradient(circle at 0% 0%, var(--aw-brand-shadow) 0%, transparent 50%),
    radial-gradient(circle at 100% 100%, var(--aw-brand-shadow) 0%, transparent 40%),
    linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0f172a 100%);
  color:#e5e7eb;
  position:relative;
}
.aw-bg-sidebar::before{
  content:"";
  position:absolute;
  inset:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events:none;
  opacity:.5;
}
.aw-bg-sidebar .sidebar-active{background:rgba(255,255,255,.08);position:relative}
.aw-bg-sidebar .sidebar-active:after{content:"";position:absolute;right:0;top:0;bottom:0;width:6px;background:var(--aw-brand)}
.header-grad{background:linear-gradient(180deg, rgba(0,0,0,0), color-mix(in srgb, var(--aw-brand) 6%, transparent));border-bottom:1px solid var(--aw-border)}
.btn-primary{display:inline-flex;align-items:center;gap:.5rem;background:var(--aw-brand);color:#fff;padding:.5rem .75rem;border-radius:1rem;box-shadow:0 6px 14px var(--aw-brand-shadow)}
.btn-primary:hover{filter:brightness(1.03);transform:translateY(-.5px)}
.btn-secondary{display:inline-flex;align-items:center;gap:.5rem;background:var(--aw-card);color:var(--aw-brand);padding:.5rem .75rem;border-radius:1rem;border:2px solid var(--aw-brand);box-shadow:0 4px 12px rgba(0,0,0,.06);transition:all .15s ease}
.btn-secondary:hover{background:var(--aw-brand);color:#fff;box-shadow:0 6px 16px var(--aw-brand-shadow);transform:translateY(-.5px)}
.btn-danger{display:inline-flex;align-items:center;gap:.5rem;background:#ef4444;color:#fff;padding:.5rem .75rem;border-radius:1rem;box-shadow:0 6px 14px rgba(239,68,68,.25);transition:all .15s ease}
.btn-danger:hover{background:#dc2626;box-shadow:0 8px 18px rgba(239,68,68,.3);transform:translateY(-.5px)}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;background:#fff;color:var(--aw-text);padding:.5rem;border-radius:1rem;box-shadow:var(--aw-shadow)}
.table thead th{color:#6b7280;text-transform:uppercase;letter-spacing:.06em;font-size:.75rem}
.table tbody tr:hover{background:rgba(17,23,42,.03)}
.badge{background:#eef2f7;border:1px solid var(--aw-border);padding:.25rem .5rem;border-radius:.5rem;font-size:.75rem;color:#566074}
input,select,textarea{background:#fff;color:#1f2937} .aw-sidebar-wrap{min-height:100vh}
.field-error{border-color:#ef4444!important;background:#fff5f5!important}

/* Validation Error List Styling */
.validation-error-list{display:flex;flex-direction:column;gap:.75rem}
.validation-error-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;background:#fef2f2;border:1px solid #fecaca;border-radius:.75rem;color:#991b1b}
.validation-error-item i,.validation-error-item svg{flex-shrink:0;width:1.25rem;height:1.25rem;color:#dc2626;margin-top:.125rem}
.validation-error-item span{font-size:.875rem;line-height:1.4}
.validation-error-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid #fecaca}
.validation-error-header .error-icon{width:2.5rem;height:2.5rem;border-radius:50%;background:#fee2e2;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.validation-error-header .error-icon i,.validation-error-header .error-icon svg{width:1.25rem;height:1.25rem;color:#dc2626}
.validation-error-header .error-title{font-weight:600;color:#991b1b;font-size:.875rem}
.validation-error-header .error-count{font-size:.75rem;color:#b91c1c;font-weight:500}

.modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.55);display:none;z-index:1000}
.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-48%) scale(.98);opacity:0;background:var(--aw-card);border:1px solid var(--aw-border);width:min(720px,92vw);max-height:80vh;overflow:auto;border-radius:16px;display:none;z-index:1001;box-shadow:var(--aw-shadow);transition:opacity .22s ease,transform .22s ease}
.modal.is-visible{opacity:1;transform:translate(-50%,-50%) scale(1)}
.modal .header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--aw-border)}
.modal .body{padding:1rem 1.25rem} .modal .footer{padding:1rem 1.25rem;border-top:1px solid var(--aw-border);display:flex;justify-content:flex-end;gap:.75rem}
@media(max-width:480px){.modal{width:96vw;max-height:90vh;border-radius:12px}.modal .header,.modal .body,.modal .footer{padding:.75rem 1rem}.modal .footer{flex-wrap:wrap}}
.action-btn{display:inline-flex;align-items:center;justify-content:center;border-radius:0.75rem;padding:0.5rem}
/* Orange hover like 'Добави' */
.action-btn:hover,.hover-lite:hover{ background: var(--aw-brand); color:#fff; }
.action-btn,.hover-lite{ transition: background .15s ease, color .15s ease; }
@keyframes aw-shake { 0% { transform: translateX(0); } 20% { transform: translateX(-6px); } 40% { transform: translateX(6px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(4px); } 100% { transform: translateX(0); } }
.shake{ animation: aw-shake .32s ease; }
/* Glow & Shine effects (global for all buttons) */
.btn-primary, .action-btn { position: relative; overflow: hidden; }
.btn-primary::after, .action-btn::after{
  content:""; position:absolute; top:-150%; left:-50%; width:200%; height:400%;
  background: radial-gradient(circle at 50% 50%, rgba(255,255,255,.35), rgba(255,255,255,0) 60%);
  transform: rotate(25deg) translateX(-100%); transition: transform .5s ease, opacity .3s ease; opacity:.0; pointer-events:none;
}
.btn-primary:hover::after, .action-btn:hover::after{ transform: rotate(25deg) translateX(0%); opacity:.7; }
.btn-primary{ box-shadow: 0 10px 20px var(--aw-brand-shadow), 0 2px 6px rgba(0,0,0,.05); }
.btn-primary:hover{ box-shadow: 0 12px 26px var(--aw-brand-shadow), 0 4px 10px rgba(0,0,0,.06); }
.action-btn{ box-shadow: 0 8px 18px rgba(16,24,40,.10); }
.action-btn:hover{ box-shadow: 0 10px 24px rgba(16,24,40,.16); }


/* Auto-hide desktop sidebar on mobile */
@media (max-width: 767.98px){
  aside.aw-bg-sidebar.aw-sidebar-wrap{ display: none !important; }
}

/* Mobile menu button */
#btnOpenSidebar{
  position:fixed;
  top:0.75rem;
  left:0.75rem;
  z-index:1101;
  transition: opacity .2s ease, visibility .2s ease;
}
#btnOpenSidebar.is-hidden{
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
/* Hide on desktop */
@media (min-width: 768px){
  #btnOpenSidebar{ display: none !important; }
}

/* === Mobile Sidebar Drawer === */
#sidebarMobile{
  position:fixed;
  top:0;
  bottom:0;
  left:0;
  width:min(80vw,18rem);
  transform:translateX(-100%);
  transition:transform .28s ease;
  background:
    radial-gradient(circle at 0% 0%, var(--aw-brand-shadow) 0%, transparent 50%),
    radial-gradient(circle at 100% 100%, var(--aw-brand-shadow) 0%, transparent 40%),
    linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0f172a 100%);
  color:#e5e7eb;
  z-index:1100;
  padding:1rem;
  overflow-y:auto;
}
#sidebarMobile::before{
  content:"";
  position:absolute;
  inset:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events:none;
  opacity:.5;
}
#sidebarMobile.is-open{
  transform:translateX(0);
}
#sidebarMask{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.6);
  opacity:0;
  pointer-events:none;
  z-index:1099;
  transition:opacity .28s ease;
}
#sidebarMask.is-visible{
  opacity:1;
  pointer-events:auto;
}
.aw-noscroll{
  overflow:hidden;
}
#sidebarMobile a{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.5rem .75rem;
  border-radius:.75rem;
}
#sidebarMobile a:hover{
  background:rgba(255,255,255,.08);
}

/* Theme Picker */
.theme-option{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.5rem;
  padding:.75rem 1.25rem;
  border:2px solid var(--aw-border);
  border-radius:1rem;
  background:var(--aw-card);
  cursor:pointer;
  transition:all .2s ease;
}
.theme-option:hover{
  border-color:#94a3b8;
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(0,0,0,.1);
}
.theme-option.active{
  border-color:var(--aw-brand);
  box-shadow:0 0 0 3px var(--aw-brand-shadow);
}
.theme-color{
  width:2.5rem;
  height:2.5rem;
  border-radius:50%;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.theme-label{
  font-size:.75rem;
  font-weight:500;
  color:var(--aw-muted);
}
.theme-option.active .theme-label{
  color:var(--aw-brand);
  font-weight:600;
}

/* === Responsive Utilities === */
/* Hide columns on mobile for better table readability */
@media(max-width:767px){
  .hide-mobile{display:none!important}
  .table th,.table td{padding:.5rem .375rem;font-size:.8125rem}
  .btn-primary span{display:none}
  .btn-primary i{margin:0}
}
/* Tablet adjustments */
@media(min-width:768px) and (max-width:1023px){
  .hide-tablet{display:none!important}
}
/* Better touch targets on mobile */
@media(max-width:767px){
  .action-btn{min-width:2.25rem;min-height:2.25rem;padding:.375rem}
  .action-btn i,.action-btn svg{width:1rem;height:1rem}
  .icon-btn{min-width:2.25rem;min-height:2.25rem}
  .table td .flex.gap-1{gap:.25rem}
}
/* Extra small mobile adjustments */
@media(max-width:400px){
  .table .action-btn{min-width:1.875rem;min-height:1.875rem;padding:.25rem}
  .table .action-btn i,.table .action-btn svg{width:.875rem;height:.875rem}
}

/* === Search Loading Animation === */
.search-wrapper{position:relative}
.search-wrapper input{padding-right:2.5rem}
.search-spinner{
  position:absolute;
  right:0.75rem;
  top:50%;
  transform:translateY(-50%);
  width:1.25rem;
  height:1.25rem;
  display:none;
}
.search-wrapper.is-loading .search-spinner{display:block}
.search-spinner svg{
  animation:spin 0.8s linear infinite;
  width:100%;
  height:100%;
  color:var(--aw-brand);
}
@keyframes spin{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}