/*
 * Veleno Mobile V2 — final adaptive layer
 * Loaded after the original theme and mobile-hardening layer.
 * Scope: phones/tablets only; desktop presentation remains unchanged.
 */
:root{
  --vm2-touch:44px;
  --vm2-gap:clamp(8px,2.8vw,14px);
  --vm2-radius:10px;
  --vm2-surface:rgba(8,8,10,.92);
  --vm2-border:rgba(186,25,43,.42);
}

/* Better intrinsic sizing without rewriting the desktop grid. */
html,body{min-width:0;}
body{min-height:100svh;}
main,#main,.main,.content,#content,.page-content,.veleno-main-chamber,
.panel,.panel-body,.well,.card,.card-body,.modal-content,.tab-content{min-width:0;}

/* Only mark actual runtime offenders; this is safer than neutralising every inline size. */
.vm2-overflow-fix{max-width:100%!important;min-width:0!important;}
.vm2-scroll-region{max-width:100%!important;overflow:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}

/* Media must preserve ratio, but maps/terminals can explicitly opt into a fixed viewport. */
img:not(.vm2-fixed-media){object-fit:contain;}
video,iframe,embed,object{display:block;}
iframe{border:0;}

@media (max-width:991px){
  /* Tablet: keep two-column Bootstrap layouts where space permits, but stop rigid custom grids. */
  [style*="grid-template-columns"]{column-gap:var(--vm2-gap)!important;row-gap:var(--vm2-gap)!important;}
  .panel,.well,.card{background-clip:padding-box;}
  .navbar-nav>li>a{touch-action:manipulation;}
  .dropdown-menu a,.btn,button,input,select,textarea{touch-action:manipulation;}
}

@media (max-width:767px){
  html{scroll-padding-top:8px;}
  body{
    min-height:100dvh;
    background-attachment:scroll!important;
    background-position:center top!important;
    overscroll-behavior-y:none;
  }
  body.vm2-menu-open{overflow:hidden!important;touch-action:none;}

  /* Avoid duplicate visual load and very expensive effects on phones. */
  body::before,body::after{background-attachment:scroll!important;}
  .animated-bg,.particles,.particle-layer,.fog-layer,.smoke-layer,
  [class*="parallax"],[class*="ambient-canvas"]{animation-duration:18s!important;}

  /* Navbar: compact header + isolated scroll area. */
  .navbar-necro-apocalypse{position:relative!important;z-index:1050!important;}
  .navbar-header{border-radius:0 0 var(--vm2-radius) var(--vm2-radius);}
  .navbar-toggle{border-radius:8px!important;-webkit-tap-highlight-color:transparent;}
  .navbar-toggle:focus-visible{outline:2px solid #f2c078!important;outline-offset:2px;}
  .navbar-collapse.in,.navbar-collapse.collapsing{
    position:fixed!important;
    left:max(0px,env(safe-area-inset-left))!important;
    right:max(0px,env(safe-area-inset-right))!important;
    top:calc(58px + env(safe-area-inset-top))!important;
    width:auto!important;
    max-height:calc(100dvh - 58px - env(safe-area-inset-top))!important;
    padding:8px var(--vm-gutter) calc(18px + env(safe-area-inset-bottom))!important;
    background:linear-gradient(180deg,rgba(5,5,7,.985),rgba(12,5,7,.975))!important;
    box-shadow:0 18px 36px rgba(0,0,0,.72)!important;
    border-top:1px solid var(--vm2-border)!important;
    overscroll-behavior:contain!important;
  }
  .navbar-collapse.collapsing{transition:height .18s ease!important;}
  .navbar-collapse .veleno-cinema-stage,
  .navbar-collapse .veleno-cinema-poster,
  .navbar-collapse .veleno-cinema-copy{display:block!important;width:100%!important;min-height:0!important;}
  .veleno-cinema-copy{padding:4px 0 8px!important;}
  .veleno-cinema-kicker,.veleno-cinema-titleline,.veleno-cinema-trailer,
  .veleno-cinema-tags,.veleno-cinema-controls{display:none!important;}
  .veleno-cinema-menu-row{display:block!important;width:100%!important;}
  .veleno-primary-menu,.veleno-auth-menu{display:block!important;}
  .navbar-nav>li>a,.navbar-nav>li>.menu-bg-btn,.dropdown-menu>li>a{
    gap:10px!important;border-radius:8px!important;
  }
  .navbar-nav .menu-horror-icon{flex:0 0 28px!important;}
  #login-form{
    padding:12px!important;margin:5px 0 10px!important;
    border:1px solid var(--vm2-border)!important;border-radius:var(--vm2-radius)!important;
    background:var(--vm2-surface)!important;
  }

  /* Main canvas: remove Bootstrap's legacy negative-offset behaviours. */
  .row-offcanvas{position:static!important;left:auto!important;right:auto!important;transform:none!important;}
  .veleno-main-chamber{float:none!important;width:100%!important;}
  #sidebar.sidebar-offcanvas{
    position:static!important;inset:auto!important;float:none!important;
    width:100%!important;margin:0 0 var(--vm2-gap)!important;transform:none!important;
  }
  .visible-xs.pull-left,.visible-xs.pull-right{float:none!important;}

  /* Content rhythm and readable measure. */
  .panel,.well,.card,.alert,.jumbotron{margin-bottom:var(--vm2-gap)!important;}
  p,li,dd,td{line-height:1.52;}
  h1{font-size:clamp(26px,8.5vw,40px)!important;line-height:1.05!important;}
  h2{font-size:clamp(22px,7vw,32px)!important;line-height:1.12!important;}
  h3{font-size:clamp(18px,5.7vw,26px)!important;line-height:1.18!important;}
  .lead{font-size:clamp(16px,4.6vw,20px)!important;}

  /* Forms: preserve input groups and compact actions instead of forcing every control to 100%. */
  label{max-width:100%;}
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea{
    min-height:var(--vm2-touch);font-size:16px!important;
  }
  textarea{min-height:110px;resize:vertical;}
  .input-group{display:table!important;width:100%!important;}
  .input-group .form-control{display:table-cell!important;width:100%!important;}
  .input-group-addon,.input-group-btn{display:table-cell!important;width:1%!important;white-space:nowrap!important;vertical-align:middle!important;}
  .input-group-btn>.btn{min-height:var(--vm2-touch);width:auto!important;}
  .checkbox,.radio{min-height:var(--vm2-touch);padding-block:8px;}
  .checkbox input,.radio input{min-width:20px;min-height:20px;}
  .form-horizontal .control-label{text-align:left!important;padding-top:0!important;}

  /* Touch actions: don't make tiny toolbar controls unusably wide. */
  .btn:not(.btn-xs),button:not(.navbar-toggle){min-height:var(--vm2-touch);}
  .btn-toolbar,.actions,.action-buttons,.form-actions{align-items:stretch!important;}
  .btn-toolbar>.btn,.actions>.btn,.action-buttons>.btn,.form-actions>.btn{flex:1 1 140px;}
  .btn-group{display:flex!important;flex-wrap:wrap!important;gap:6px!important;}
  .btn-group>.btn{float:none!important;flex:1 1 auto!important;border-radius:6px!important;}
  .pull-left,.pull-right{max-width:100%;}

  /* Tabs and pagination stay usable instead of wrapping into an unreadable block. */
  .nav-tabs,.nav-pills,.pagination,.pager{
    display:flex!important;flex-wrap:nowrap!important;width:100%!important;
    overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch;
    scrollbar-width:thin;overscroll-behavior-inline:contain;
  }
  .nav-tabs>li,.nav-pills>li,.pagination>li,.pager>li{float:none!important;flex:0 0 auto!important;}
  .nav-tabs>li>a,.nav-pills>li>a,.pagination>li>a,.pagination>li>span{white-space:nowrap!important;min-height:var(--vm2-touch);}

  /* Tables: keep semantic tables intact, with sticky first/header cells where useful. */
  .vm-table-scroll,.table-responsive{border:1px solid rgba(255,255,255,.09);border-radius:8px;background:rgba(0,0,0,.18);}
  .vm-table-scroll>table,.table-responsive>table{margin-bottom:0!important;}
  .vm-table-scroll thead th,.table-responsive thead th{position:sticky;top:0;z-index:2;background:#16090c!important;}
  .vm-table-scroll.vm2-wide-table tbody th:first-child,
  .vm-table-scroll.vm2-wide-table tbody td:first-child{
    position:sticky;left:0;z-index:1;background:#100b0d;box-shadow:5px 0 8px rgba(0,0,0,.28);
  }
  .vm-table-scroll::after{position:sticky;left:0;}

  /* Modals and overlays account for browser chrome + on-screen keyboard. */
  .modal{overscroll-behavior:contain;}
  .modal-dialog{display:flex!important;align-items:flex-start!important;min-height:calc(100dvh - 16px);}
  .modal-content{width:100%!important;display:flex!important;flex-direction:column!important;}
  .modal-header,.modal-footer{flex:0 0 auto;}
  .modal-body{flex:1 1 auto;min-height:0;}
  .modal-footer{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:calc(12px + env(safe-area-inset-bottom))!important;}
  .modal-footer .btn{flex:1 1 120px;margin:0!important;}

  /* Chat/terminal/media areas get a useful mobile viewport, not a desktop fixed height. */
  .chat-messages,.message-list,[class*="chat-log"],[class*="messages-list"]{
    max-height:min(56dvh,520px)!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;
  }
  iframe[src*="terminal"],iframe[src*="telnet"],iframe[src*="irc"],
  [class*="terminal"] iframe,[class*="chat"] iframe{min-height:58dvh!important;}

  /* Tooltips are hover UI; native titles remain available. */
  .tooltip{display:none!important;}

  /* Avoid accidental horizontal drift from transformed decoration. */
  .vm2-transform-off{transform:none!important;left:auto!important;right:auto!important;}
}

@media (max-width:480px){
  :root{--vm2-gap:9px;}
  .container,.container-fluid{padding-left:10px!important;padding-right:10px!important;}
  .panel-body,.well,.card-body{padding:12px!important;}
  .panel-heading,.card-header{padding:11px 12px!important;}
  .btn-toolbar>.btn,.actions>.btn,.action-buttons>.btn,.form-actions>.btn{flex-basis:100%;}
  .media-left,.media-right,.media-body{display:block!important;width:auto!important;}
  .media-left,.media-right{padding:0 0 9px!important;}
  .media-object{margin-inline:auto;}
  .list-group-item{padding:11px!important;}
}

@media (max-width:360px){
  .navbar-brand{font-size:15px!important;}
  .panel-body,.well,.card-body,.modal-body{padding:10px!important;}
  .table>thead>tr>th,.table>tbody>tr>td{padding:8px 7px!important;}
}

@media (orientation:landscape) and (max-height:520px) and (max-width:900px){
  .navbar-collapse.in,.navbar-collapse.collapsing{top:50px!important;max-height:calc(100dvh - 50px)!important;}
  .navbar-header,.navbar-brand{height:50px!important;min-height:50px!important;}
  .navbar-toggle{height:40px!important;min-height:40px!important;margin:5px 0!important;}
  iframe[src*="terminal"],iframe[src*="telnet"],iframe[src*="irc"]{min-height:72dvh!important;}
}

/* Accessibility and battery-saving modes. */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important;}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
}
@media (prefers-reduced-transparency:reduce){
  .navbar-collapse.in,.modal-content,.panel,.well,.card{background:#0b090a!important;backdrop-filter:none!important;}
}
@media (hover:none) and (pointer:coarse){
  a:hover,.btn:hover{transform:none!important;}
  *{-webkit-tap-highlight-color:rgba(180,22,42,.18);}
}