/* TravTools · © MUNLabs
 * ui_global.css — Block 2: globale UI-Standards fuer Abstaende, Vollbreite,
 * Typografie-Skala, Karten, Tabellen, Formulare, Badges, Popups und Mobile.
 * Ausschliesslich Tokens aus shared.css. Die endgueltige
 * Die Komponenten-Optik (Glow, Glas, Modale) sitzt in css/premium.css.
 */
:root{
  --tt-font-body:15px;
  --tt-font-h1:clamp(24px,2.8vw,34px);
  --tt-font-h2:clamp(19px,2.2vw,25px);
  --tt-font-h3:clamp(16px,1.8vw,20px);
}
html,body{font-family:var(--tt-font);}
body{overflow-x:hidden;}
*,*::before,*::after{box-sizing:border-box;}

/* ---------- Vollbreite mit Sidebar ---------- */
.tt-main{width:calc(100% - var(--tt-sb-w, 300px));max-width:none;min-width:0;}
.tt-top,.tt-page,.tt-page-foot{padding-left:var(--tt-space)!important;padding-right:var(--tt-space)!important;}
.tt-top{padding-top:14px!important;padding-bottom:14px!important;}
.tt-page{width:100%;max-width:none;padding-top:var(--tt-space)!important;padding-bottom:var(--tt-space)!important;min-height:calc(100vh - var(--tt-top-h, 74px))!important;align-content:start!important;}
.tt-page>*{max-width:none;}
.tt-page>*:first-child,
.tt-page>div:first-child,
.tt-page>section:first-child,
.tt-page>article:first-child,
.tt-page>form:first-child,
.tt-page>header:first-child,
.tt-page h1:first-child,
.tt-page h2:first-child,
.tt-page .tt-card:first-child,
.tt-page .tt-box:first-child,
.tt-page .tt-panel:first-child,
.tt-page .tt-wrap:first-child,
.tt-page .tt-table-card:first-child{margin-top:0!important;}
.tt-page>div,.tt-page>section,.tt-page>article,.tt-page>form{width:100%;margin-left:0;margin-right:0;}

.tt-wrap,.tt-box,.tt-panel,.tt-card,.tt-table-card,.tt-content-card,.tt-login-card,.tt-auth-card,
.tt-chat-wrap,.tt-online-wrap,.tt-adm-wrap,.tt-stat-wrap,.tt-k-card,.tt-form-grid,.tt-form,
[class*="wrap"],[class*="panel"],[class*="shell"],[class*="container"]{max-width:none;}

/* ---------- Typografie-Skala ---------- */
h1,.tt-page h1,.tt-header h1,.tt-stat-header h1{font-size:var(--tt-font-h1)!important;line-height:1.08;margin:0 0 8px;font-weight:900;letter-spacing:-.01em;}
h2,.tt-page h2{font-size:var(--tt-font-h2)!important;line-height:1.12;margin:0 0 8px;font-weight:850;}
h3,.tt-page h3{font-size:var(--tt-font-h3)!important;line-height:1.15;margin:0 0 6px;font-weight:800;}
p,li,td,th,input,select,textarea,button,label,.tt-text,.tt-muted,.tt-txt,.tt-item,.tt-sub-btn{font-size:var(--tt-font-body)!important;}
small,.muted,.tt-subline,.tt-hint{font-size:13px!important;color:var(--tt-muted)!important;}

/* ---------- Karten-Basis (Detail + Glow in premium.css) ---------- */
.tt-card,.tt-box,.tt-panel,.tt-wrap,.tt-stat-wrap .tt-card,.tt-chat-wrap,.tt-online-wrap,.tt-adm-wrap,.tt-login-card,.tt-auth-card,.tt-k-card,.tt-table-card,.tt-content-card{
  position:relative;border-radius:var(--tt-card-radius)!important;border:1px solid var(--tt-card-border)!important;background:var(--tt-card-bg)!important;box-shadow:var(--tt-shadow);
}
.tt-card::before,.tt-box::before,.tt-panel::before,.tt-chat-wrap::before,.tt-wrap::before,.tt-table-card::before,.tt-content-card::before{
  content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:4px;background:var(--tt-gold-line);box-shadow:0 0 18px rgba(242,193,74,.22);pointer-events:none;
}
.tt-card,.tt-box,.tt-panel,.tt-wrap,.tt-table-card,.tt-content-card{overflow:hidden;}
.tt-card:hover,.tt-box:hover,.tt-panel:hover,.tt-wrap:hover,.tt-table-card:hover,.tt-content-card:hover{transform:none!important;}

/* ---------- Buttons: keine Sprung-Animationen (Optik in buttons.css/premium.css) ---------- */
button,.tt-btn,.tt-btn-head,.tt-toggle-btn,.tt-sub-btn,.tt-group-btn,.nav-btn,.tt-btn-save,.tt-btn-reset,.tt-popup-close,.tt-btn-mini{transition:transform var(--tt-fast) var(--tt-ease),box-shadow var(--tt-fast) var(--tt-ease),background var(--tt-fast) var(--tt-ease),border-color var(--tt-fast) var(--tt-ease),color var(--tt-fast) var(--tt-ease),filter var(--tt-fast) var(--tt-ease);}
.tt-btn-head,.tt-toggle-btn,[data-tt-toggle="sub"],[data-tt-toggle="group"]{min-height:42px;border-radius:12px!important;}
.tt-btn-head,.tt-toggle-btn{border:1px solid var(--tt-line);background:var(--tt-surface-glass-2);color:#fff;font-weight:800;padding:10px 14px;}
.tt-btn-head::after,.tt-toggle-btn::after,.tt-group-btn::after,.tt-sub-btn::after{content:"";display:none!important;}

/* ---------- Badges: Geometrie ---------- */
.tt-badge,.badge,.status-badge,[class*="badge"]:not(:where(.tt-vbadge,.tt-badge-img,[class*="tt-badge-admin"],[class*="tt-badge-card"],[class*="tt-badge-size"],[class*="tt-badge-preview"],[class*="tt-badge-upload"],[class*="tt-badge-showcase"],[class*="tt-badge-row"],[class*="tt-badge-lvl"],[class*="tt-vbadge"],.tt-bell-badge,.tt-nav-badge,.tt-supporter-badge,.tt-badge-wrap,.tt-badge-box,.badge-box,.badge-container)){display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:28px;padding:5px 12px;border-radius:999px;font-size:12px!important;font-weight:900;line-height:1;white-space:nowrap;letter-spacing:.02em;}
.tt-badge{min-width:18px!important;height:18px!important;min-height:18px!important;padding:0 4px!important;margin-left:0!important;vertical-align:middle!important;}

/* ---------- Eingaben ---------- */
input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="search"]:not(:where(.tt-search)),input[type="url"],input[type="date"],input[type="datetime-local"],input[type="time"],select,textarea,.tt-input{
  width:100%;min-height:46px;border-radius:var(--tt-input-radius)!important;border:1px solid var(--tt-line-strong)!important;background:var(--tt-surface-input)!important;color:var(--tt-text)!important;padding:11px 13px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
input::placeholder,textarea::placeholder{color:var(--tt-faint)!important;}
input:focus,select:focus,textarea:focus,.tt-input:focus{outline:none!important;border-color:var(--tt-line-gold)!important;box-shadow:var(--tt-focus-ring)!important;}

/* ---------- Tabellen ---------- */
table{width:100%;border-collapse:separate;border-spacing:0;}
thead th{position:sticky;top:0;z-index:1;text-align:left!important;padding:13px 14px!important;background:var(--tt-surface-glass-2)!important;border-bottom:1px solid var(--tt-line-gold)!important;vertical-align:middle!important;font-weight:900;}
tbody td{padding:12px 14px!important;vertical-align:middle!important;border-bottom:1px solid var(--tt-line)!important;}
tbody tr:hover td{background:rgba(242,193,74,.04);}
th:last-child,td:last-child{text-align:right;}
.tt-scale-slot,.tt-slot{display:flex;align-items:center;justify-content:center;}
.tt-scale-slot span{position:static!important;transform:none!important;padding:0!important;background:transparent!important;}

/* ---------- Popups / Modale: Groesse ---------- */
.tt-popup-card,.tt-modal,.tt-modal-card,.tt-dialog,.tt-overlay-card{width:min(980px,calc(100vw - 40px))!important;max-height:min(86vh,900px)!important;border-radius:20px!important;border:1px solid var(--tt-line-gold)!important;box-shadow:var(--tt-shadow-3)!important;}
.tt-popup-body,.tt-modal-body{padding:18px!important;}

.tt-chat-sidebar .tt-u-item,.tt-friend-list .tt-u-item,.tt-user-list .tt-u-item,.tt-ticket-list .tt-u-item,.tt-channel-list .tt-u-item{width:100%;min-height:64px;border-radius:16px;padding:12px 14px!important;}
.tt-login-card,.tt-auth-card{max-width:760px;margin:0 auto;}

@media (max-width:980px){
  .tt-main{width:100%;}
  .tt-top,.tt-page,.tt-page-foot{padding-left:var(--tt-space-mobile)!important;padding-right:var(--tt-space-mobile)!important;}
  .tt-page{padding-top:var(--tt-space-mobile)!important;padding-bottom:var(--tt-space-mobile)!important;}
  .tt-popup-card,.tt-modal,.tt-modal-card,.tt-dialog{width:min(100vw - 20px,100%)!important;}
  .tt-chat-wrap,.tt-online-wrap,.tt-adm-wrap,.tt-stat-wrap{padding:14px!important;}
  table{display:block;overflow-x:auto;}
}

/* ---------- Einheitliche Hover-Effekte (ruhig, gold, ohne Hochfahren) ---------- */
:root{
  --tt-hover-bg:var(--tt-surface-hover);
  --tt-hover-border:var(--tt-line-gold);
  --tt-hover-glow:0 0 0 1px rgba(242,193,74,.14) inset, 0 0 18px rgba(242,193,74,.10);
}
.tt-item,.tt-sub-btn,.tt-group-btn,.tt-u-item,.tt-menu-btn,.tt-world-card,.tt-mini-world,.tt-feed-item,.tt-player-item,.tt-upload-zone,.tt-top-item,.tt-link-card,.tt-stat-card{
  transition:background var(--tt-fast) var(--tt-ease),border-color var(--tt-fast) var(--tt-ease),box-shadow var(--tt-fast) var(--tt-ease),color var(--tt-fast) var(--tt-ease),transform var(--tt-med) var(--tt-ease)!important;
  position:relative;
}
.tt-u-item:hover,.tt-menu-btn:hover,.tt-world-card:hover,.tt-mini-world:hover,.tt-feed-item:hover,.tt-player-item:hover,.tt-upload-zone:hover,.tt-top-item:hover,.tt-link-card:hover,.tt-stat-card:hover{
  background:var(--tt-hover-bg)!important;
  border-color:var(--tt-hover-border)!important;
  box-shadow:var(--tt-hover-glow)!important;
}
.tt-u-item::before,.tt-menu-btn::before,.tt-world-card::before,.tt-mini-world::before,.tt-feed-item::before,.tt-player-item::before,.tt-top-item::before,.tt-link-card::before,.tt-stat-card::before{
  content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:8px;background:var(--tt-gold);opacity:0;transition:opacity var(--tt-fast) var(--tt-ease),box-shadow var(--tt-fast) var(--tt-ease);pointer-events:none;
}
.tt-u-item:hover::before,.tt-menu-btn:hover::before,.tt-world-card:hover::before,.tt-mini-world:hover::before,.tt-feed-item:hover::before,.tt-player-item:hover::before,.tt-top-item:hover::before,.tt-link-card:hover::before,.tt-stat-card:hover::before{opacity:1;box-shadow:0 0 14px rgba(242,193,74,.45);}
.tt-feed-item:hover .tt-feed-img{transform:none!important;}

/* ---------- Tabellen im Admin-Stil (Log-/Wave-/tt-Tabellen) ---------- */
.tt-log-table,.tt-table,.wave-table,table.tt-table{table-layout:fixed!important;width:100%!important;border-collapse:collapse!important;}
.tt-log-table th,.tt-table th,.wave-table th,table.tt-table th{background:var(--tt-surface-glass)!important;color:var(--tt-muted)!important;padding:11px 12px!important;text-align:left!important;border-bottom:1px solid var(--tt-line-strong)!important;font-size:10.5px!important;font-weight:800!important;letter-spacing:.12em;text-transform:uppercase!important;position:static!important;}
.tt-log-table td,.tt-table td,.wave-table td,table.tt-table td{padding:10px 12px!important;border-bottom:1px solid var(--tt-line-soft)!important;vertical-align:middle!important;color:var(--tt-text-soft)!important;}
.tt-log-table tr,.tt-table tr,.wave-table tr,table.tt-table tr{height:42px!important;}
.tt-log-table tbody tr:hover td,.tt-table tbody tr:hover td,.wave-table tbody tr:hover td,table.tt-table tbody tr:hover td{background-color:rgba(242,193,74,.06)!important;color:#fff!important;}
.tt-log-table tbody tr:hover td:first-child,.tt-table tbody tr:hover td:first-child,.wave-table tbody tr:hover td:first-child,table.tt-table tbody tr:hover td:first-child{box-shadow:inset 3px 0 0 var(--tt-gold)!important;}

/* ---------- Chat + Badge Konsistenz ---------- */
.tt-friend-list,.tt-user-list,.tt-ticket-list,.tt-channel-list{padding:8px!important;gap:6px!important;}
.tt-friend-list .tt-u-item,.tt-user-list .tt-u-item,.tt-ticket-list .tt-u-item,.tt-channel-list .tt-u-item,.tt-ticket-item{min-height:62px!important;padding:10px 12px!important;border-radius:14px!important;align-items:center!important;}
.tt-friend-list .tt-u-item .tt-u-name,.tt-user-list .tt-u-item .tt-u-name,.tt-ticket-list .tt-u-item .tt-u-name,.tt-channel-list .tt-u-item .tt-u-name,.tt-ticket-item .tt-u-name{display:flex!important;align-items:center!important;gap:0!important;line-height:1.1!important;}
.tt-friend-list .tt-u-msg,.tt-user-list .tt-u-msg,.tt-ticket-list .tt-u-msg,.tt-channel-list .tt-u-msg,.tt-ticket-preview,.tt-last-msg{display:none!important;}
.tt-friend-list .tt-badge,.tt-user-list .tt-badge,.tt-ticket-list .tt-badge,.tt-channel-list .tt-badge{width:14px!important;height:14px!important;min-width:14px!important;min-height:14px!important;margin-left:2px!important;transform:none!important;vertical-align:middle!important;}
.tt-msg-meta .tt-badge,.tt-sender-name .tt-badge,.tt-chat-badge{width:11px!important;height:11px!important;min-width:11px!important;min-height:11px!important;margin-left:2px!important;transform:none!important;vertical-align:middle!important;}

/* ---------- Meine Welten: gleich hohe Karten ---------- */
.tt-worlds-grid > *, .tt-world-card{height:100%;}
.tt-world-card,.tt-mini-world{display:flex!important;flex-direction:column!important;justify-content:space-between!important;border-radius:18px!important;overflow:hidden!important;}

/* ---------- Mail-Templates Layout ---------- */
.tt-grid-main{grid-template-columns:minmax(340px,0.95fr) minmax(0,1.25fr)!important;align-items:start!important;}
.tt-browser-mockup{height:min(680px,70vh)!important;max-width:100%!important;}
@media (max-width:1100px){.tt-grid-main{grid-template-columns:1fr!important;}.tt-browser-mockup{height:520px!important;}}

/* ---------- Generische Header-Zeilen ---------- */
.tt-header-row,.tt-header-standalone{position:relative;z-index:1;}
.tt-header-row{display:flex!important;justify-content:space-between!important;align-items:flex-end!important;gap:16px!important;flex-wrap:wrap!important;}

/* ---------- Stabilisierung (keine Mindesthoehen, Grids oben ausrichten) ---------- */
.tt-chat-wrap,.tt-online-wrap,.tt-adm-wrap,.tt-stat-wrap,.tt-card,.tt-box,.tt-panel,.tt-wrap,.tt-table-card,.tt-content-card,
.tt-login-card,.tt-auth-card,.tt-reg-card,.tt-change-card,.tt-delete-card,.tt-reset-card,
.tt-world-card,.tt-mini-world,.tt-request-card,.tt-invite-card,.tt-menu-btn,.tt-action-btn{min-height:0!important;height:auto!important;}
.tt-profile-grid,.tt-worlds-grid,.tt-req-grid,.tt-invites-grid,.tt-chat-wrap,.tt-grid-main,.tt-form-grid{align-items:start!important;}
.tt-login-wrap,.tt-reg-wrap,.tt-auth-wrap,.tt-change-wrap,.tt-delete-wrap,.tt-reset-wrap{align-items:center!important;min-height:0!important;}
.tt-big-logo,.tt-auth-logo,.tt-side-logo,.tt-logo-panel,.tt-logo-box{background:transparent!important;border:none!important;box-shadow:none!important;min-height:0!important;height:auto!important;}
.tt-big-logo img,.tt-auth-logo img,.tt-side-logo img{width:min(340px,72%)!important;max-width:340px!important;height:auto!important;}
.tt-menu-shell,.tt-actions-shell,.tt-welcome-card{background:transparent!important;border:none!important;box-shadow:none!important;}
.tt-menu-grid{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;align-items:start!important;}
.tt-menu-btn,.tt-action-btn{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;padding:14px 16px!important;}
.tt-world-card,.tt-mini-world,.tt-request-card,.tt-invite-card{display:flex!important;flex-direction:column!important;justify-content:space-between!important;}
.tt-chat-wrap{grid-template-columns:minmax(250px,290px) minmax(0,1fr)!important;min-height:620px!important;height:calc(100vh - 150px)!important;max-height:none!important;}
.tt-chat-sidebar{width:auto!important;min-width:250px!important;max-width:290px!important;}
.tt-chat-main{min-width:0!important;display:flex!important;flex-direction:column!important;}
.tt-msg-area{flex:1 1 auto!important;min-height:280px!important;}
.tt-input-wrapper{margin-top:auto!important;}
.tt-table-wrap,.tt-table-responsive,.table-wrap,.table-card{width:100%!important;max-width:none!important;overflow:auto!important;}
@media (max-width: 980px){
  .tt-chat-wrap{grid-template-columns:1fr!important;height:auto!important;min-height:0!important;}
  .tt-chat-sidebar{max-width:none!important;min-width:0!important;}
  .tt-chat-main{min-height:520px!important;}
  .tt-grid-main,.tt-profile-grid,.tt-worlds-grid,.tt-req-grid,.tt-invites-grid,.tt-login-wrap,.tt-reg-wrap,.tt-auth-wrap,.tt-change-wrap,.tt-delete-wrap,.tt-reset-wrap{grid-template-columns:1fr!important;}
}