/* ax-theme.css - sexarabssx.com KVS 9.6 restyle (red accent, Tajawal, pill UI). Loaded after all-responsive-*.css. */
:root{--ax-accent:#db1139;--ax-accent-h:#c4062b;--ax-text:#212121;--ax-meta:#757575;--ax-pill:#e0dfdf;--ax-hd:#e00;--ax-font:"Tajawal",Tahoma,Arial,sans-serif}

/* ---------- base / font / RTL ---------- */
html[dir="rtl"] body,html[dir="rtl"] input,html[dir="rtl"] textarea,html[dir="rtl"] select,html[dir="rtl"] button,
body,input,textarea,select,button{font-family:var(--ax-font)}
html,body{max-width:100%;overflow-x:hidden}
html[dir="rtl"] body{direction:rtl;text-align:right}
.player,.player-holder,.player-wrap,#kt_player,#kt_player *{direction:ltr!important}

/* ---------- container: red top line + soft gradient ---------- */
.container{border-top:3px solid var(--ax-accent);background:linear-gradient(to bottom,#e7e7e7 130px,#fefefe 300px)}

/* ---------- header (mobile first) ---------- */
.header{padding:10px;background:transparent}
.header-inner{max-width:1260px;flex-wrap:wrap;gap:10px}
.logo img{max-width:180px;height:auto;aspect-ratio:218/48}
.search{flex:1 1 100%;order:3;padding:0}
html[dir="rtl"] .search form{padding:0 0 0 10px}
.search .search-text input{background:#212121;color:#fff;border-radius:20px;font-size:14px;padding:13px 20px 13px 60px}
html[dir="ltr"] .search .search-text input{padding:13px 60px 13px 20px}
.search .search-button{background-color:var(--ax-accent);border-radius:20px;width:60px}
html[dir="rtl"] .search .search-button{right:auto;left:0}
.no-touch .search .search-button:hover{background-color:var(--ax-accent-h)}
@media (min-width:861px){
  .header{padding:20px}
  .header-inner{flex-wrap:nowrap}
  .logo img{max-width:218px}
  .search{flex:1 1;order:2;padding:0 100px 0 0}
  html[dir="ltr"] .search{padding:0 0 0 100px}
}

/* ---------- navigation ---------- */
.header + nav{background:#fff;border-color:#dfe0e1}
.navigation{max-width:1260px}
.navigation .primary{font-size:15px;font-weight:500}
.navigation .primary a{color:var(--ax-text)}
.navigation .primary a:before{background-color:var(--ax-accent)}
html[dir="rtl"] .navigation .primary a:before{left:auto;right:0}
.navigation .primary .selected a,.no-touch .navigation .primary a:hover{color:var(--ax-accent)}
.navigation.open .button .ico-bar{background:var(--ax-accent)}
.navigation .primary .ax-ext a{color:var(--ax-accent)}
@media (max-width:1152px){
  .navigation .primary{max-width:330px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.15)}
  html[dir="rtl"] .navigation .primary{right:0;left:auto;text-align:right}
  .navigation .primary a{padding:12px 20px;text-align:right}
}
@media (min-width:1153px){.navigation .primary{font-size:17px}}

/* ---------- headline / sort pills ---------- */
.headline h1,.headline h2{font-size:1.9rem;font-weight:500;color:var(--ax-text)}
html[dir="rtl"] .headline{direction:rtl}
.sort{background:var(--ax-pill);border-radius:15px}
@media (min-width:861px){.headline h1,.headline h2{font-size:2.4rem}}

/* ---------- sidebar (top categories) ---------- */
html[dir="rtl"] .sidebar{margin:75px 0 0 15px;box-shadow:1px 1px 5px rgba(207,207,207,.65)}
.sidebar .list a:hover,.no-touch .sidebar .list a:hover{color:var(--ax-accent)}

/* ---------- video grid: mobile first (1 → 2 → 3 → 4 → 3+sidebar) ---------- */
.list-videos .item,.sidebar + .main-container .list-videos .item{width:calc(100% - 10px)}
@media (min-width:421px){.list-videos .item,.sidebar + .main-container .list-videos .item{width:calc(50% - 10px)}}
@media (min-width:641px){.list-videos .item,.sidebar + .main-container .list-videos .item{width:calc(33.33% - 10px)}}
@media (min-width:861px){.list-videos .item,.sidebar + .main-container .list-videos .item{width:calc(25% - 10px)}}
@media (min-width:1256px){.list-videos .item{width:calc(25% - 10px)}.sidebar + .main-container .list-videos .item{width:calc(33.33% - 10px)}}

/* ---------- card ---------- */
html[dir="rtl"] .list-videos .item{text-align:right}
.list-videos .item{border-radius:0 0 5px 5px}
.item .img{background-color:var(--ax-pill)}
.item .img img.thumb{object-fit:cover}
.is-hd{background-color:var(--ax-hd);border-radius:12px;opacity:.9}
html[dir="rtl"] .is-hd{right:auto;left:5px}
.item .img .duration{position:absolute;bottom:6px;right:6px;z-index:3;background:rgba(0,0,0,.75);color:#fff;font-size:12px;font-weight:700;line-height:1;padding:4px 6px;border-radius:4px;direction:ltr}
.item .img .duration:before{display:none}
.item .title{font-size:14px;font-weight:500;line-height:18px;color:var(--ax-text)}
.no-touch .item:hover .title{color:var(--ax-accent)}
.item .wrap{color:var(--ax-meta)}
html[dir="rtl"] .item .wrap .rating,html[dir="rtl"] .item .wrap .views,html[dir="rtl"] .item .wrap .added{padding-left:0;padding-right:20px}
html[dir="rtl"] .item .wrap .rating:before,html[dir="rtl"] .item .wrap .views:before,html[dir="rtl"] .item .wrap .added:before{left:auto;right:0}

/* ---------- pagination ---------- */
.pagination li a,.pagination li span{border-radius:20px;padding:12px 15px;background:var(--ax-pill);color:var(--ax-text)}
.pagination li.page-current span{background:var(--ax-accent);color:#fff}
.no-touch .pagination li a:hover{background:#212121;color:#fff}
@media (max-width:640px){.pagination .first,.pagination .last,.pagination .jump,.pagination .page{display:none}}

/* ---------- tags cloud (live parity) ---------- */
.tags-cloud .all{background:#c4001a!important;color:#fff!important;border-color:#c4001a!important}

/* ---------- SEO text ---------- */
.content_text{max-width:1260px;margin:10px auto 20px;padding:0 10px;font-size:14px;line-height:1.7;color:#444}

/* ---------- footer ---------- */
.footer-margin{background:linear-gradient(to bottom,#f5f5f5,#e7e7e7)}
.footer-margin .content_title{text-align:center;font-size:12px;color:var(--ax-meta);padding-top:10px}
.footer .footer-wrap{font-family:var(--ax-font);font-size:13px}
.footer .logo-footer{margin:0 auto 15px}
.footer .logo-footer img{max-width:180px;height:auto}
.footer .nav a{background:#fff;border-radius:15px}
.no-touch .footer .nav a:hover,.footer a:hover{color:var(--ax-accent)}

/* ---------- accent recolor of every stock-blue (#276fdb) rule ---------- */
.autocomplete-suggestions strong{color: #db1139;border-bottom: 1px solid #db1139}
.no-touch a:hover{color: #db1139}
form .section-title.expand:hover, form .section-title.collapse:hover{color: #db1139}
form .checkbox:checked + label::before, form .checkbox:checked + span::before{background-color: #db1139;border: 1px solid #db1139}
form .radio:checked + span::before, form .radio:checked + label::before{background-color: #db1139}
form .submit{background-color: #db1139}
.margin-fix .bottom .submit.active, .margin-fix .bottom .submit.right.active, form .submit.active{background-color: #db1139}
form .bottom .links p:first-child a{color: #db1139}
.no-touch form .bottom a:hover{color: #db1139}
.no-touch form .bottom .submit.right:hover{background-color: #db1139}
form .success{background: #db1139}
form .progressbar{border: 0.2rem solid #db1139}
form .progressbar .progress{background: #db1139}
.toggle-button.inversed.active input::before{background-color: #db1139}
.toggle-button.active{background-color: #db1139}
.toggle-button.inversed.active{border: 1px solid #db1139;background-color: #db1139}
.top-links{border-bottom: 2px solid #db1139}
.network a::before{background-color: #db1139}
.network a:hover{color: #db1139}
.no-touch .member-links a:hover, .no-touch .member-links a.disabled:hover{background-color: #db1139}
.member-links .languages:hover{background-color: #db1139}
.member-links .languages a:hover{background-color: #db1139}
.search .search-button{background: #db1139 url("../images/search.svg") center no-repeat}
.navigation.open .button .ico-bar{background: #db1139}
.navigation .primary a:before{background-color: #db1139}
.no-touch .navigation .primary a:hover{color: #db1139}
.navigation .primary .selected a{color: #db1139}
.navigation .primary .drop:hover > a{background-color: #db1139}
.no-touch .navigation .primary ul li a:hover{background-color: #db1139}
.navigation .secondary a:before{background-color: #db1139}
.no-touch .navigation .secondary a:hover{color: #db1139}
.no-touch .footer .nav a:hover{background-color: #db1139}
.sort:focus, .sort:hover{background-color: #db1139}
.no-touch .sort ul a:hover{background: #db1139}
.headline .button, .headline .more{background-color: #db1139}
.no-touch .tags-cloud a:hover{background-color: #db1139}
.no-touch .margin-fix .bottom .submit:hover, .no-touch .margin-fix .bottom .submit.right:hover{background-color: #db1139}
.no-touch .item:hover .title{color: #db1139}
.item.disabled .title, .item.processing .title{color: #db1139}
.no-touch .list-subscriptions .item .title:hover{color: #db1139}
.no-touch .item:hover .title{color: #db1139}
.item .positive{color: #db1139}
.no-touch .item .ico-fav-0:hover{background-color: #db1139}
.no-touch .item .ico-fav-1:hover{background-color: #db1139}
.line-disabled, .line-error, .line-processing{background: #db1139}
.line-premium [class*="ico"]:before, .line-private [class*="ico"]:before{color: #db1139}
.item-control .toggle-button.active, .no-touch .item-control .toggle-button:hover{background-color: #db1139}
.item-control .toggle-button[data-action="select"].active::after{background-color: #db1139;border: 1px solid #db1139}
.no-touch .list-comments .comment-options .comment-edit:hover{background-color: #db1139}
.no-touch .list-comments .comment-options a.comment-like:hover{color: #db1139}
.list-comments .comment-options span{background-color: #db1139}
.no-touch .list-messages .added.editable:hover{color: #db1139}
.pagination .page-current a, .pagination .page-current span{background-color: #db1139}
.load-more a:hover{background: #db1139}
.sidebar .list a::before{background-color: #db1139}
.no-touch .sidebar .list a:hover{color: #db1139}
.no-touch .sidebar .comments .comment-text a:hover{color: #db1139}
.sidebar .comments .username a:hover{color: #db1139}
.sidebar .filter li input:checked + label::before{background-color: #db1139;border: 1px solid #db1139}
.no-touch .block-channel .img .channel-user:hover{background-color: #db1139}
.block-channel .channel-list .rating .full{background-color: #db1139}
.block-channel .channel-rating a{background-color: #db1139}
.no-touch .block-channel .channel-rating a.disabled:hover{background-color: #db1139}
.block-model .website a{color: #db1139}
.block-video .no-player .message a{color: #db1139}
.no-touch .block-video .playlist .item.selected img{border: 4px solid #db1139}
.block-video .playlist .item:hover .title{color: #db1139}
.block-album .images .message a{color: #db1139}
.rate-like.voted::before{color: #db1139}
.no-touch .rate-like:hover::before{color: #db1139}
.rating-container .scale-holder .scale{background-color: #db1139}
.btn-favourites:hover{background-color: #db1139}
.btn-favourites ul li > a:hover, .btn-favourites ul li > span:hover{background-color: #db1139}
.btn-favourites ul li span:before{color: #db1139}
.tabs-menu .toggle-button.active{background-color: #db1139}
.no-touch .tabs-menu .toggle-button:hover{background-color: #db1139}
.no-touch .block-details .item a:hover{background-color: #db1139}
.block-details .block-user .username a{background-color: #db1139}
.block-screenshots span.item:before{background-color: #db1139}
.block-screenshots a.item:before{border: 4px solid #db1139}
.no-touch .block-share .block-size a:hover{background-color: #db1139}
.block-comments .toggle-button.active{background-color: #db1139}
.no-touch .block-comments .toggle-button:hover{background-color: #db1139}
.related-videos .list-sort a:before, .related-albums .list-sort a:before, .related-videos .list-sort span:before, .related-albums .list-sort span:before{background-color: #db1139}
.related-videos .list-sort span, .related-albums .list-sort span, .related-videos .list-sort a:hover, .related-albums .list-sort a:hover{color: #db1139}
.btn-subscribe .toggle-button{background-color: #db1139}
.user-menu span{color: #db1139}
.user-menu span:before, .user-menu a:before{background-color: #db1139}
.no-touch .user-menu a:hover{color: #db1139}
/* ===== stock96 additions (live features on 9.6 markup) ===== */
.ax-chips{display:flex;flex-wrap:wrap;gap:8px;padding:12px 10px;margin:0 0 10px;background:transparent;border:0}
.ax-chips a,.search-cloud.ax-chips a{display:inline-block;padding:7px 14px;border-radius:20px;background:var(--ax-pill);color:var(--ax-text);font:500 14px/1.2 var(--ax-font);text-decoration:none;transition:background .15s,color .15s;margin:0}
.ax-chips a:hover,.search-cloud.ax-chips a:hover{background:var(--ax-accent);color:#fff}
.search-cloud.ax-chips .title,.search-cloud.ax-chips h2{width:100%;margin:0 0 4px;font:700 16px var(--ax-font);color:var(--ax-text)}
.ax-popular{max-width:1260px;margin:10px auto 0}
.load-more{text-align:center;margin:15px 0}
.load-more a{display:inline-flex;align-items:center;gap:8px;padding:10px 26px;border-radius:24px;background:var(--ax-accent);color:#fff;font:700 15px var(--ax-font);text-decoration:none}
.load-more a i.icon-down-arrow{font-size:12px;line-height:1}
.ax-cta{text-align:center;margin:15px 0}
.ax-cta a{display:inline-block;padding:10px 22px;background:var(--ax-accent);color:#fff;border-radius:6px;font:700 15px var(--ax-font);text-decoration:none}
.ax-cta a:hover{background:var(--ax-accent-h)}
.player-wrap{position:relative}
.download-btn-delayed[aria-disabled="true"],.download-btn-delayed.is-waiting{opacity:.65;pointer-events:none}
.footer .content_title{text-align:center;color:var(--ax-meta);font-size:12px;margin:10px 0 4px}
.footer .logo-footer img{height:auto;max-width:180px}
@media (max-width:640px){.ax-chips{gap:6px;padding:8px}.ax-chips a{padding:6px 11px;font-size:13px}}

/* ===== fix1 (2026-10-28): arabx-style cards, headline/sort, mobile menu ===== */

/* --- card meta: row1 duration | rating, row2 date | views --- */
.list-videos .item .img .ax-dur-img{display:none}
.item .wrap.ax-meta{display:grid;grid-template-columns:1fr auto;grid-template-areas:"dur rat" "add vws";row-gap:6px;column-gap:10px;padding:2px 10px 10px;font-size:13px;line-height:1.3;color:var(--ax-meta)}
.item .wrap.ax-meta .duration{grid-area:dur;justify-self:start}
.item .wrap.ax-meta .rating{grid-area:rat;justify-self:end;color:var(--ax-accent);font-weight:700}
.item .wrap.ax-meta .rating:before{color:var(--ax-accent)}
.item .wrap.ax-meta .added{grid-area:add;justify-self:start}
.item .wrap.ax-meta .views{grid-area:vws;justify-self:end}
.item .wrap.ax-meta .added em{font-style:normal}
.item .wrap.ax-meta div:before{font-size:14px;color:var(--ax-meta)}
.item .wrap.ax-meta .rating:before{color:var(--ax-accent)}
.item .wrap.ax-meta .duration,.item .wrap.ax-meta .added,.item .wrap.ax-meta .rating{padding-left:20px}
.item .wrap.ax-meta .views{padding-left:22px}
html[dir="rtl"] .item .wrap.ax-meta .duration,html[dir="rtl"] .item .wrap.ax-meta .added,html[dir="rtl"] .item .wrap.ax-meta .rating{padding-left:0;padding-right:20px}
html[dir="rtl"] .item .wrap.ax-meta .views{padding-left:0;padding-right:22px}
.item .wrap.ax-meta .views{unicode-bidi:plaintext}
html[dir="rtl"] .item .wrap.ax-meta div:before{left:auto;right:0}
.item .wrap.ax-meta .duration{unicode-bidi:isolate}
.list-videos .item .title{padding-top:8px}

/* --- section heading centered, sort full width under it (mobile/tablet) --- */
@media (max-width:860px){
  .main-container .headline,.content > .headline{flex-wrap:wrap;justify-content:center;text-align:center;padding-top:2rem}
  .main-container .headline h1,.main-container .headline h2,.content > .headline h1,.content > .headline h2{flex:1 1 100%;width:100%;text-align:center;margin:0 0 12px}
  .headline .sort,html[dir="rtl"] .headline .sort{flex:1 1 100%;width:100%;max-width:none;min-width:0;margin:0 0 8px;padding:12px 15px;border-radius:20px;background:var(--ax-pill);font-size:14px}
  .headline .sort strong{text-align:center}
  .headline .sort ul{border-radius:0 0 20px 20px}
  .headline .sort ul a{padding:10px 15px;text-align:center}
  .headline .more{margin:0 0 8px}
}

/* --- mobile menu: full-width white panel under the search bar --- */
@media (max-width:1152px){
  .navigation{position:relative}
  .navigation .button{display:block;width:100%;text-align:center}
  .navigation .primary,html[dir="rtl"] .navigation .primary{left:0;right:0;width:100%;max-width:none;top:100%;padding:6px 0 12px;background:#fff;box-shadow:0 8px 16px rgba(0,0,0,.12);border-top:1px solid #eee;transform:none;-webkit-transform:none;text-align:center;flex-direction:column;flex-wrap:nowrap;align-items:stretch}
  .navigation .primary > li,.navigation .primary > li:first-child{flex:0 0 auto;margin:0;text-align:center}
  .navigation .primary a,html[dir="rtl"] .navigation .primary a{display:block;padding:13px 20px;text-align:center;font-size:16px;color:var(--ax-text)}
  .navigation .primary a:before{display:none}
  .navigation .primary .selected a,.no-touch .navigation .primary a:hover{color:var(--ax-accent)}
  .navigation .primary .ax-ext a{color:var(--ax-accent);font-weight:700}
  /* home icon (#item1 = existing home link, stock renders it as an icon) */
  .navigation .primary > li:first-child{display:flex;justify-content:center;padding:4px 0 6px}
  .navigation .primary #item1{display:inline-block;width:56px;height:44px;padding:0;color:var(--ax-accent);border-bottom:3px solid var(--ax-accent)}
  .navigation .primary #item1::after{font-size:24px;color:var(--ax-accent)}
  /* close X centered + red */
  .navigation.open .button .ico-bar{background:var(--ax-accent)}
}

/* fix2: full-width big thumbnails on phones (arabx-like) */
@media (max-width:640px){
.list-videos .margin-fix{margin:0}
.list-videos .item,.sidebar + .main-container .list-videos .item{width:100%!important;margin:0 0 14px!important;float:none}
.list-videos .item .img{width:100%;padding-bottom:62%;height:0;position:relative;overflow:hidden;border-radius:0}
.list-videos .item .img img.thumb{position:absolute;top:0;left:0;width:100%!important;height:100%!important;object-fit:cover}
.list-videos .item .title{font-size:15px;line-height:1.5}
}