@charset "utf-8";

/*
  tl_category_gallery_en
  - List view matches itemlist_en mini gallery cards
  - View/Write/Comment are reused from tl_gallery via wrapper PHP
*/

#bo_gall.wa-catgall{--wa-accent:#ff6600;--wa-text:#111;--wa-muted:#667085;--wa-border:rgba(16,24,40,.08);--wa-shadow:0 8px 18px rgba(16,24,40,.08);--wa-shadow-hover:0 18px 34px rgba(16,24,40,.14)}

#bo_gall.wa-catgall #bo_btn_top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px 0}
#bo_gall.wa-catgall #bo_list_total{color:var(--wa-muted);font-size:13px;font-weight:700}
#bo_gall.wa-catgall .btn_bo_user{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#bo_gall.wa-catgall .btn_bo_user a.btn,#bo_gall.wa-catgall .btn_bo_user button.btn{border-radius:12px}

#bo_gall.wa-catgall .wa-catgall__write{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:38px;padding:0 14px;border-radius:12px;background:var(--wa-accent);color:#fff;font-weight:800;text-decoration:none;border:1px solid var(--wa-accent);transition:transform .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease}
#bo_gall.wa-catgall .wa-catgall__write:hover{background:#ff7a1a;border-color:#ff7a1a;box-shadow:0 10px 20px rgba(255,102,0,.22);transform:translateY(-1px);text-decoration:none;color:#fff}

/* grid */
#bo_gall.wa-catgall #gall_ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:0;flex-wrap:initial}
#bo_gall.wa-catgall #gall_ul::before,#bo_gall.wa-catgall #gall_ul::after{display:none !important}

#bo_gall.wa-catgall .gall_li{width:auto !important;padding:0 !important;margin:0 !important;border:none !important;background:transparent !important}
#bo_gall.wa-catgall .gall_li{position:relative}
#bo_gall.wa-catgall .gall_box{background:#fff;border-radius:18px;overflow:hidden;border:1px solid var(--wa-border);box-shadow:var(--wa-shadow);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
#bo_gall.wa-catgall .gall_box:hover{transform:translateY(-3px);box-shadow:var(--wa-shadow-hover);border-color:rgba(255,102,0,.45)}

/* admin edit button */
#bo_gall.wa-catgall .wa-catgall__edit{position:absolute;right:10px;top:10px;z-index:3;display:inline-flex;align-items:center;justify-content:center;height:30px;padding:0 10px;border-radius:999px;background:rgba(17,17,17,.72);color:#fff;text-decoration:none;font-size:12px;font-weight:900;border:1px solid rgba(255,255,255,.18)}
#bo_gall.wa-catgall .wa-catgall__edit:hover{text-decoration:none;background:rgba(17,17,17,.85)}

#bo_gall.wa-catgall .wa-catgall__img{width:100%;aspect-ratio:16/9;background-color:#f2f4f7;background-size:cover;background-position:center;background-repeat:no-repeat}

/* video marker */
#bo_gall.wa-catgall .wa-catgall__img[data-video-src],
#bo_gall.wa-catgall .wa-catgall__img.wa-catgall__img--video{position:relative}
#bo_gall.wa-catgall .wa-catgall__img[data-video-src]::after,
#bo_gall.wa-catgall .wa-catgall__img.wa-catgall__img--video::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:999px;background:rgba(0,0,0,.55);box-shadow:0 10px 24px rgba(0,0,0,.25);}
#bo_gall.wa-catgall .wa-catgall__img[data-video-src]::before,
#bo_gall.wa-catgall .wa-catgall__img.wa-catgall__img--video::before{content:"";position:absolute;left:50%;top:50%;transform:translate(calc(-50% + 3px),-50%);width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:16px solid rgba(255,255,255,.95);z-index:1;}
#bo_gall.wa-catgall .wa-catgall__body{padding:14px 14px 12px 14px}
#bo_gall.wa-catgall .wa-catgall__subject{font-size:15px;font-weight:900;color:var(--wa-text);line-height:1.25;max-height:2.6em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
#bo_gall.wa-catgall .wa-catgall__meta{margin-top:10px;display:flex;align-items:center;justify-content:space-between;color:var(--wa-muted);font-size:12px;font-weight:700}

#bo_gall.wa-catgall .empty_list{grid-column:1/-1;padding:16px 14px;border:1px dashed rgba(16,24,40,.18);border-radius:16px;background:#fff;color:var(--wa-muted);font-weight:700}

/* category tab (if enabled) */
#bo_gall.wa-catgall #bo_cate{margin:0 0 12px 0}
#bo_gall.wa-catgall #bo_cate_ul{display:flex;gap:8px;flex-wrap:wrap}
#bo_gall.wa-catgall #bo_cate_ul a{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:999px;border:1px solid rgba(16,24,40,.12);color:var(--wa-text);text-decoration:none;font-weight:800;font-size:13px}
#bo_gall.wa-catgall #bo_cate_ul a#bo_cate_on{background:var(--wa-accent);border-color:var(--wa-accent);color:#fff}

@media (max-width:1024px){
  #bo_gall.wa-catgall #gall_ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
}
@media (max-width:520px){
  #bo_gall.wa-catgall #gall_ul{grid-template-columns:repeat(1,minmax(0,1fr))}
}

/* View modal (video or iframe) */
.wa-view-modal{position:fixed;left:0;top:0;right:0;bottom:0;z-index:10000}
.wa-view-modal[hidden]{display:none}
.wa-view-modal__backdrop{position:absolute;left:0;top:0;right:0;bottom:0;background:rgba(0,0,0,.65)}
.wa-view-modal__panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(1200px,calc(100vw - 24px));height:min(92vh,920px);background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 24px 64px rgba(0,0,0,.35)}
.wa-view-modal__close{position:absolute;right:10px;top:10px;z-index:3;border:0;background:rgba(0,0,0,.65);color:#fff;border-radius:999px;padding:8px 12px;font-size:12px;cursor:pointer}
.wa-view-modal__content{position:absolute;left:0;top:0;right:0;bottom:0}
.wa-view-modal__frame{position:absolute;left:0;top:0;width:100%;height:100%;border:0}
.wa-view-modal__video{position:absolute;left:0;top:0;right:0;bottom:0;display:flex;flex-direction:column;background:#000}
.wa-view-modal__player{width:100%;height:100%;max-height:100%;flex:1;background:#000}
.wa-view-modal__actions{position:absolute;left:12px;bottom:12px;z-index:2;display:flex;gap:8px;align-items:center}
.wa-view-modal__open{display:inline-flex;align-items:center;justify-content:center;height:34px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.92);color:#111;text-decoration:none;font-weight:800;font-size:12px;border:1px solid rgba(0,0,0,.08)}
.wa-view-modal__open:hover{text-decoration:none;filter:brightness(.98)}

/* Write modal (iframe) */
.wa-write-modal{position:fixed;left:0;top:0;right:0;bottom:0;z-index:10010}
.wa-write-modal[hidden]{display:none}
.wa-write-modal__backdrop{position:absolute;left:0;top:0;right:0;bottom:0;background:rgba(0,0,0,.65)}
.wa-write-modal__panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(1200px,calc(100vw - 24px));height:min(92vh,920px);background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 24px 64px rgba(0,0,0,.35)}
.wa-write-modal__close{position:absolute;right:10px;top:10px;z-index:3;border:0;background:rgba(0,0,0,.65);color:#fff;border-radius:999px;padding:8px 12px;font-size:12px;cursor:pointer}
.wa-write-modal__frame{position:absolute;left:0;top:0;width:100%;height:100%;border:0}