/* Presentation for Flatsome's native Portfolio query, with editable projects in admin. */
.cctd-managed-projects{margin:0!important;}
.cctd-managed-projects>.container{padding:4px 2px 10px;max-width:none;margin-bottom:24px;}
.cctd-managed-projects .filter-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:0!important;}
.cctd-managed-projects .filter-nav>li{margin:0;}
.cctd-managed-projects .filter-nav a{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:99px;padding:7px 14px;min-height:38px;color:var(--text);font-size:13px;font-weight:600;line-height:1.4;text-transform:none;letter-spacing:0;}
.cctd-managed-projects .filter-nav a:before{display:none;}
.cctd-managed-projects .filter-nav .active>a{color:#fff;background:var(--brand);border-color:var(--brand);box-shadow:0 4px 12px rgba(1,90,170,.25);}
.cctd-managed-projects .cctd-filter-count{font-size:11px;padding:1px 6px;background:rgba(0,0,0,.08);border-radius:99px;font-weight:700;}
.cctd-managed-projects .active .cctd-filter-count{background:rgba(255,255,255,.25);}
.cctd-managed-projects .filter-nav a:hover{border-color:var(--brand);}
.cctd-managed-projects .filter-nav a:focus-visible{outline:3px solid #8dbdf0;outline-offset:2px;}
.cctd-managed-projects .portfolio-box{border-radius:12px;overflow:hidden;background:#0a1c30;box-shadow:0 3px 10px rgba(0,0,0,.06);}
.cctd-managed-projects .box-image img{width:100%;height:auto;}
.cctd-managed-projects .box-text{padding:16px 14px;color:#fff;background:linear-gradient(180deg,transparent,rgba(2,18,38,.98));opacity:0;transition:opacity .25s;}
.cctd-managed-projects .portfolio-box:hover .box-text,.cctd-managed-projects a:focus-visible .box-text{opacity:1;}
.cctd-managed-projects .box-text-inner{display:flex;flex-direction:column;gap:6px;}
.cctd-managed-projects .portfolio-box-title{font-size:14px;line-height:1.35;text-transform:none;color:#fff;font-weight:700;order:2;}
.cctd-managed-projects .portfolio-box-category{order:1;margin:0!important;opacity:1;}
.cctd-managed-projects .portfolio-box-category span{display:inline-block;opacity:1;transform:none;background:rgba(1,90,170,.9);border-radius:99px;padding:3px 9px;font-size:11px;line-height:1.2;}
.cctd-managed-projects .portfolio-box-category span:empty{display:none;}

/* A native modal dialog keeps keyboard focus inside the open viewer. */
html.cctd-project-viewer-open{overflow:hidden;}
dialog.cctd-project-viewer{position:fixed;inset:0;max-width:none;max-height:none;width:100%;height:100dvh;margin:0;padding:48px 64px 34px;border:0;background:#0d1927;color:#fff;overflow:auto;z-index:2147483647;box-sizing:border-box;}
dialog.cctd-project-viewer::backdrop{background:#0d1927;}
dialog.cctd-project-viewer[open]{display:flex;align-items:center;justify-content:center;}
.cctd-project-viewer-content{width:min(100%,880px);margin:auto;text-align:center;}
.cctd-project-viewer-image{display:block;margin:0 auto!important;max-width:100%;width:auto;max-height:calc(100dvh - 300px);height:auto;object-fit:contain;border-radius:8px;box-shadow:0 18px 45px rgba(0,0,0,.4);}
.cctd-project-viewer-info{margin-top:14px;}
.cctd-project-viewer-category{display:inline-block;border-radius:99px;padding:3px 10px;background:#015aaa;border:1px solid rgba(255,255,255,.2);color:#fff;font-size:12px;font-weight:700;line-height:1.2;text-transform:uppercase;}
.cctd-project-viewer-title{margin:6px 0 0!important;color:#fff;font-size:18px;line-height:1.35;font-weight:700;text-transform:none;}
.cctd-project-viewer-location{display:flex;align-items:center;justify-content:center;gap:6px;margin:5px 0 0!important;color:#8dbdf0;font-size:13px;line-height:1.4;}
.cctd-project-viewer-location:before{content:"";width:14px;height:14px;background:#60a5fa;mask:url(icons/i-pin.svg) center/contain no-repeat;}
.cctd-project-viewer-caption{margin:4px 0 0!important;color:#c5cfda;font-size:13px;line-height:1.4;white-space:pre-line;}
.cctd-project-viewer-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:12px;}
.cctd-project-viewer-actions a{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 16px;border-radius:99px;background:#015aaa;color:#fff;font-size:13px;line-height:1.2;font-weight:700;text-decoration:none;}
.cctd-project-viewer-actions a:before{content:"";width:16px;height:16px;background:currentColor;mask:url(icons/i-phone.svg) center/contain no-repeat;}
.cctd-project-viewer-actions .cctd-project-viewer-zalo{background:#0068ff;}
.cctd-project-viewer-actions .cctd-project-viewer-zalo:before{mask-image:url(icons/i-chat.svg);}
.cctd-project-viewer-actions a:hover{filter:brightness(1.12);color:#fff;}
.cctd-project-viewer-counter{position:fixed;top:16px;left:14px;padding:5px 12px;border:1px solid rgba(255,255,255,.15);border-radius:99px;background:#050c14;color:#8dbdf0;font-size:12px;font-weight:700;line-height:1.3;}
.cctd-project-viewer-close,.cctd-project-viewer-prev,.cctd-project-viewer-next{position:fixed;display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:0;margin:0!important;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font:28px/1 Arial,sans-serif;letter-spacing:0;box-shadow:none;cursor:pointer;}
.cctd-project-viewer-close{top:14px;right:14px;width:40px;height:40px;}
.cctd-project-viewer-prev,.cctd-project-viewer-next{top:50%;transform:translateY(-50%);}
.cctd-project-viewer-prev{left:12px;}.cctd-project-viewer-next{right:12px;}
.cctd-project-viewer button:hover{background:rgba(255,255,255,.22);color:#fff;box-shadow:none;}
.cctd-project-viewer [hidden]{display:none!important;}
.cctd-project-viewer :focus-visible{outline:3px solid #8dbdf0;outline-offset:3px;}
@media(max-width:991px){
 .cctd-managed-projects .box-text{opacity:1;padding:10px 8px;}
 .cctd-managed-projects .portfolio-box{border-radius:8px;}
 .cctd-managed-projects .portfolio-box-title{font-size:13px;}
}
@media(max-width:600px){
 .cctd-managed-projects>.container{overflow-x:auto;scrollbar-width:none;}
 .cctd-managed-projects .filter-nav{justify-content:flex-start;flex-wrap:nowrap;width:max-content;gap:8px;}
 dialog.cctd-project-viewer{padding:64px 12px 24px;}
 .cctd-project-viewer-image{max-height:calc(100dvh - 310px);}
 .cctd-project-viewer-title{font-size:16px;}
 .cctd-project-viewer-prev,.cctd-project-viewer-next{width:36px;height:36px;top:42%;background:rgba(0,0,0,.55);}
 .cctd-project-viewer-prev{left:6px;}.cctd-project-viewer-next{right:6px;}
 .cctd-project-viewer-actions a{font-size:12px;padding:10px 12px;}
}
