/* =========================================================
   BAVARIA ROLEPLAY — RESPONSIVE SYSTEM V4
   Website + Userpanel + Teampanel
   Loaded last to normalize legacy module rules.
   ========================================================= */

html{min-width:0;max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-width:0;max-width:100%;overflow-x:hidden}
img,svg,video,canvas,iframe{max-width:100%}
img,video{height:auto}
button,input,select,textarea{max-width:100%}
button,a,input,select,textarea{touch-action:manipulation}
textarea{resize:vertical}
[hidden]{display:none!important}

/* Prevent grid/flex children from forcing horizontal overflow. */
.layout,.main,.content,.tab,.tab-content,.page-main,.section,.container,
.card,.card-body,.ticket-detail,.ticket-chat,.admin-tcd-body,
[class*="grid"],[class*="layout"],[class*="shell"],[class*="column"],[class*="col-"]{min-width:0}

/* Long user content must wrap instead of widening the screen. */
.ticket-message,.msg-text,.message-body,.ticket-info,.tcd-info,.admin-tcd-right,
.card,.modal,.notif-dropdown,.nav-dropdown,.field,.value,
[class*="description"],[class*="content"],[class*="message"]{overflow-wrap:anywhere;word-break:normal}

/* Tables stay usable through local horizontal scrolling. */
.table-wrap,.tbl-wrap,.table-responsive,[class*="table-wrap"],[class*="table-scroll"]{
  display:block;max-width:100%;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;
  overscroll-behavior-inline:contain;scrollbar-gutter:stable;
}
table{max-width:none}
.tbl{width:100%;min-width:680px}

/* Modals never exceed the viewport. */
.modal-overlay,.modal-backdrop,[class*="modal-overlay"],[class*="modal-backdrop"]{
  padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
  overflow-y:auto;-webkit-overflow-scrolling:touch;
}
.modal,[class*="modal-card"],[class*="modal-box"],[role="dialog"]{
  width:min(720px,100%)!important;max-width:100%!important;max-height:calc(100dvh - 24px)!important;overflow-y:auto!important;
}

/* =========================================================
   PUBLIC WEBSITE
   ========================================================= */
.nav{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
.nav-inner{width:min(1280px,calc(100% - 32px));min-width:0}
.mobile-menu{max-height:calc(100dvh - 64px);overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(1rem + env(safe-area-inset-bottom))}
.page-main,.pg-subpage{max-width:100%;overflow-x:hidden}
.section,.pg-section{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}

@media (max-width:1024px){
  .nav-links{display:none!important}
  .nav-hamburger{display:flex!important}
  .nav-user-name{display:none}
  .nav-inner{width:min(100% - 28px,1280px)}
  .hero-grid,.about-grid,.server-grid,.support-grid,.contact-grid,.footer-grid,
  .pg-grid,.rule-layout,.rw-layout,.events-grid,.team-grid,.factions-grid{
    grid-template-columns:1fr!important;
  }
  .rw-sidebar{position:static!important;max-height:none!important;width:100%!important}
}

@media (max-width:768px){
  .nav{height:64px!important}
  .nav-inner{width:calc(100% - 24px)!important}
  .nav-logo img,.logo-img{width:40px!important;height:40px!important}
  .logo-main{font-size:.9rem!important}
  .nav-btn--register{display:none!important}
  .hero,.pg-hero,.page-hero{min-height:0!important;padding-top:96px!important;padding-bottom:52px!important}
  .hero h1,.pg-hero h1,.page-hero h1{font-size:clamp(2.15rem,11vw,3.8rem)!important;line-height:1!important}
  .hero-actions,.actions,.cta-actions{width:100%;display:grid!important;grid-template-columns:1fr!important}
  .hero-actions .btn,.actions .btn,.cta-actions .btn{width:100%;justify-content:center}
  .stats-grid,.feature-grid,.info-grid,.cards-grid,.team-grid,.events-grid,.factions-grid{grid-template-columns:1fr!important}
  .footer-bottom{flex-direction:column!important;align-items:flex-start!important;gap:.75rem!important}
  .rw-tabs,.filter-tabs,.category-tabs{max-width:100%;overflow-x:auto;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch}
  .rw-tab,.filter-tab,.category-tab{flex:0 0 auto}
}

@media (max-width:480px){
  .nav-actions{gap:.35rem!important}
  .nav-btn--login{padding:.55rem .7rem!important;font-size:.76rem!important}
  .logo-text-wrap{display:none!important}
  .section,.pg-section{padding-left:14px!important;padding-right:14px!important}
  .card,.pg-card,.rule-card,.faq-item,.event-card,.team-card{border-radius:8px!important}
  .card-body,.pg-card-body{padding:1rem!important}
}

/* =========================================================
   PANEL SHELL — USER + TEAM
   ========================================================= */
.layout{width:100%;max-width:100%;min-height:100dvh;height:100dvh;overflow:hidden}
.main{min-width:0;width:calc(100% - var(--sidebar));max-width:100%;height:100dvh}
.content,.tab.content,.tab-tickets{max-width:100%;overflow-x:hidden;overscroll-behavior:contain}
.topbar{padding-left:clamp(.75rem,2vw,1.5rem);padding-right:clamp(.75rem,2vw,1.5rem);padding-top:env(safe-area-inset-top)}
.topbar-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar-right{min-width:0}
.notif-dropdown,.avatar-dropdown,.topbar-dropdown{max-width:calc(100vw - 24px)!important;right:0!important}
.sidebar{padding-left:env(safe-area-inset-left);padding-bottom:env(safe-area-inset-bottom)}
.sb-nav{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}

/* Common flexible action/header rows. */
.card-head,.card-header,.section-head,.page-head,.toolbar,.filter-row,.action-row,
.dash-hero-actions,.tm-actions,.app-admin-actions,.ticket-actions,.dept-form-footer{
  min-width:0;flex-wrap:wrap;
}

/* Inputs/buttons remain touch-friendly without becoming huge on desktop. */
@media (pointer:coarse){
  button,.btn,.sb-item,.nav-link,input,select{min-height:42px}
  textarea{min-height:110px}
}

/* Tablet: drawer sidebar and fluid content. */
@media (max-width:1100px){
  .layout{height:100dvh}
  .main{width:100%!important;flex:1 1 100%!important}
  .sidebar{
    position:fixed!important;inset:0 auto 0 0!important;z-index:1000!important;
    width:min(300px,86vw)!important;max-width:86vw!important;height:100dvh!important;
    transform:translateX(-105%)!important;transition:transform .22s ease!important;
    display:flex!important;visibility:visible!important;box-shadow:18px 0 48px rgba(0,0,0,.5)!important;
  }
  .sidebar.mobile-open{transform:translateX(0)!important}
  .mobile-nav-btn,.tb-btn.mobile-nav-btn{display:flex!important}
  .mobile-nav-backdrop{z-index:990!important;inset:0!important}
  body.panel-nav-open{overflow:hidden!important;touch-action:none}
  .content,.tab.content{padding-left:clamp(.8rem,2.2vw,1.25rem)!important;padding-right:clamp(.8rem,2.2vw,1.25rem)!important}
  .dash-stats,.overview-grid,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .settings-grid,.wishes-layout,.app-layout,.app-status-shell,.tc-flow,.social-layout,
  .wiki-layout,.friends-layout,.team-layout,.module-layout{grid-template-columns:1fr!important}
  .settings-menu,.wish-submit-card,.app-side-col,.wiki-sidebar{position:static!important;top:auto!important}
}

/* Phone: eliminate fixed canvas assumptions and nested viewport traps. */
@media (max-width:720px){
  :root{--topbar:58px}
  .topbar{height:calc(var(--topbar) + env(safe-area-inset-top))!important;min-height:58px!important;gap:.5rem!important}
  .topbar-meta,.topbar-user-meta,.topbar-pill{display:none!important}
  .topbar-title{font-size:.92rem!important;max-width:44vw}
  .topbar-right{gap:.3rem!important}
  .tb-btn{width:36px!important;min-width:36px!important;height:36px!important;flex-basis:36px!important}
  .content,.tab.content,.tab-tickets{padding:.8rem!important;padding-bottom:calc(1rem + env(safe-area-inset-bottom))!important}
  .dash-hero,.tm-hero,.wiki-hero,.friends-hero,.app-admin-hero,.app-status-hero{padding-bottom:1rem!important;margin-bottom:1rem!important}
  .dash-hero-inner,.tm-hero-inner,.wiki-hero-inner,.friends-hero-inner,.app-admin-hero-inner{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:1rem!important}
  .dash-hero-actions,.tm-actions,.app-admin-actions{width:100%!important;display:grid!important;grid-template-columns:1fr!important}
  .dash-qbtn,.dash-hero-actions .btn,.tm-actions .btn,.app-admin-actions .btn{width:100%!important;justify-content:center!important}
  .dash-stats,.overview-grid,.stats-grid,.settings-card-grid,.app-info-grid,.app-status-details,
  .dept-topic-grid,.dept-grid,.social-link-grid,.social-post-grid,.roadmap-grid{grid-template-columns:1fr!important}
  .dash-stat{border-right:0!important;border-bottom:1px solid var(--border)!important}
  .dash-stat:last-child{border-bottom:0!important}
  .card,.tm-card,.settings-card,.wiki-card,.shop-card,.wish-card,.ticket-card,.app-card{max-width:100%!important}
  .card-head,.card-header,.section-head,.toolbar,.filter-row,.action-row{align-items:stretch!important}
  .card-head > *, .card-header > *, .toolbar > *, .filter-row > *{max-width:100%}
  .toolbar .field,.filter-row .field,.toolbar input,.toolbar select,.filter-row input,.filter-row select{width:100%!important}
  .btn-row,.form-actions,.modal-actions,.ticket-actions,.dept-form-actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important}
  .btn-row .btn,.form-actions .btn,.modal-actions .btn,.ticket-actions .btn,.dept-form-actions .btn{width:100%!important;justify-content:center!important}
  .modal-overlay,.modal-backdrop,[class*="modal-overlay"],[class*="modal-backdrop"]{align-items:flex-end!important;padding:0!important}
  .modal,[class*="modal-card"],[class*="modal-box"],[role="dialog"]{
    width:100%!important;max-height:92dvh!important;border-radius:12px 12px 0 0!important;
    padding-bottom:env(safe-area-inset-bottom)!important;
  }
  .notif-dropdown{position:fixed!important;top:calc(58px + env(safe-area-inset-top))!important;left:12px!important;right:12px!important;width:auto!important;max-height:calc(100dvh - 82px)!important;overflow-y:auto!important}
}

@media (max-width:420px){
  .content,.tab.content,.tab-tickets{padding:.65rem!important}
  .topbar-title{max-width:38vw;font-size:.85rem!important}
  .topbar-right .tb-btn:nth-of-type(n+4){display:none!important}
  .dash-hero-h,.tm-title,.app-admin-title,.app-status-title{font-size:1.35rem!important}
  .tbl{min-width:600px}
}

/* =========================================================
   TICKETS — stable desktop, tablet and mobile behavior
   ========================================================= */
#tab-tickets,.tab-tickets{min-height:0!important;overflow:hidden!important}
.ticket-layout,.tickets-layout,.admin-ticket-layout,.admin-tickets-layout,
#tab-tickets .ticket-shell,#tab-tickets .ticket-workspace{
  min-width:0!important;max-width:100%!important;min-height:0!important;
}
.ticket-list,.tickets-list,.admin-ticket-list{min-width:0!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch}
.ticket-chat,.ticket-messages,.admin-ticket-chat{min-width:0!important;min-height:0!important;overflow:hidden!important}
.ticket-messages,.messages-list,.chat-messages{overflow-y:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.ticket-compose,.chat-compose,.message-compose{flex-shrink:0!important}
.ticket-compose textarea,.chat-compose textarea,.message-compose textarea{min-width:0!important;width:100%!important}
.tcd-info,.ticket-detail-card,.tcd-info-card,.admin-tcd-right{min-width:0!important;overflow-x:hidden!important}

@media (min-width:1181px){
  #tab-tickets .admin-tcd-body,.admin-tcd-body{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(270px,330px)!important;align-items:stretch!important;min-height:0!important}
  #tab-tickets .admin-tcd-right,.admin-tcd-right{width:auto!important;max-width:none!important;height:auto!important;max-height:none!important;overflow-y:auto!important}
}

@media (max-width:1180px){
  #tab-tickets,.tab-tickets{overflow-y:auto!important}
  .ticket-layout,.tickets-layout,.admin-ticket-layout,.admin-tickets-layout,
  #tab-tickets .ticket-shell,#tab-tickets .ticket-workspace{display:flex!important;flex-direction:column!important;height:auto!important;overflow:visible!important}
  .ticket-list,.tickets-list,.admin-ticket-list{width:100%!important;max-width:none!important;height:auto!important;max-height:300px!important;flex:0 0 auto!important}
  .ticket-chat,.ticket-messages,.admin-ticket-chat{height:auto!important;min-height:480px!important;max-height:none!important}
  .admin-tcd-body{display:flex!important;flex-direction:column!important;height:auto!important;overflow:visible!important}
  .admin-tcd-right,.tcd-info,.ticket-detail-card,.tcd-info-card{width:100%!important;max-width:none!important;max-height:none!important;height:auto!important;overflow-y:visible!important}
}

@media (max-width:720px){
  #tab-tickets,.tab-tickets{padding:0!important;background:var(--bg)!important}
  #tab-tickets .ticket-shell,#tab-tickets .ticket-workspace,.ticket-layout,.tickets-layout{gap:.65rem!important}
  .ticket-list,.tickets-list,.admin-ticket-list{max-height:260px!important;border-radius:8px!important}
  .ticket-chat,.admin-ticket-chat{min-height:calc(100dvh - 180px)!important;border-radius:8px!important}
  .ticket-messages,.messages-list,.chat-messages{min-height:280px!important;max-height:55dvh!important}
  .ticket-compose,.chat-compose,.message-compose{position:sticky!important;bottom:0!important;background:var(--card)!important;padding-bottom:calc(.75rem + env(safe-area-inset-bottom))!important}
  .ticket-message,.chat-message{max-width:92%!important}
  .ticket-info-grid,.tcd-info-grid,.admin-ticket-info-grid{grid-template-columns:1fr!important}
}

/* =========================================================
   MODULE-SPECIFIC SAFETY NETS
   ========================================================= */
@media (max-width:900px){
  .socialmod-layout,.socialmod-shell,.live-chat-layout,.voice-layout,.vc-layout,
  .applications-layout,.users-layout,.audit-layout,.shop-layout,.website-editor-layout{
    grid-template-columns:1fr!important;display:grid!important;
  }
  .socialmod-sidebar,.vc-sidebar,.module-sidebar{width:100%!important;max-width:none!important;position:static!important}
  .socialmod-detail,.module-detail{min-height:420px!important}
}

@media (max-width:640px){
  .form-grid,.app-form-grid,.settings-form-grid,.profile-grid,.shop-form-grid{grid-template-columns:1fr!important}
  .tabs,.subtabs,.wtab-list,.status-tabs{overflow-x:auto!important;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch}
  .tab-btn,.subtab,.wtab,.status-tab{flex:0 0 auto!important}
  .avatar-row,.profile-head,.user-head,.member-head{align-items:flex-start!important;flex-direction:column!important}
  .pagination{max-width:100%;overflow-x:auto;justify-content:flex-start!important}
}

/* Print remains clean. */
@media print{
  .sidebar,.topbar,.mobile-menu,.nav,.mobile-nav-backdrop,.mobile-nav-btn{display:none!important}
  .layout,.main,.content{display:block!important;width:100%!important;height:auto!important;overflow:visible!important}
}
