/* ═══ COMMON STYLES — TýmDejvid ═══════════════════════════════════
   Sdílené styly pro všechny stránky aplikace
   ══════════════════════════════════════════════════════════════════ */

/* ═══ SKELETON LOADING ════════════════════════════════════════════ */
.skeleton{background:var(--border);border-radius:var(--radius-sm, 10px)}
.skeleton-line{height:14px;margin-bottom:10px;border-radius:4px}
.skeleton-card{height:72px;margin-bottom:12px;border-radius:var(--radius-sm, 10px)}
.skeleton-row{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--border)}
.skeleton-avatar{width:36px;height:36px;border-radius:50%;flex-shrink:0}
.skeleton-text{flex:1}
.skeleton,.skeleton-line,.skeleton-card,.skeleton-avatar{animation:skel-shimmer 1.5s ease-in-out infinite}
@keyframes skel-shimmer{0%{opacity:.6}50%{opacity:.25}100%{opacity:.6}}

/* ═══ SWIPE-TO-DELETE ═════════════════════════════════════════════ */
.swipe-wrap{position:relative;overflow:hidden}
.swipe-content{position:relative;z-index:1;background:var(--card, #fff);transition:transform .2s ease}
.swipe-action{position:absolute;top:0;right:0;bottom:0;width:80px;display:flex;align-items:center;justify-content:center;background:#ef4444;color:#fff;font-size:13px;font-weight:700;z-index:0}
.swipe-action span{pointer-events:none}

/* ═══ MULTI-SELECT TOOLBAR ════════════════════════════════════════ */
.bulk-toolbar{
  position:sticky;top:0;z-index:150;display:flex;align-items:center;gap:10px;
  background:var(--green, #16a34a);color:#fff;padding:10px 16px;border-radius:var(--radius-sm, 10px);
  margin-bottom:12px;font-size:13px;font-weight:600;
  animation:bulk-slide-in .2s ease;
}
@keyframes bulk-slide-in{from{transform:translateY(-10px);opacity:0}to{transform:translateY(0);opacity:1}}
.bulk-toolbar .bulk-count{font-weight:800;margin-right:4px}
.bulk-toolbar button{background:rgba(255,255,255,.2);color:#fff;border:none;padding:6px 14px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer}
.bulk-toolbar button:hover{background:rgba(255,255,255,.35)}
.bulk-toolbar button.bulk-danger{background:rgba(239,68,68,.8)}
.bulk-toolbar button.bulk-danger:hover{background:rgba(239,68,68,1)}
.bulk-toolbar .bulk-close{margin-left:auto;background:none;font-size:18px;padding:4px 8px}

/* ═══ SEARCH RESULTS DROPDOWN ═════════════════════════════════════ */
.search-results{
  position:absolute;top:100%;left:0;right:0;z-index:500;
  background:var(--card, #fff);border:1px solid var(--border);border-top:none;
  border-radius:0 0 var(--radius-sm, 10px) var(--radius-sm, 10px);
  box-shadow:0 8px 24px rgba(0,0,0,.12);max-height:400px;overflow-y:auto;
  display:none;
}
.search-results.open{display:block}
.search-group-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--text-light);padding:10px 14px 4px}
.search-result-item{display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;font-size:14px;transition:background .1s}
.search-result-item:hover{background:var(--bg)}
.search-result-item .sr-icon{font-size:16px;width:24px;text-align:center;flex-shrink:0}
.search-result-item .sr-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search-result-item .sr-meta{font-size:11px;color:var(--text-light);flex-shrink:0}
.search-empty{padding:20px;text-align:center;color:var(--text-light);font-size:13px}
html[data-theme="dark"] .search-results{box-shadow:0 8px 24px rgba(0,0,0,.4)}

/* ═══ OFFLINE BANNER ═════════════════════════════════════════════ */
#td-offline-banner{
  position:fixed;top:0;left:0;right:0;z-index:9999;
  background:#FF9800;color:#fff;padding:8px 16px;
  font-size:13px;font-weight:500;
  display:none;align-items:center;gap:8px;justify-content:center;
  transition:transform .3s ease;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.td-offline-icon{font-size:14px}
body.is-offline{padding-top:36px !important}
body.is-offline .sidebar,
body.is-offline .side-nav{top:36px !important}
body.is-offline .top-bar,
body.is-offline .topbar{top:36px !important}
@media(max-width:768px){
  #td-offline-banner{font-size:12px;padding:6px 12px}
}

/* ═══ SYNC INDIKÁTOR ═════════════════════════════════════════════ */
.td-sync-indicator{
  display:flex;align-items:center;gap:4px;
  font-size:11px;color:var(--text-light, #94a3b8);padding:4px 8px;
  white-space:nowrap;
}
/* V headeru: kompaktnější */
.app-header .td-sync-indicator{padding:0 8px;font-size:10px;opacity:.7}
.td-sync-dot{font-size:8px}
.td-sync-indicator.synced .td-sync-dot{color:#4CAF50}
.td-sync-indicator.syncing .td-sync-dot{color:#FF9800;animation:td-pulse 1s infinite}
.td-sync-indicator.offline .td-sync-dot{color:#FF9800}
.td-sync-indicator.pending .td-sync-dot{color:#FBBF24;animation:td-pulse 1s infinite}
@keyframes td-pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* ═══ SKELETON KPI ROW ═══════════════════════════════════════════ */
.td-skeleton-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:16px}
.td-skeleton-kpi .skeleton-card{height:80px}

/* ═══ GUEST / HOST STYLING ═══════════════════════════════════════ */
.guest-avatar{border:2px dashed var(--amber,#F59E0B)!important;background:#fff7ed!important;color:#c2410c!important}
.guest-badge{display:inline-block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;background:#fff7ed;color:#c2410c;border:1px solid #fed7aa;border-radius:8px;padding:1px 6px;margin-left:6px;vertical-align:middle}
.guest-btn{width:100%;background:#fff;border:2px dashed var(--amber,#F59E0B);color:#b45309;font-size:14px;font-weight:700;padding:10px;border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:8px;transition:background .2s}
.guest-btn:hover{background:#fffbeb}
.toggle-btn.disabled{pointer-events:none;opacity:.5;cursor:not-allowed}
.guest-modal-body{padding:16px}
.guest-search-input{width:100%;padding:10px 12px;border:1px solid #e2e8f0;border-radius:10px;font-size:14px;outline:none;margin-bottom:12px}
.guest-search-input:focus{border-color:var(--amber,#F59E0B);box-shadow:0 0 0 3px rgba(245,158,11,.15)}
.guest-list{max-height:240px;overflow-y:auto;margin-bottom:12px}
.guest-list-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;cursor:pointer;transition:background .15s}
.guest-list-item:hover{background:#f8fafc}
.guest-list-item.selected{background:#fffbeb;border:1px solid #fcd34d}
.guest-list-item .avatar-mini{width:32px;height:32px;border-radius:50%;background:#f1f5f9;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#64748b;flex-shrink:0}
.guest-list-empty{text-align:center;padding:20px;color:#94a3b8;font-size:13px}
.guest-new-form{border-top:1px solid #e2e8f0;padding-top:12px;margin-top:8px}
.guest-new-form input{width:100%;padding:8px 10px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;margin-bottom:8px}
.guest-new-form input:focus{border-color:var(--amber);outline:none}

/* ═══ UNIFIED ADMIN NAV ═════════════════════════════════════════ */
nav.admin-nav{
  display:flex!important;gap:6px;padding:10px 16px;
  overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  border-bottom:1.5px solid var(--border, #e2e8f0);
  background:var(--card, #fff);
  position:sticky;top:calc(0px + env(safe-area-inset-top, 0px));z-index:90;
  align-items:center;
  box-shadow:0 1px 3px rgba(0,0,0,.04);
}
nav.admin-nav::-webkit-scrollbar{display:none}
nav.admin-nav .nav-pill{
  display:flex;align-items:center;gap:4px;
  padding:7px 14px;border-radius:20px;
  font-size:12px;font-weight:600;
  color:var(--text-light, #64748b);
  background:var(--bg, #f1f5f9);
  border:1px solid transparent;
  text-decoration:none;white-space:nowrap;
  transition:all .15s;
  flex-shrink:0;
}
nav.admin-nav .nav-pill:hover{
  border-color:var(--green, #16a34a);color:var(--green, #16a34a);background:var(--card, #fff);
}
nav.admin-nav .nav-pill.active{
  color:#fff;background:var(--green, #16a34a);border-color:var(--green, #16a34a);
  box-shadow:0 2px 6px rgba(22,163,74,.25);
}
nav.admin-nav .nav-sep{
  width:1px;height:20px;background:var(--border, #e2e8f0);flex-shrink:0;margin:0 2px;
}
@media(max-width:768px){
  nav.admin-nav{padding:8px 12px;gap:4px}
  nav.admin-nav .nav-pill{padding:6px 10px;font-size:11px}
}