/* V8.5.1 polish: consistente formulieren, tabellen en kaarten */
:root{
 --polish-radius:9px;
 --polish-border:#396a7c;
 --polish-panel:#102a36;
 --polish-panel-soft:#0c222d;
 --polish-text:#e8f3f7;
 --polish-muted:#91b1bd;
}
form label{display:block;margin-bottom:11px;color:var(--polish-muted);font-size:12px;font-weight:700}
input,select,textarea{
 box-sizing:border-box;max-width:100%;border:1px solid var(--polish-border);
 border-radius:7px;background:#071e28;color:#fff;padding:10px 11px;outline:none
}
input:focus,select:focus,textarea:focus{border-color:#1da5e9;box-shadow:0 0 0 2px rgba(29,165,233,.16)}
textarea{min-height:110px;resize:vertical}
button,.button,.mini-button{cursor:pointer}
button:disabled,.button:disabled{cursor:not-allowed;opacity:.55}
.success,.alert{margin:13px 0;padding:12px 14px;border-radius:8px}
.success{border:1px solid #318c59;background:#123c2a;color:#bff1d1}
.alert{border:1px solid #ac5151;background:#421d25;color:#ffd0d0}
.admin-panel-card,.v8-panel,.v84-card,.account-card{
 overflow:hidden;border-radius:var(--polish-radius)
}
.admin-panel-card table{width:100%;border-collapse:collapse}
.admin-panel-card th,.admin-panel-card td{padding:10px;border-bottom:1px solid rgba(91,143,162,.25);text-align:left}
.admin-panel-card th{color:#88b4c4;font-size:10px;text-transform:uppercase;letter-spacing:.7px}
.widget-empty{padding:18px;border:1px dashed #416f80;border-radius:8px;color:#8fb0bd;text-align:center}
@media(max-width:700px){
 .admin-top{align-items:flex-start;flex-direction:column}
 .admin-form-grid{grid-template-columns:1fr!important}
 table{display:block;overflow-x:auto}
}


/* V8.6 kaartafstand en knopuitlijning */
.v84-grid,
.admin-form-grid,
.v82-dashboard-grid{
 gap:18px
}

.v84-card,
.admin-panel-card,
.v82-stat-card{
 box-sizing:border-box
}

.v84-card > .button:last-child,
.v84-card > a.button:last-child,
.admin-panel-card > .button:last-child{
 margin-top:auto
}

.v84-card form:last-child,
.admin-panel-card form:last-child{
 margin-top:auto
}

.v84-card .button,
.admin-panel-card .button{
 max-width:100%
}


/* V8.6 Recent gedraaid */
.history-layout{
 display:grid;
 grid-template-columns:minmax(0,1fr) 290px;
 gap:20px;
 align-items:start
}

.history-main{
 min-width:0
}

.history-search{
 display:grid;
 grid-template-columns:minmax(240px,1fr) 170px 190px auto auto;
 gap:10px;
 align-items:end;
 padding-bottom:18px;
 border-bottom:1px solid rgba(81,132,151,.35)
}

.history-search label{
 margin:0
}

.history-search label > span{
 display:block;
 margin-bottom:6px
}

.history-search input,
.history-search select{
 width:100%;
 min-height:42px
}

.history-search-button,
.history-reset{
 min-height:42px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 box-sizing:border-box;
 white-space:nowrap
}

.history-result-head{
 display:flex;
 justify-content:space-between;
 align-items:center;
 padding:18px 0 10px
}

.history-result-head small,
.history-panel-heading span{
 display:block;
 color:#65b4d3;
 font-size:10px;
 font-weight:800;
 letter-spacing:.9px
}

.history-result-head h2,
.history-panel-heading h2{
 margin:3px 0 0;
 color:#fff
}

.history-list{
 display:grid;
 gap:9px
}

.history-track{
 display:grid;
 grid-template-columns:64px minmax(0,1fr) 130px;
 gap:16px;
 align-items:center;
 min-height:68px;
 padding:10px 13px;
 border:1px solid #386a7c;
 border-radius:8px;
 background:#0d2733;
 transition:border-color .15s ease,background .15s ease,transform .15s ease
}

.history-track:hover{
 border-color:#238cc0;
 background:#103444;
 transform:translateY(-1px)
}

.history-track.is-latest{
 border-color:#1da5e9;
 box-shadow:inset 3px 0 0 #1da5e9
}

.history-time{
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 min-height:48px;
 padding-right:12px;
 border-right:1px solid rgba(91,144,164,.35);
 color:#9cc3d1;
 font-style:normal;
 line-height:1.2
}

.history-time strong{
 color:#d8ecf3;
 font-size:12px
}

.history-time span{
 margin-top:3px;
 font-size:13px
}

.history-track-copy{
 min-width:0
}

.history-track-copy h3{
 display:flex;
 flex-wrap:wrap;
 gap:5px;
 align-items:baseline;
 margin:0;
 line-height:1.35
}

.history-artist{
 color:#fff;
 font-size:15px;
 font-weight:800
}

.history-separator{
 color:#587f8f
}

.history-title{
 color:#98bdcb;
 font-size:14px;
 font-weight:500
}

.history-track-copy p{
 margin:5px 0 0;
 color:#779dac;
 font-size:11px
}

.history-track-copy p strong{
 color:#42aee0
}

.history-track-status{
 display:flex;
 flex-direction:column;
 align-items:flex-end;
 gap:6px;
 min-width:0;
 text-align:right
}

.history-track-status small{
 color:#779dac;
 white-space:nowrap
}

.history-dj-badge{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 min-width:66px;
 padding:5px 8px;
 border-radius:6px;
 font-size:10px;
 font-weight:800;
 line-height:1
}

.history-dj-badge.is-auto{
 border:1px solid #236793;
 background:#104268;
 color:#63c0ee
}

.history-dj-badge.is-live{
 border:1px solid #b78a13;
 background:#eebd22;
 color:#382800
}

.history-sidebar{
 display:grid;
 gap:16px;
 position:sticky;
 top:92px
}

.history-panel-heading{
 padding-bottom:12px;
 border-bottom:1px solid rgba(81,132,151,.35)
}

.history-stat-grid{
 display:grid;
 grid-template-columns:1fr 1fr;
 margin-top:12px;
 border:1px solid #365f70;
 border-radius:8px;
 overflow:hidden
}

.history-stat-grid article{
 min-height:82px;
 padding:13px 9px;
 text-align:center;
 background:#0c2430
}

.history-stat-grid article:nth-child(odd){
 border-right:1px solid #365f70
}

.history-stat-grid article:nth-child(-n+2){
 border-bottom:1px solid #365f70
}

.history-stat-grid strong,
.history-stat-grid span{
 display:block
}

.history-stat-grid strong{
 color:#fff;
 font-size:22px
}

.history-stat-grid span{
 margin-top:5px;
 color:#82a8b7;
 font-size:10px
}

.history-quick-filters nav{
 display:grid;
 gap:7px;
 margin-top:12px
}

.history-quick-filters a{
 display:flex;
 align-items:center;
 min-height:38px;
 padding:0 12px;
 border:1px solid #315d70;
 border-radius:7px;
 background:#0b2330;
 color:#c3dbe4;
 text-decoration:none
}

.history-quick-filters a:hover,
.history-quick-filters a.active{
 border-color:#1da5e9;
 background:#103f58;
 color:#fff
}

@media(max-width:1050px){
 .history-layout{
  grid-template-columns:1fr
 }

 .history-sidebar{
  grid-template-columns:1fr 1fr;
  position:static
 }

 .history-search{
  grid-template-columns:minmax(220px,1fr) 160px 180px
 }

 .history-search-button,
 .history-reset{
  width:100%
 }
}

@media(max-width:720px){
 .history-search{
  grid-template-columns:1fr 1fr
 }

 .history-search-field{
  grid-column:1 / -1
 }

 .history-track{
  grid-template-columns:55px minmax(0,1fr);
  gap:11px
 }

 .history-track-status{
  grid-column:2;
  align-items:flex-start;
  text-align:left
 }

 .history-sidebar{
  grid-template-columns:1fr
 }
}

@media(max-width:480px){
 .history-search{
  grid-template-columns:1fr
 }

 .history-search-field{
  grid-column:auto
 }

 .history-track{
  grid-template-columns:1fr;
  padding:13px
 }

 .history-time{
  flex-direction:row;
  justify-content:flex-start;
  gap:7px;
  min-height:0;
  padding:0 0 8px;
  border-right:0;
  border-bottom:1px solid rgba(91,144,164,.35)
 }

 .history-time span{
  margin:0
 }

 .history-track-status{
  grid-column:auto;
  flex-direction:row;
  justify-content:space-between;
  align-items:center
 }
}


/* ==========================================================
   V8.7.1 GLOBAL RESPONSIVE ADMIN FIX
   ========================================================== */

.admin-page main.wrap{
 width:min(100% - 32px,1500px);
 max-width:1500px;
 margin-inline:auto
}

.admin-page .admin-content,
.admin-page .admin-main,
.admin-page .admin-shell-content,
.admin-page .admin-panel-card,
.admin-page .admin-top,
.admin-page .v82-stat-card,
.admin-page form,
.admin-page label{
 min-width:0
}

.admin-page input,
.admin-page select,
.admin-page textarea,
.admin-page button,
.admin-page .button,
.admin-page .mini-button{
 max-width:100%;
 box-sizing:border-box
}

.admin-page .admin-card-heading,
.admin-page .admin-top{
 gap:14px;
 flex-wrap:wrap
}

.admin-page .admin-form-grid,
.admin-page .v82-two-col,
.admin-page .hotel-integration-layout{
 align-items:start
}

/* Hotelaccounts: geen afgekorte labels, overlappende knoppen of afgesneden invoer */
.hotel-integration-layout{
 display:grid!important;
 grid-template-columns:minmax(300px,370px) minmax(0,1fr)!important;
 gap:22px!important
}

.hotel-settings-card{
 position:sticky;
 top:96px
}

.hotel-link-list{
 display:grid;
 gap:18px
}

.hotel-link-card{
 min-width:0;
 padding:18px!important;
 overflow:hidden
}

.hotel-link-current{
 display:grid!important;
 grid-template-columns:94px minmax(0,1fr)!important;
 gap:16px!important;
 align-items:center!important;
 padding-bottom:15px!important
}

.hotel-link-avatar{
 display:grid!important;
 place-items:center!important;
 width:94px!important;
 min-width:94px!important;
 height:112px!important;
 overflow:hidden!important
}

.hotel-link-avatar img{
 display:block!important;
 width:100%!important;
 height:100%!important;
 object-fit:contain!important
}

.hotel-link-current h3{
 margin:7px 0 4px;
 overflow-wrap:anywhere
}

.hotel-link-current p{
 margin:0;
 line-height:1.45;
 overflow-wrap:anywhere
}

.hotel-link-actions{
 display:grid!important;
 grid-template-columns:minmax(220px,1fr) minmax(270px,1.2fr) minmax(120px,auto)!important;
 gap:14px!important;
 align-items:end!important;
 padding-top:15px!important;
 border-top:1px solid rgba(89,138,156,.28)
}

.hotel-link-form{
 display:grid!important;
 grid-template-columns:minmax(0,1fr) minmax(95px,auto)!important;
 gap:10px!important;
 align-items:end!important;
 min-width:0
}

.hotel-link-form label{
 display:grid!important;
 gap:7px!important;
 min-width:0!important;
 margin:0!important;
 color:#d7e9ef!important;
 line-height:1.2!important;
 white-space:normal!important
}

.hotel-link-form input{
 width:100%!important;
 min-width:0!important;
 height:42px!important
}

.hotel-link-form .mini-button,
.hotel-link-actions > form > .mini-button{
 display:inline-flex!important;
 align-items:center!important;
 justify-content:center!important;
 min-height:42px!important;
 width:100%!important;
 padding:8px 12px!important;
 white-space:normal!important;
 line-height:1.15!important;
 text-align:center!important
}

.hotel-search-results article{
 grid-template-columns:64px minmax(0,1fr)!important;
 min-width:0
}

.hotel-search-results article div{
 min-width:0
}

.hotel-search-results strong,
.hotel-search-results small,
.hotel-search-results p{
 overflow-wrap:anywhere
}

/* Generieke toolbars mogen netjes doorlopen */
.v82-toolbar{
 display:grid!important;
 grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important;
 gap:12px!important;
 align-items:end!important
}

.v82-toolbar > *{
 min-width:0!important
}

.v82-toolbar button,
.v82-toolbar .button{
 min-height:42px
}

/* Meldingenbel */
.site-notification-link{
 position:relative;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 width:38px;
 height:38px;
 margin-left:8px;
 border:1px solid #315f75;
 border-radius:999px;
 background:#0c2937;
 color:#fff;
 text-decoration:none
}

.site-notification-link:hover{
 border-color:#1da5e9;
 background:#123e52
}

.site-notification-count{
 position:absolute;
 top:-5px;
 right:-5px;
 display:grid;
 place-items:center;
 min-width:18px;
 height:18px;
 padding:0 4px;
 border:2px solid #09202b;
 border-radius:999px;
 background:#e84d4d;
 color:#fff;
 font-size:9px;
 font-weight:900
}

/* XP voortgang */
.v871-xp-progress{
 margin-top:11px
}

.v871-xp-progress-track{
 height:9px;
 overflow:hidden;
 border:1px solid #315f72;
 border-radius:999px;
 background:#071f2a
}

.v871-xp-progress-fill{
 height:100%;
 border-radius:999px;
 background:linear-gradient(90deg,#1da5e9,#f1c12c)
}

.v871-xp-progress small{
 display:block;
 margin-top:5px;
 color:#82a9b8
}

/* Dashboard snelle acties */
.v871-quick-actions{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
 gap:12px;
 margin-bottom:20px
}

.v871-quick-actions a{
 display:flex;
 align-items:center;
 gap:10px;
 min-height:48px;
 padding:12px 14px;
 border:1px solid #35697c;
 border-radius:8px;
 background:#0e2d3a;
 color:#eaf6fa;
 text-decoration:none;
 font-weight:800
}

.v871-quick-actions a:hover{
 border-color:#1da5e9;
 background:#123e51
}

/* Error center */
.v871-error-list{
 display:grid;
 gap:10px
}

.v871-error-item{
 padding:13px;
 border:1px solid #5f3d45;
 border-radius:8px;
 background:#2c1b21;
 color:#ffd5d8;
 overflow:auto;
 white-space:pre-wrap;
 word-break:break-word
}

@media(max-width:1120px){
 .hotel-integration-layout{
  grid-template-columns:1fr!important
 }

 .hotel-settings-card{
  position:static
 }

 .hotel-link-actions{
  grid-template-columns:1fr 1fr!important
 }

 .hotel-link-actions > form:last-child{
  grid-column:1/-1
 }
}

@media(max-width:760px){
 .admin-page main.wrap{
  width:min(100% - 18px,1500px)
 }

 .hotel-link-current{
  grid-template-columns:74px minmax(0,1fr)!important
 }

 .hotel-link-avatar{
  width:74px!important;
  min-width:74px!important;
  height:92px!important
 }

 .hotel-link-actions,
 .hotel-link-form{
  grid-template-columns:1fr!important
 }

 .hotel-link-actions > form:last-child{
  grid-column:auto
 }

 .hotel-link-form .mini-button,
 .hotel-link-actions > form > .mini-button{
  width:100%!important
 }
}


/* ==========================================================
   V8.8.1 HOTELACCOUNT LAYOUT 2.1
   ========================================================== */

@media(min-width:1201px) and (max-width:1500px){
 .hotel-integration-layout{
  grid-template-columns:minmax(270px,320px) minmax(0,1fr)!important
 }

 .hotel-link-actions{
  grid-template-columns:1fr 1fr!important
 }

 .hotel-link-actions > form:last-child{
  grid-column:1/-1!important
 }

 .hotel-link-form{
  grid-template-columns:1fr!important
 }

 .hotel-link-form .mini-button{
  width:100%!important
 }
}

@media(max-width:1350px){
 .hotel-link-actions{
  grid-template-columns:1fr!important
 }

 .hotel-link-actions > form:last-child{
  grid-column:auto!important
 }

 .hotel-link-form{
  grid-template-columns:1fr!important
 }
}

.hotel-settings-card input{
 width:100%!important;
 min-width:0!important
}

.hotel-link-card{
 width:100%;
 box-sizing:border-box
}

.hotel-link-current > div:last-child{
 min-width:0
}

.hotel-link-actions form{
 min-width:0;
 margin:0
}

.hotel-link-actions label span{
 display:block;
 min-height:28px;
 overflow-wrap:anywhere
}

/* ==========================================================
   V8.8.1 GENERIEKE BEHEERKAARTEN
   ========================================================== */

.admin-page .admin-form-grid{
 grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr)
}

.admin-page .v8-badge-grid{
 grid-template-columns:repeat(auto-fill,minmax(235px,1fr))!important
}

.admin-page .v8-badge-item{
 min-width:0!important;
 overflow:hidden!important
}

.admin-page .v8-badge-item h3,
.admin-page .v8-badge-item p,
.admin-page .v8-badge-item small{
 overflow-wrap:anywhere!important
}

.admin-page .v8-badge-actions{
 display:grid!important;
 grid-template-columns:1fr!important;
 gap:7px!important
}

.admin-page .v8-badge-actions .mini-button{
 width:100%!important;
 white-space:normal!important
}

@media(max-width:1250px){
 .admin-page .admin-form-grid{
  grid-template-columns:1fr
 }
}

@media(max-width:850px){
 .admin-page .admin-panel-card{
  padding:15px!important
 }
}