@charset "UTF-8";
/* ===== RESET ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
scroll-behavior: smooth;
overflow-x: hidden;
}

html, body {
margin: 0;
padding: 0;
height: 100%;
font-size: 12px;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-weight: 500;
line-height: 1.4;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: hidden;
overscroll-behavior: none;
}

img, video {
display: block;
max-width: 100%;
height: auto;
object-fit: cover;
}

a, button {
text-decoration: none;
background: none;
border: none;
cursor: pointer;
}

a.disabled { pointer-events: none; cursor: default; }
a {
text-decoration: none !important;
}
a:hover {
text-decoration: none !important;
}

/* ===== SCROLLBAR ===== */
*::-webkit-scrollbar { width: 3px; height: 3px; }
*::-webkit-scrollbar-track { border-radius: 10px; box-shadow: inset 0 0 6px rgba(0,0,0,.3); }
*::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(255,255,255,.3); box-shadow: inset 0 0 6px rgba(0,0,0,.5); }

#page-sidebar {
position: fixed;
top: 0; left: 0;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #1f2937;
z-index: 9999;
will-change: transform;
transform: translateZ(0);
scrollbar-width: none;
-ms-overflow-style: none;
}
#page-sidebar::-webkit-scrollbar { display: none; }
@media (max-width: 768px) {
#page-sidebar { position: relative; width: 100%; height: auto; }
}
.current {
background-color: #23303b !important;
color: #ffffff !important;
}
/* ═══════════════════════════════════════════════
#app-content — SPA main content wrapper
═══════════════════════════════════════════════ */
.main-content.fade-out {
opacity: 0;
pointer-events: none;
transition: opacity 0.25s ease;
}
.main-content.fade-in {
animation: spaFadeIn 0.25s ease forwards;
}
@keyframes spaFadeIn {
from { opacity: 0; transform: translateY(6px); }
to   { opacity: 1; transform: translateY(0);   }
}

.breadcrumb {
align-items: center;
}

.breadcrumb li,
.breadcrumb li a,
.breadcrumb .btn {
display: flex;
align-items: center;
}
/* ===== UTILITIES ===== */
.h-200 { height: 200px; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; }
.height-200 { height: 200px !important; }
.overflow-250 { height: 250px !important; overflow: auto; }
/* ===== AVATAR ===== */
.avatar-upload { position: relative; max-width: 150px; margin: 10px auto; }
.avatar-upload .avatar-edit { position: absolute; right: 12px; z-index: 1; top: 10px; }
.avatar-upload .avatar-edit input { display: none; }
.avatar-upload .avatar-edit input + label {
display: inline-block;
width: 34px; height: 34px;
margin-bottom: 0;
border-radius: 100%;
background: #676666;
border: 1px solid transparent;
box-shadow: 0 2px 4px rgba(0,0,0,.12);
cursor: pointer;
font-weight: normal;
transition: all .2s ease-in-out;
}
.avatar-upload .avatar-edit input + label:after {
content: "\f030";
font-family: 'FontAwesome';
color: #fff;
position: absolute;
top: 8px; left: 0; right: 0;
text-align: center;
margin: auto;
}
.avatar-upload .avatar-preview { width: 125px; height: 125px; position: relative; border-radius: 100%; }
.avatar-upload .avatar-preview > div { width: 100%; height: 100%; border-radius: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; }
.avatar-preview .status-preview { position: absolute; display: block; font-size: 16px; width: 100%; height: 100%; text-align: center; border-radius: 100%; background-color: hsla(0,0%,0%,.4); }
.avatar-preview .photoupload { margin-top: 36%; font-size: 25px; display: block; }
.photoupload { color: #fff !important; }

/* ===== FORMS ===== */
.form-group-password { position: relative; display: block; }
.toggle-password-login{position: absolute; right: 30px; font-size: 15px; top: 12px; opacity: .5; cursor: pointer;}
.toggle-password { position: absolute; right: 10px; font-size: 15px; top: 5px; opacity: .5; cursor: pointer; }
.toggle-password:hover { opacity: 1; }
.input-group .form-control { height: 32px; border: 1px solid #eeebeb; }
.textarea { padding: 5px !important; border: 1px solid #5d6d7e !important; }
.ws-textarea { padding: 5px !important; border: 1px solid #D5D5D5 !important; }
.form-check-input[type="checkbox"] { border-radius: .10em !important; height: 15px !important; width: 15px !important; font-weight: 400 !important; }
input[type="checkbox"].custom-size { appearance: none; -webkit-appearance: none; width: 20px; height: 18px; border: 1px solid green; border-radius: 1px; cursor: pointer; position: relative; text-align: center; }
input[type="checkbox"].custom-size:checked::after { content: "✓"; color: #fff; left: 0; top: 0; border: 0; border-radius: 1px; position: absolute; width: 19px; height: 18px; font-size: 16px; background: green; }
select:focus option:checked { background-color: lightblue; color: #000; }
.check { position: relative !important; float: left !important; }

/* ===== TABLE ===== */
.table-td-img { width: 40px; height: 40px; border-radius: 20px; }
.table-image tr td { vertical-align: middle !important; }
.table-input input { width: 100% !important; background: none !important; border: 0 !important; }
.table-input select { width: 100%; background: none !important; border: 0 !important; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
#table tr td .nav li a { font-size: 12px !important; }

@media (max-width: 620px) {
.table tr td { font-size: 11px !important; }
}
/* ===== SPINNERS / LOADERS ===== */
.spinner, .spinner-modal, .spinner-dropzone {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.spinner { height: 50vh; }
.spinner-modal { height: 30vh; }
.spinner-dropzone { height: 20vh; border: 1px solid #eee; }

#loading {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 50vh;
width: 100%;
}

.loader {
display: inline-block;
width: 50px; height: 50px;
border: 3px solid rgba(25,255,255,.3);
border-radius: 50%;
border-top-color: #fff;
animation: spin 1s ease-in-out infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

.lds-roller { position: relative; display: inline-block; height: 64px; width: 64px; }
.lds-roller div { animation: lds-roller 1.2s cubic-bezier(.5,0,.5,1) infinite; transform-origin: 32px 32px; }
.lds-roller div:after { position: absolute; display: block; background: #00539f; border-radius: 50%; content: " "; margin: -3px 0 0 -3px; height: 6px; width: 6px; }
.lds-roller div:nth-child(1) { animation-delay: -.036s; } .lds-roller div:nth-child(1):after { top: 50px; left: 50px; }
.lds-roller div:nth-child(2) { animation-delay: -.072s; } .lds-roller div:nth-child(2):after { top: 54px; left: 45px; }
.lds-roller div:nth-child(3) { animation-delay: -.108s; } .lds-roller div:nth-child(3):after { top: 57px; left: 39px; }
.lds-roller div:nth-child(4) { animation-delay: -.144s; } .lds-roller div:nth-child(4):after { top: 58px; left: 32px; }
.lds-roller div:nth-child(5) { animation-delay: -.18s;  } .lds-roller div:nth-child(5):after { top: 57px; left: 25px; }
.lds-roller div:nth-child(6) { animation-delay: -.216s; } .lds-roller div:nth-child(6):after { top: 54px; left: 19px; }
.lds-roller div:nth-child(7) { animation-delay: -.252s; } .lds-roller div:nth-child(7):after { top: 50px; left: 14px; }
.lds-roller div:nth-child(8) { animation-delay: -.288s; } .lds-roller div:nth-child(8):after { top: 45px; left: 10px; }
@keyframes lds-roller { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.dots-circle-spinner {
display: inline-block;
height: 1em; width: 1em;
margin-right: 3px;
line-height: 1;
vertical-align: middle;
border-radius: 1em;
transition: all 150ms linear;
transform: scale(0);
opacity: 0;
box-shadow: 2em 0 0 0, 1.414em 1.414em 0 -.4375em, 0 2em 0 -.375em, -1.414em 1.414em 0 -.3125em, -2em 0 0 -.25em, -1.414em -1.414em 0 -.1875em, 0 -2em 0 -.125em, 1.414em -1.414em 0 -.0625em;
}
.dots-circle-spinner.loading {
transform: scale(.25);
opacity: 1;
animation: dots-circle-rotation 1.5s linear 150ms infinite;
}
@keyframes dots-circle-rotation {
0%,100% { box-shadow: 2em 0 0 0, 1.414em 1.414em 0 -.4375em, 0 2em 0 -.375em, -1.414em 1.414em 0 -.3125em, -2em 0 0 -.25em, -1.414em -1.414em 0 -.1875em, 0 -2em 0 -.125em, 1.414em -1.414em 0 -.0625em; }
12.5% { box-shadow: 2em 0 0 -.0625em, 1.414em 1.414em 0 0, 0 2em 0 -.4375em, -1.414em 1.414em 0 -.375em, -2em 0 0 -.3125em, -1.414em -1.414em 0 -.25em, 0 -2em 0 -.1875em, 1.414em -1.414em 0 -.125em; }
25%   { box-shadow: 2em 0 0 -.125em, 1.414em 1.414em 0 -.0625em, 0 2em 0 0, -1.414em 1.414em 0 -.4375em, -2em 0 0 -.375em, -1.414em -1.414em 0 -.3125em, 0 -2em 0 -.25em, 1.414em -1.414em 0 -.1875em; }
37.5% { box-shadow: 2em 0 0 -.1875em, 1.414em 1.414em 0 -.125em, 0 2em 0 -.0625em, -1.414em 1.414em 0 0, -2em 0 0 -.4375em, -1.414em -1.414em 0 -.375em, 0 -2em 0 -.3125em, 1.414em -1.414em 0 -.25em; }
50%   { box-shadow: 2em 0 0 -.25em, 1.414em 1.414em 0 -.1875em, 0 2em 0 -.125em, -1.414em 1.414em 0 -.0625em, -2em 0 0 0, -1.414em -1.414em 0 -.4375em, 0 -2em 0 -.375em, 1.414em -1.414em 0 -.3125em; }
62.5% { box-shadow: 2em 0 0 -.3125em, 1.414em 1.414em 0 -.25em, 0 2em 0 -.1875em, -1.414em 1.414em 0 -.125em, -2em 0 0 -.0625em, -1.414em -1.414em 0 0, 0 -2em 0 -.4375em, 1.414em -1.414em 0 -.375em; }
75%   { box-shadow: 2em 0 0 -.375em, 1.414em 1.414em 0 -.3125em, 0 2em 0 -.25em, -1.414em 1.414em 0 -.1875em, -2em 0 0 -.125em, -1.414em -1.414em 0 -.0625em, 0 -2em 0 0, 1.414em -1.414em 0 -.4375em; }
87.5% { box-shadow: 2em 0 0 -.4375em, 1.414em 1.414em 0 -.375em, 0 2em 0 -.3125em, -1.414em 1.414em 0 -.25em, -2em 0 0 -.1875em, -1.414em -1.414em 0 -.125em, 0 -2em 0 -.0625em, 1.414em -1.414em 0 0; }
}

/* ===== LABELS & LISTS ===== */
.labelcheck { margin-left: 19px; font-size: 12px; display: flex; margin-top: -22px; }
.labelcheckIn { margin-left: 8px; font-size: 12px; color: #333; }
.li-labelcheck { margin-left: 20px; font-size: 12px; display: flex; margin-top: -21px; }
.li-list-group-item { position: relative; display: block; padding: 2px 8px; margin-bottom: -1px; background-color: #fff; border-radius: 0; }

/* ===== SECTION ===== */
.section-padding-10 { float: left; width: 100%; height: 100%; padding-top: 5px; padding-bottom: 20px; }
.section-padding-10 .title { margin-left: 5px; font-weight: 600; }
.radio-material { margin-top: 10px; }

@media (max-width: 600px) {
.panel .panel-body { padding: 0 !important; }
.section-padding-10 { box-shadow: none !important; }
.section-padding-10 .title { font-weight: 400; }
.radio-material { margin-top: 16px; }
}

/* ===== LINES ===== */
.line-margin-bottom-20 { width: 100%; font-size: 12px; padding: 10px 0; border-bottom: 1px solid #a0a3a5; margin: 10px 0 20px; display: block; font-weight: 600; }
.line-margin-bottom-22 { width: 100%; font-size: 14px; padding: 10px 0; border-bottom: 3px solid #a0a3a5; margin: 10px 0 20px; display: block; font-weight: 600; }

/* ===== ALERT ===== */
.alert-dismissible .btn-close { position: absolute; top: 0; right: 0; z-index: 2; padding: 1.1rem 1rem; }

/* ===== PLUGINS ===== */
.ws-plugin { display: inline-block; margin-right: 2px; margin-bottom: 5px; position: relative; }
.ws-plugin label input,
.ws-encryption label input { position: absolute; left: -9999px; }
.ws-plugin label input:checked + span::before,
.ws-encryption label input:checked + span::before { box-shadow: inset 0 0 0 .4375em #00005c; }
.ws-plugin label span,
.ws-encryption label span { display: flex; align-items: center; padding: .375em .75em .375em .375em; border-radius: 99em; transition: .25s ease; }
.ws-plugin label span::before,
.ws-encryption label span::before { display: flex; flex-shrink: 0; content: ""; background-color: #fff; width: 1.5em; height: 1.5em; border-radius: 50%; margin-right: .375em; transition: .25s ease; box-shadow: inset 0 0 0 .125em #00005c; }

/* ===== PLUGIN / TOOLS IMAGES ===== */
.plugin-img, .tools-img {
display: flex; align-items: center; justify-content: center;
background: #D6D3D1; border: 1px solid #D6D3D1;
border-radius: 4px; cursor: pointer; height: 70px;
position: relative; transition: all .2s ease-in-out;
}
.plugin-img img { max-width: 50%; max-height: 40px; transition: all .2s ease-in-out; }
.tools-img img  { max-width: 50%; max-height: 60px; transition: all .2s ease-in-out; }
.plugin-img:hover, .tools-img:hover { border-color: #F5E9E6; background: #F5E9E6; }
.ws-head-fa { padding: 18px 5px; font-size: 16px; }

/* ===== GALLERY ===== */
#gallery { line-height: 0; column-count: 4; column-gap: 2px; }
#gallery img { width: 100% !important; height: auto !important; }
#gallery img:hover { opacity: .7; }
@media (max-width: 1000px) { #gallery { column-count: 3; } }
@media (max-width: 800px)  { #gallery { column-count: 2; } }
@media (max-width: 400px)  { #gallery { column-count: 1; } }

/* ===== IMAGE BOX ===== */
.image-box { position: relative; display: inline-block; overflow: hidden; border-radius: 5px; transition: transform .3s ease; }
.image-box img { width: 100%; height: auto; object-fit: cover; display: block; transition: filter .3s ease; }
.image-box:hover img { filter: brightness(70%) blur(.5px); }
.hover-box { position: absolute; inset: 0; background: rgba(0,0,0,.6); color: #fff; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .3s ease-in-out; pointer-events: none; text-align: center; }
.image-box:hover .hover-box { opacity: 1; pointer-events: all; }
.hover-content { padding: 10px; display: flex; flex-direction: column; gap: 8px; align-items: center; }
.hover-content .image-title { font-size: .9rem; font-weight: 500; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.5); word-break: break-all; }
.hover-actions { display: flex; gap: 5px; }
.hover-actions button { background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.3); color: #fff; border-radius: 2px; padding: 7px 9px; font-size: 12px; cursor: pointer; transition: background .3s ease; }
.hover-actions button:hover      { background: rgba(0,255,128,.4); }
.hover-actions .btn-remove:hover { background: rgba(255,64,64,.5); }
.hover-actions .btn-select:hover { background: rgba(63,145,145,.5); }
.hover-actions .btn-edit:hover   { background: rgba(67,255,100,.85); }

/* ===== TOAST ===== */
/*Change Font in Toast Message */
.toast-success,.toast-info,.toast-warning,.toast-error{
width:310px !important;
font-family: 'Poppins', sans-serif;
font-size:0.95rem;
border-radius:2px !important;
background-color:#edf1fd;
color:#01081e !important;
border-color:transparent !important;
}
/*change close button design customize*/
.closebtn{
width:25px;
height:25px;
border-radius:50%;
font-size:12px;
background-color:#F54927 !important;
}
.closebtn>i{
color:#000617;
font-weight:500;
}
#toast-container>.toast-success {
background-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAKLSURBVHgBzZZNbtpAFMffjMFRQY28hFKpzg1gGZFKWGkqdZX2BHVOUHIC4AQ0J6g5QZVVpDTUqC10V3GDelGqSF3UG1cqgZm+GYIVbPAHoCp/CWY89sxP78289wbgP4tAShW+XugwyeiiP6Xc/VV9PkwzPxao2e+1fHbXBEqOgfEyztDCq5AecN4ZVQ+tuPUigY8H9hvOWHMpZLkc/LWiwEuBwqqcqrUJMBPWk+WN6alrGG4sULpQfWjjqzJsJDL0xsQIQmnws7y6294cJsTLeZW1g6MLwFK/a2JjwvZkFgfd+kogqgFbFuXQ0GxbCwFvrdNhHXHew3+Lz05pUNqD7MQMAYGT17AebTg6eGZMx+PWqhijVDme9zP+KOE1SItCixhVXom+oqp4sld4iHP/EEoLS/3LcsSqrnQVtsFXaFHret9wHvXtBkRvh1b81n3iA6eMrM4kBNw/Y1qZKrSyuEf8TGSUwucPNUwQTYiR4rE9HxgjPb/DGsISytiJRCHYyynNgn2hK5S+gxSaATMZJ/IrDvXip6uXP54e9QjjZ4xSw60YLu5bnCt9/cXKIlr/YGFY/MYmKkm7eBIr18YLRzzIxM7ZW0godL9k3Q2LuLqmKTs70n3ClbKKJBWRcQqLQJiex07kvFYafLRlCCQvWcKYjs+ed3RMPzcq+w6QYqEkLDxgP6uHe/Nn30JHlBEOLdiyRKwGnhdV+nJl4ZVhzTQXkoWH5eTuQCgOszdKXRRP2Fh86OXoaXA0BBSuzWKlFpciWJvFO5gYZKwGX0VeokTJwk1vkKRlS+Zb1hodHK2Mz0T3UlkrRflaVlEkhOMWkHMvT61lVqUGLsIvy+Q22WcyE8fZn2Wee6t/lXrvcWjggekAAAAASUVORK5CYII=')!important;
}

#toast-container>.toast-info {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAJaSURBVHgBvVZNbtNQEJ55idd4hSphKnOCkhM0PQHpCUhuADsWLTgkQuwQJyCcoOEEpSfAnKBW6cK0m6wb+U1nXu04bdLkTRT1kxLnOR5/b/7eNwge2Dn61ybEN4agbRFiBAjlPgFM+HfK1xSJfuXDl7/XvQtXEh1fdvnyiT8xeAEzgKKfD3ZHjz6xlOjDeYzN4IQQXsNGYOLpzUH+9VX28B+zQPbx8i0FwZ/NyQQUI7/j+dFFZ2Er8wt5wKA5gW0CoZt/jn7WyxISRvGsKojt8cGEptNWFd46pEFw6kfG+SE6KBrQ4kW27mmu4FDqoVo7wrIaY/AB2Z6U/3USpZbsey8Troed44vujBDuSt8LSDgrJs63IvwNx4HS1IB46msmObEAfUR8RkTvVDnnVDTZoEPgD5cTgG9svPrUWG7babLZntJowl8Ze5hKv/Gttr817htdg+MIucT/D6NWPnjR4/PzLyhg+Bw2ur6jLrfPj9lKH53QgBI07xVqwnkH43KiACKlcnXVrYRUuOHvTGNUFMYRsj6qD3fRTWMsnfkayA6vv0RpudoHJSQdEtKxtwHvsGZ3LaECb3hsyrEg8zGoCiZMzkMkrV5iJlxVlfa9TCym9W5xLB/wRuE4HGE+iEZ8AKRrbRpl3ibirf1OQJ5esnflnFMLcMICXGxfgN1k12ABTh4IsNxA8NM3FaHoZ1IPU/dOGnGbRfVQexgsJXLvsL2r4e69PC8fEzm8UASikTFsAK7glJrTw3nPVhLOiJ9qEF4gllGfxZPbYE/kbH7UF23kX2fS1D6j/i3BTfaqkKQ1ngAAAABJRU5ErkJggg==')!important;
}
#toast-container>.toast-warning {
background-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAHbSURBVHgBxZZPTsJAFMa/NxDEjYJE1/UGcgOP4BEwARNXeAP0BMSVCzWNJxBPIDfQG8COhSSwJBH7fFNbaKV/ZsA/vwVppzPz5Zt58zHAH0OwZOCisjNHgxWmBYVe9RRTm/FWgiMXzpZHz/LoBE1DUly3EVWwoOSpTkRM43hzXMACY4eBu0HCp6m4PDR1aeywzOSmfKrYuDQSHN9LkTCOFw3Mr/I7DF9JUXt0E1vqzQQVqBN5ne41UdfFop+DtkqppDpmc+Wg3SFeKL5IsGeLfSNw4+02sgrrCn5zl0mhkN83U3DiqjZgtjc+ss95LlMF9TFgj63OmCbPZapgGZbuQsRlsO/mguu6W05KnYlkbvK3BIII24TUyFsR1O50iWNDdBgkuVwR/AF3IYmRFwtvXdIF5f/9ZOGH9UwmlDB/0RPn9Y0Ge8yhiLnIp8IiZCDm9/U81Y02LBzqUpbqMhG0Zv7B9YMz6MBfOrSJMDkyV8z8YNq/WKTuUgeJAZ2hxk+1Fi5rTTSIuWc2Zhl5Sh8DG3dQtLuYh+jIdFgYeTS+w4kieoQdQ3wVTF7RxNhmdopSNlaDAhyswexd8kDfLRG5LvwWUmTX1XO5VoYNemmJYbwnNnhAf7+FPv6DT2e/n0VFnPgUAAAAAElFTkSuQmCC')!important;
}
#toast-container>.toast-error {
background-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAIlSURBVHgB3VbBbtNAEH2zTugFFIPgwAlzA4mK8AdrvgC+APiSKl/S9AvoH8SfEEQP3PCNAwjcA6IQeYcdYxtvbK/jNr30SVG86519npk3swvcdNCuC7880dF0Ck1QzxVMKHMGKmOYD5sNkoefknSXfQYJvz7TekJ0xIAe2CjJwSf3PybLgXXd+BzpcHZHHQP8CiPAoOWfjVn0edxJKOE7mNLKPka4HNLfG467SOkayGpSCvjF3XWSNSfV9qpbU3W0BzJBxLmkxIXj4bdD/VaBjrFH5Mzxg7MkqcaOhwHwBuOR+V4GVuHNcU0oubMK032GNh+P5Wdjsq4nGet6vh/619OXj1qEUtQeI/EiswJISXFckArZhGMRxcUFvPhJJm4REmPusQnZ0OrHXIdCIKQVmdTrwYTee2xBStV7T/7PIvQZWY/mJWlcSb1oDrdtCZH3Y6HIzOpnjIFxh2E4eofGcvarrZkz8awZXkdIXd/J6rxFyH6jzJK9rsgkjNs5hac8mMy6RRgESDyEECU6OStzKuVk30lwezXQ3NvpNN8Pte2h/bVYeuEX1zYYyb2zVbssBDljMWA+jszCEJ80xw7hv57Hp9gTCLzcPpBboqYA7+xfiqsjtc25FbEWYaG6oFBdiiuQyR7SCgcJS9LCgOHGfxfYMJ6WB2/a/X4AxRnJ9tgir3oLNdpL1KJ59l2KsIIt8ijP7TWRixqcldbn0jDGXBNvPv4C3QjuTqveJGAAAAAASUVORK5CYII=')!important;
}

/* ===== MISC ===== */
.img-cover { width: 100%; height: 15vh; background-size: cover; background-position: center; background-repeat: no-repeat; background-attachment: fixed; }
.note-toolbar { display: flex; justify-content: center; flex-wrap: wrap; }
/* Container */
.fancybox-share.fancybox-content {
max-width: 600px;
width: 90%;
padding: 30px 25px;
border-radius: 10px;
text-align: center;
background: #fff;
box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

/* Title */
.fancybox-share h1 {
font-size: 28px;
margin-bottom: 25px;
font-weight: 600;
}

/* Buttons wrapper */
.fancybox-share p:first-of-type {
display: flex;
gap: 15px;
justify-content: space-between;
margin-bottom: 25px;
}

/* Buttons */
.fancybox-share__button {
flex: 1;
padding: 15px;
border-radius: 6px;
color: #fff;
text-decoration: none;
font-weight: 600;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
transition: 0.3s;
}

/* Icons */
.fancybox-share__button svg {
width: 24px;
height: 24px;
margin-bottom: 8px;
fill: #fff;
}

/* Hover */
.fancybox-share__button:hover {
opacity: 0.9;
}

/* Social colors */
.fancybox-share__button--fb {
background: #3b5998;
}

.fancybox-share__button--tw {
background: #1da1f2;
}

.fancybox-share__button--pt {
background: #e60023;
}

/* Input field */
.fancybox-share__input {
width: 100%;
padding: 12px;
border: none;
border-bottom: 1px solid #ccc;
font-size: 14px;
text-align: center;
outline: none;
}

/* Close button */
.fancybox-close-small {
position: absolute;
top: 15px;
right: 15px;
background: transparent;
}

.fancybox-close-small svg {
width: 20px;
height: 20px;
fill: #999;
}
.list-group-contacts .list-group-item .list-group-item-img{
border: 1px solid #F5F5F5;
/* all browser support */
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
width: 60px;
height: 60px; /* keep perfect circle */
margin-right: 10px;
object-fit: cover; /* image fit */
display: block;
}
/* Hide Summernote default image modal */
.note-modal-backdrop {
display: none !important;
}
/* Modal Overlay */
/* Remove Custom Modal Styles */
.remove-custom-modal-overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 9999;
justify-content: center;
align-items: center;
}
.remove-custom-modal-overlay.active,
.remove-custom-modal-overlay[style*="block"] {
display: flex !important;
}
.remove-custom-modal-box {
background: #fff;
border-radius: 10px;
padding: 30px 25px;
max-width: 380px;
width: 90%;
text-align: center;
box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}
.remove-custom-modal-box h3 {
margin: 0 0 10px;
font-size: 1.2rem;
color: #333;
}
.remove-custom-modal-box p {
margin: 0 0 20px;
color: #666;
font-size: 0.95rem;
}

.remove-custom-modal-btns {
display: flex;
gap: 10px;
justify-content: center;
}
.remove-custom-modal-btns button {
padding: 9px 24px;
border: none;
border-radius: 6px;
font-size: 0.9rem;
cursor: pointer;
transition: opacity 0.2s;
}
.remove-custom-modal-btns button:hover {
opacity: 0.85;
}
#remove-cancelBtn {
background: #e0e0e0;
color: #333;
}

#remove-confirmBtn {
background: #e53935;
color: #fff;
}
/* Update Custom Modal Styles */
.update-custom-modal-overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 9999;
justify-content: center;
align-items: center;
}
.update-custom-modal-overlay.active,
.update-custom-modal-overlay[style*="block"] {
display: flex !important;
}
.update-custom-modal-box {
background: #fff;
border-radius: 10px;
padding: 30px 25px;
max-width: 380px;
width: 90%;
text-align: center;
box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}
.update-custom-modal-box h3 {
margin: 0 0 10px;
font-size: 1.2rem;
color: #333;
}
.update-custom-modal-box p {
margin: 0 0 20px;
color: #666;
font-size: 0.95rem;
}
.update-custom-modal-btns {
display: flex;
gap: 10px;
justify-content: center;
}
.update-custom-modal-btns button {
padding: 9px 24px;
border: none;
border-radius: 6px;
font-size: 0.9rem;
cursor: pointer;
transition: opacity 0.2s;
}
.update-custom-modal-btns button:hover {
opacity: 0.85;
}
#update-cancelBtn {
background: #e0e0e0;
color: #333;
}
#update-confirmBtn {
background: #76BA57;
color: #fff;
}