/* Import required CSS */

.navbar {
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
}

body {
    background-color: transparent;
}

/* Auth pages: top navbar hide/show on scroll */
.header-navbar.fixed-top.zamic-autohide-nav {
    transition: width 0.22s ease-in-out, transform 0.22s ease-in-out;
    will-change: width;
}

/* Keep the navbar layout aligned with overlay/collapsed behavior before menu JS finishes booting. */
@media (max-width: 991.98px) {
    body.vertical-layout.vertical-menu .navbar .navbar-container {
        margin-left: 60px !important;
    }
}

@media (max-width: 767.98px) {
    body.vertical-layout.vertical-menu .navbar .navbar-container {
        margin-left: 0 !important;
    }
}

.header-navbar.fixed-top.zamic-autohide-nav.zamic-nav-hidden .navbar-container {
    display: none;
}

.header-navbar.fixed-top.zamic-autohide-nav.zamic-nav-hidden {
    width: 240px;
    box-shadow: none;
}

/* Keep hidden header width aligned when left menu is collapsed */
body.vertical-layout.vertical-menu.menu-collapsed .header-navbar.fixed-top.zamic-autohide-nav.zamic-nav-hidden {
    width: 60px;
}

@media (max-width: 767.98px) {
    .header-navbar.fixed-top.zamic-autohide-nav.zamic-nav-hidden {
        width: 100%;
    }
}

/* On phone-sized views, hide the whole top menu while scrolling down */
@media (max-width: 767.98px) {
    .header-navbar.fixed-top.zamic-autohide-nav.zamic-nav-hidden {
        width: 100% !important;
        transform: translateY(-100%);
    }
}

@media (min-width: 992px) {
    #sidebar-right {
        display: block !important;
        width: 300px;
        max-width: 300px;
        opacity: 1;
        transform: translateX(0);
        transform-origin: top right;
        overflow: hidden;
        pointer-events: auto;
    }

    #sidebar-right.zamic-right-sidebar-ready {
        transition: width 0.22s ease, max-width 0.22s ease, transform 0.22s ease, opacity 0.22s ease;
    }

    #sidebar-right.zamic-right-sidebar-compact {
        width: 0;
        max-width: 0;
        opacity: 0;
        transform: translateX(24px);
        pointer-events: none;
    }
}

#right-sidebar-toggle {
    position: relative;
}

#right-sidebar-toggle .zamic-right-sidebar-lock-indicator {
    position: absolute;
    right: 0.95rem;
    bottom: 0.45rem;
    font-size: 0.65rem;
    line-height: 1;
    color: currentColor;
    display: none;
    opacity: 0.95;
}

#right-sidebar-toggle.zamic-right-sidebar-pinned .zamic-right-sidebar-lock-indicator {
    display: block;
}

/* Add some padding to row */
.row {
    padding: 4px 0px;
}

/* Default all images to have a 0.21rem border. 
   Set max width and height no larger than image size. 
   Reset hight as we want to ignore any user input on this to keep image dimentions 
*/
img {
    border-radius: 0.21rem;
    max-width: 100%;
    max-height: 100%;
    height: unset;
}

/* Default faded hr styles */
hr {
	border-top: 1px solid #dcdbdb;
}
hr.style1 {
	border-top: 1px dashed #dcdbdb;
	border-bottom: 1px dashed #fff;
        margin: 3px; 
}

/* Header Content Buttons */
/* Button Colors */
.btn-primary {
	background-color: #55595c !important;
	border-color: #55595c !important;
        margin-right: 4px;
}
.btn-primary:active {
	background-color: #55595c !important;
	border-color: #55595c !important;
}
.btn-primary:focus{
	background-color: #45494c !important;
	border-color: #45494c !important;
}
.btn-primary:hover{
	background-color: #45494c !important;
	border-color: #45494c !important;
}

/* Page margins override */
.form-group {
    margin-bottom: 0.1rem;
}
form .form-group {
    margin-bottom: 0.1rem;
}

/* Table Padding */
.table tbody{
    padding: 0.5rem 0.5rem;
}
.table th, .table td {
    padding: 0.5rem 0.5rem;
    border-top: 0px;
}

/* Tabs Colors */
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    border-color: #ddd #ddd #f1f1f1;
}
.nav-tabs {
    border-bottom: 1px solid #ddd;
}

/* Link Colours */
html body a {
    color: #337ab7;
}

/* Nav Panels */
.panel-round_temp>.panel-heading {
    color: #333;
    background-color: #f5f5f5;

    border-radius: 30px;
    border: 1px solid #ddd;
 }
 
  
/* Widget Panel */
.panel-default>.panel-heading {
    color: #333;
    background-color: #f5f5f5;

    border: 1px solid #ddd;
 }
.btn-round {
    border-radius: 30px;
    background-color: #ffffff;
    border: 1px solid #ddd;
}
/* Widget Panel - Menu */
 .dropdown-menu {
     padding: 10px 10px;
}
/* Menu Divider/Separator */
.divider {
    border-top: 1px solid #d4d4d4;
}

/* Shared page toolbar styling */
.zamic-toolbar {
    border: 1px solid #e3e8ee;
    border-radius: 0.65rem;
    padding: 0.28rem 0.4rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 4px 14px rgba(17, 24, 39, 0.06);
    overflow: visible;
}

.zamic-toolbar .navbar-nav {
    flex-wrap: wrap;
    gap: 0.25rem 0.4rem;
}

.zamic-toolbar .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid transparent;
    background: transparent;
    color: #2d3a4a;
    border-radius: 0.35rem;
    padding-left: 0.7rem;
    padding-right: 0.7rem;
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
    line-height: 1.2;
    font-weight: 500;
    transition: background-color 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;
}

.zamic-toolbar .nav-link:hover,
.zamic-toolbar .nav-link:focus {
    background-color: #e6ebf1;
    color: #1f2937;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.03);
}

.zamic-toolbar .nav-link:active,
.zamic-toolbar .show > .nav-link.dropdown-toggle {
    background-color: #d6dde6;
    color: #111827;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06);
}

.zamic-toolbar .dropdown-menu {
    min-width: 12rem;
    padding: 0.4rem;
    border: 1px solid #dde3ea;
    border-radius: 0.6rem;
    box-shadow: 0 10px 24px rgba(17, 24, 39, 0.14);
}

.zamic-toolbar .dropdown-item {
    border-radius: 0.45rem;
    padding: 0.38rem 0.55rem;
    color: #2d3a4a;
}

.zamic-toolbar .dropdown-item:hover,
.zamic-toolbar .dropdown-item:focus {
    background-color: #eff5fb;
    color: #1f2937;
}

.zamic-toolbar .dropdown-item:active,
.zamic-toolbar .dropdown-item.active {
    background-color: #d6dde6;
    color: #111827;
}

.zamic-toolbar .dropdown-item .fa-check-square {
    color: #1f6feb;
}

/* Keep toolbar dropdown arrows inline and vertically centered beside text */
.zamic-toolbar .dropdown-toggle::after,
.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown > .btn.btn-default.dropdown-toggle::after {
    position: static !important;
    top: auto !important;
    right: auto !important;
    display: inline-block;
    width: auto;
    height: auto;
    margin: 0 0 0 0.3rem;
    padding: 0;
    vertical-align: middle;
    line-height: 1;
}

/* Widget (lobipanel) heading aligned with the auth toolbar visual style */
.zwidget-toolbar.panel-default > .panel-heading {
    border: 1px solid #e3e8ee;
    border-radius: 0.65rem;
    padding: 0.38rem 0.45rem;
    margin-bottom: 0.45rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 4px 14px rgba(17, 24, 39, 0.06);
    color: #2d3a4a;
}

.zwidget-toolbar .widget-drag-handle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: 2rem;
    padding: 0 0.4rem;
    line-height: 1;
    margin-right: 0.35rem;
    border-radius: 0;
    color: #4b5a6b;
    cursor: grab;
    user-select: none;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.zwidget-toolbar .widget-drag-handle i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-size: 0.95rem;
    position: relative;
    top: 0;
}

.zwidget-toolbar .widget-drag-handle:hover,
.zwidget-toolbar .widget-drag-handle:focus {
    color: #1f2937;
}

.zwidget-toolbar .widget-drag-handle:active {
    cursor: grabbing;
    color: #111827;
}

.zwidget-toolbar.panel-default > .panel-heading .btn.btn-default,
.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown > .btn.btn-default {
    border: 1px solid transparent;
    background: transparent;
    color: #2d3a4a;
    border-radius: 0.35rem;
    box-shadow: none;
    padding: 0.35rem 0.58rem;
    min-height: 2rem;
}

/* Keep icon-only widget controls rendered with Font Awesome classes */
.zwidget-toolbar.panel-default > .panel-heading .btn.btn-default.far,
.zwidget-toolbar.panel-default > .panel-heading .btn.btn-default.fas,
.zwidget-toolbar.panel-default > .panel-heading .btn.btn-default.fab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    font-size: 0.95rem;
    line-height: 1;
    font-weight: 400;
}

/* Typography override only for the textual Menu trigger */
.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown > .btn.btn-default.dropdown-toggle {
    display: inline-flex;
    align-items: center;
    font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1;
    height: 2rem;
    padding: 0.35rem 0.7rem;
}

.zwidget-toolbar.panel-default > .panel-heading .btn.btn-default:hover,
.zwidget-toolbar.panel-default > .panel-heading .btn.btn-default:focus,
.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown > .btn.btn-default:hover,
.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown > .btn.btn-default:focus {
    background-color: #e6ebf1;
    color: #1f2937;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.03);
}

.zwidget-toolbar.panel-default > .panel-heading .btn.btn-default:active,
.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown.open > .btn.btn-default {
    background-color: #d6dde6;
    color: #111827;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06);
}

.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown > .btn.btn-default.dropdown-toggle::after {
    font-size: 0.95rem;
    margin-left: 0.3rem;
    margin-right: 0;
    padding: 0;
}

.zwidget-toolbar.panel-default > .panel-heading .panel-title {
    color: #223041;
    font-size: 1rem;
    font-weight: 500;
    line-height: 2rem;
    margin-left: 0.2rem;
}

.zwidget-toolbar.panel-default > .panel-heading .panel-title input {
    background-color: #e6ebf1;
    border: 1px solid transparent;
    border-radius: 0.35rem;
    color: #1f2937;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.4;
    min-height: 2rem;
    padding: 0.28rem 0.5rem;
}

.zwidget-toolbar.panel-default > .panel-heading .panel-title input:active {
    background-color: #d6dde6;
    border-color: #c7d1de;
}

.zwidget-toolbar.panel-default > .panel-heading .panel-title input:focus {
    background-color: #e6ebf1;
    border-color: #cfd8e3;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.03);
    outline: none;
}

.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown .dropdown-menu {
    min-width: 12rem;
    padding: 0.4rem;
    border: 1px solid #dde3ea;
    border-radius: 0.6rem;
    box-shadow: 0 10px 24px rgba(17, 24, 39, 0.14);
}

.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown .dropdown-menu > li > a {
    border-radius: 0.45rem;
    color: #2d3a4a;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.3;
    padding: 0.42rem 0.58rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown .dropdown-menu > li {
    line-height: 1.3;
}

.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown .dropdown-menu > li > a:hover,
.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown .dropdown-menu > li > a:focus {
    background-color: #eff5fb;
    color: #1f2937;
}

.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown .dropdown-menu > li > a:active {
    background-color: #d6dde6;
    color: #111827;
}

.zwidget-toolbar.panel-default > .panel-heading .widgetdropdown .dropdown-menu > li > a i {
    min-width: 1.1rem;
}

/* Section headings used under list toolbars (pages/groups/sites/pins) */
.zamic-section-heading {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: 0.35rem;
    margin-bottom: 0.55rem;
    color: #223041;
    font-size: 1.42rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.2;
}

.zamic-section-heading i {
    color: #5e6b7a;
    font-size: 1.25rem;
}

.zamic-section-headrow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.zamic-section-headrow .zamic-section-heading {
    margin-bottom: 0;
}

.zamic-section-headrow--stacked {
    align-items: center;
    flex-direction: row;
    gap: 0.75rem;
}

.zamic-section-filter-wrap {
    position: relative;
    margin-left: auto;
    min-width: 220px;
    width: auto;
    max-width: 330px;
}

.zamic-section-filter {
    height: 2rem;
    border-radius: 0.4rem;
    border: 1px solid #d7dee7;
    font-size: 0.95rem;
    color: #2d3a4a;
    padding: 0.25rem 1.95rem 0.25rem 0.65rem;
}

.zamic-section-filter:focus {
    border-color: #bcc8d7;
    box-shadow: 0 0 0 0.12rem rgba(59, 175, 218, 0.12);
}

.zamic-filter-empty {
    margin: 0.5rem 0 0.15rem;
    color: #6a7787;
    font-size: 0.92rem;
}

.zamic-section-filter-wrap::after {
    content: '\f110';
    font-family: "Font Awesome 5 Pro";
    font-weight: 400;
    font-size: 0.88rem;
    color: #6f7e90;
    position: absolute;
    right: 0.62rem;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    pointer-events: none;
}

.zamic-section-filter-wrap.is-loading::after {
    opacity: 1;
    animation: zamic-spin 0.85s linear infinite;
}

@keyframes zamic-spin {
    from { transform: translateY(-50%) rotate(0deg); }
    to { transform: translateY(-50%) rotate(360deg); }
}

@media (max-width: 767.98px) {
    .zamic-toolbar .nav-link {
        padding-left: 0.62rem;
        padding-right: 0.62rem;
        font-size: 0.92rem;
    }

    .zamic-section-heading {
        font-size: 1.2rem;
        gap: 0.45rem;
    }

    .zamic-section-heading i {
        font-size: 1.05rem;
    }

    .zamic-section-filter-wrap {
        max-width: 100%;
        min-width: 0;
        width: 100%;
        margin-left: 0;
    }

    .zamic-section-headrow--stacked {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.42rem;
    }
}

/* Resizable panels for widgets */
.panel-resizable {
    resize: vertical;
    overflow: auto;
}

/* Zamic Logo location */
.header-navbar.navbar-brand-center .navbar-header {
    position: relative;
}

/* Modal Colors - overrides bootstrap*/
.bootstrap-dialog.type-primary .modal-header {
  background-color: #55595c !important;
}

/* Allow the bootstrap dialog to go full screen */
.fullscreen-dialog .modal-dialog {
      width: 100vw !important;  /* Full viewport width */
      height: 100vh !important; /* Full viewport height */
      margin: 0 !important;
      padding: 10px !important;
      max-width: none !important;  /* Ensure no max-width restriction */
 }

/* Keep dialogs above fullscreen lobipanel widgets (lobipanel uses z-index ~10000) */
.modal-backdrop {
    z-index: 20030 !important;
}

.modal,
.bootstrap-dialog {
    z-index: 20040 !important;
}

.ui-dialog,
.ui-widget-overlay {
    z-index: 20050 !important;
}

.switchery>.element.style {
    background-color: #ffffff;
}

/* Page Padding & Color Sets */
html body .content .content-wrapper {
    padding: 0.5em 0.5em !important;
}
.card-body {
    padding: 0.5em 0.5em !important;
}
.card-header {
    background-color: #f5f5f5;
    padding: 0.05em;
}
.x_panel {
    padding: 0.5em 0.5em !important;
}
.btn.btn-app {
  margin: 0 0 0.15em 0.15em;
}
.zwidget-panel {
    padding-right: 0.15em !important;
    padding-left: 0.15em !important;    
}
/* Card Header Color Sets - e.g. accordian */
.btn-link {
    font-weight: 400;
    color: #55595c;
    background-color: transparent;
}
.btn-link:hover {
    font-weight: 500;
    color: #55595c;
}


/* Contact Search Title Sizes */
.select2-container--classic .select2-result-repository .select2-result-repository__meta .select2-result-repository__title,
.select2-container--default .select2-result-repository .select2-result-repository__meta .select2-result-repository__title {
    font-size: 1.00rem;
    font-weight: 700;
    text-transform: capitalize;
}


/* Max Datafeed Image Sizes */
.card-img-left {
    max-width: 150px;
}

/* Sharing Image Sizes */
.sharing-img-preview {
    border-radius: 3px;
    max-width: 70px;
}

/****** Panel *****************/
.x_panel {
  position: relative;
  width: 100%;
  margin-bottom: 10px;
  margin-top: 10px;
  padding: 10px 17px;
  display: inline-block;
  background: #fff;
  border: 1px solid #E6E9ED;
  -webkit-column-break-inside: avoid;
  -moz-column-break-inside: avoid;
  column-break-inside: avoid;
  opacity: 1;
  transition: all .2s ease; }

  
.panel_toolbox {
  float: right;
  min-width: 70px; }

.panel_toolbox > li {
  float: left;
  cursor: pointer; }

.panel_toolbox > li > a {
  padding: 5px;
  color: #C5C7CB;
  font-size: 14px; }

.panel_toolbox > li > a:hover {
  background: #F5F7FA; }
  
/****** / Panel ***************/

/***** File Upload **********/
.fake-shadow {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.fileUpload {
    position: relative;
    overflow: hidden;
}
.fileUpload #image-upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 33px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}
.img-preview {
	max-width: 75%;    
}
/***** / File Upload **********/



/* Widget Buttons */
.btn.btn-app {
  position: relative;
  padding: 15px 5px;
/*  margin: 0 0 10px 10px; */
  min-width: 80px;
  height: 60px;
  box-shadow: none;
  border-radius: 0;
  text-align: center;
  color: #666;
  border: 1px solid #ddd;
  background-color: #fafafa;
  font-size: 12px; 
}
/* Widget Buttonbar Overflow, enable scrollbar */
.btn-toolbar-widgets {
    padding-top: 3px;
    padding-bottom: 3px;
}
.btn-group-widgets {
    white-space: nowrap;
    overflow-x: auto;
}

/* Modern widget picker (edit page -> Widgets tab) */
.widget-picker {
    border: 1px solid #e3e8ee;
    border-radius: 0.7rem;
    padding: 0.45rem;
    margin-bottom: 0.55rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 4px 14px rgba(17, 24, 39, 0.06);
}

/* Space between widget selector toolbar and first widget panel */
#lobipanel-multiple {
    margin-top: 0.4rem;
}

.widget-picker-tabs {
    border-bottom: 1px solid #e3e8ee;
    margin-bottom: 0.5rem;
    padding-bottom: 0.35rem;
    gap: 0.25rem;
}

.widget-picker-tabs .nav-item {
    margin-bottom: 0;
}

.widget-picker-tabs .nav-link {
    border: 1px solid transparent;
    border-radius: 0.45rem;
    color: #4a5869;
    font-weight: 600;
    line-height: 1.2;
    padding: 0.42rem 0.7rem;
}

.widget-picker-tabs .nav-link:hover,
.widget-picker-tabs .nav-link:focus {
    background-color: #e6ebf1;
    color: #1f2937;
}

.widget-picker-tabs .nav-link.active {
    background-color: #d6dde6;
    border-color: transparent;
    color: #111827;
}

.widget-picker-content {
    margin-top: 0.1rem;
}

.widget-picker-grid {
    margin: 0;
    padding: 0.15rem 0.1rem 0.2rem;
    border: 0;
    background: transparent;
    box-shadow: none;
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 0.35rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

.widget-picker-grid::-webkit-scrollbar {
    height: 8px;
}

.widget-picker-grid::-webkit-scrollbar-track {
    background: #eef2f7;
    border-radius: 999px;
}

.widget-picker-grid::-webkit-scrollbar-thumb {
    background: #c8d1dd;
    border-radius: 999px;
}

.widget-picker-scroller {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    position: relative;
}

.widget-picker-scroller::before,
.widget-picker-scroller::after {
    content: "";
    position: absolute;
    top: 0.2rem;
    bottom: 0.2rem;
    width: 18px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.14s ease;
    z-index: 2;
}

.widget-picker-scroller::before {
    left: 2.05rem;
    background: linear-gradient(90deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
}

.widget-picker-scroller::after {
    right: 2.05rem;
    background: linear-gradient(270deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
}

.widget-picker-scroller.has-left::before {
    opacity: 1;
}

.widget-picker-scroller.has-right::after {
    opacity: 1;
}

.widget-picker-arrow {
    width: 1.9rem;
    height: 1.9rem;
    min-width: 1.9rem;
    border: 1px solid transparent;
    border-radius: 0.4rem;
    background: transparent;
    color: #4b5a6b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.12s ease, color 0.12s ease, box-shadow 0.12s ease, opacity 0.12s ease;
}

.widget-picker-arrow:hover,
.widget-picker-arrow:focus {
    background-color: #e6ebf1;
    color: #1f2937;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.03);
    outline: none;
}

.widget-picker-arrow:active {
    background-color: #d6dde6;
    color: #111827;
}

.widget-picker-arrow.is-disabled {
    opacity: 0.35;
    cursor: default;
    pointer-events: none;
}

.widget-picker-btn.btn.btn-app {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    min-width: 96px;
    height: 72px;
    margin: 0;
    padding: 0.5rem 0.55rem;
    border-radius: 0.55rem;
    border: 1px solid #dbe2ea;
    background: #ffffff;
    color: #334155;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.15;
    text-decoration: none;
    transition: background-color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease, transform 0.12s ease, color 0.12s ease;
    flex: 0 0 auto;
}

.widget-picker-btn.btn.btn-app:hover,
.widget-picker-btn.btn.btn-app:focus {
    background: #f8fafc;
    border-color: #cfd8e3;
    color: #1f2937;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.10);
    transform: translateY(-1px);
}

.widget-picker-btn.btn.btn-app:active {
    background: #e6ebf1;
    border-color: #c3cedb;
    color: #111827;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.04);
    transform: translateY(0);
}

.widget-picker-btn.btn.btn-app span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 1.5rem;
}

.widget-picker-btn.btn.btn-app i {
    color: #5f6b7a;
    font-size: 1.6rem;
    line-height: 1;
}

.widget-picker-sep {
    display: inline-block;
    width: 1px;
    height: 2.4rem;
    margin: 0 0.12rem;
    align-self: center;
    background: linear-gradient(180deg, rgba(195, 206, 219, 0.25) 0%, rgba(195, 206, 219, 0.95) 50%, rgba(195, 206, 219, 0.25) 100%);
}

@media (max-width: 767.98px) {
    .widget-picker {
        padding: 0.38rem;
    }

    .widget-picker-tabs .nav-link {
        font-size: 0.92rem;
        padding: 0.4rem 0.58rem;
    }

    .widget-picker-grid {
        gap: 0.32rem;
    }

    .widget-picker-btn.btn.btn-app {
        min-width: 86px;
        height: 66px;
        font-size: 0.78rem;
    }

    .widget-picker-btn.btn.btn-app i {
        font-size: 1.47rem;
    }

    .widget-picker-arrow {
        width: 1.7rem;
        height: 1.7rem;
        min-width: 1.7rem;
    }
}
 

/* *********  form tags input  **************************** */

span.tag {
  background: #e4e4e4 !important;
  color: #43576C !important;
  border: 1px solid #AAA !important;
 }

span.tag a {
  color: #43576C !important; }


/* *********  /form tags input  **************************** */

/* Dashboard Top Tile Items */
.tile_count {
  margin-bottom: 20px;
  margin-top: 20px; }

.tile_count .tile_stats_count {
  border-bottom: 1px solid #D9DEE4;
  padding: 0 10px 0 20px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  position: relative; 
}
@media (min-width: 992px) {
  .tile_count .tile_stats_count {
    margin-bottom: 10px;
    border-bottom: 0;
    padding-bottom: 10px; } 
}
.tile_count .tile_stats_count:before {
  content: "";
  position: absolute;
  left: 0;
  height: 65px;
  border-left: 2px solid #ADB2B5;
  margin-top: 10px; 
}
@media (min-width: 992px) {
  .tile_count .tile_stats_count:first-child:before {
    border-left: 0; } }
.tile_count .tile_stats_count .count {
  font-size: 30px;
  line-height: 47px;
  font-weight: 600; 
}
@media (min-width: 768px) {
  .tile_count .tile_stats_count .count {
    font-size: 40px; } 
}
@media (min-width: 992px) and (max-width: 1100px) {
  .tile_count .tile_stats_count .count {
    font-size: 30px; } }
.tile_count .tile_stats_count span {
  font-size: 12px; 
}
@media (min-width: 768px) {
  .tile_count .tile_stats_count span {
    font-size: 13px; } 
}
.tile_count .tile_stats_count .count_bottom i {
  width: 12px; 
}


/* Jumbotron colour */
.jumbotron {
    background-color: transparent;
}

.card {
    border: 1px solid rgba(0, 0, 0, .06);   
}


/* Content Block - Article */
pre {
  overflow: auto;
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
pre {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.42857143;
  color: #333;
  word-break: break-all;
  word-wrap: break-word;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 4px;
}
pre code {
  padding: 0;
  font-size: inherit;
  color: inherit;
  white-space: pre-wrap;
  background-color: transparent;
  border-radius: 0;
}


/* Summernote Editor formatting */
img.note-float-left {
    margin-right: 10px;
}
img.note-float-right {
    margin-left: 10px;
}


/* TinyMCE - Disable source box
.tox-dialog .tox-dialog__content-js .tox-dialog__body .tox-form__controls-h-stack input[type=url].tox-textfield {
    display: block;
}
.tox-dialog .tox-dialog__content-js .tox-dialog__body div.tox-form__group:first-child label {
    display: block;
}
.tox-dialog .tox-dialog__content-js .tox-dialog__body .tox-form__controls-h-stack div.tox-form__group:first-child label {
    display: block;
}
*/


/* Retractable Right Sidebar - hide/show */
.header-navbar .navbar-container ul.nav li a.menu-toggle-right i {
    font-size: 1.6rem;
}

.header-navbar .navbar-container ul.nav li a.menu-toggle-right {
    padding: 1.4rem 1rem;
}

/* Datafeed More menu - stacked Group Pin icon */
.zdf-gpin-icon {
    position: relative;
    display: inline-block;
    width: 1.1em;
    height: 1.1em;
    vertical-align: -0.08em;
    margin-right: 0.18em;
}

.zdf-gpin-folder {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%);
    transform: translate(-50%, -50%);
    font-size: 0.98em;
    line-height: 1;
}

.zdf-gpin-pin {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.98em;
    line-height: 1;
}

/* Datafeed actions - consistent icon/text spacing */
.zdf-iconlink {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.zdf-more-item a {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.zdf-more-item > .zdf-action-disabled {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

/* Normalize stacked Group Pin icon spacing inside More menu items */
.zdf-more-item a .zdf-gpin-icon,
.zdf-more-item > .zdf-action-disabled .zdf-gpin-icon {
    width: 1em;
    flex: 0 0 1em;
    margin-right: 0;
}

.zdf-more-wrap {
    position: relative;
    display: inline-block;
}

.zdf-more-menu {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    min-width: 170px;
    margin: 4px 0 0;
    padding: 6px 0;
    background: #fff;
    border: 1px solid #ddd;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
    z-index: 1000;
}

.zdf-more-item {
    list-style: none;
    margin: 0;
    padding: 4px 10px;
    white-space: nowrap;
}

.zdf-more-divider {
    list-style: none;
    margin: 4px 0;
    padding: 0;
}

.zdf-more-divider hr {
    margin: 0;
    border: 0;
    border-top: 1px solid #e2e2e2;
}

.zdf-more-item a > .far,
.zdf-more-item a > .fas,
.zdf-more-item a > .fab,
.zdf-more-item a > div.far,
.zdf-more-item a > div.fas,
.zdf-more-item a > div.fab,
.zdf-more-item > .zdf-action-disabled > .far,
.zdf-more-item > .zdf-action-disabled > .fas,
.zdf-more-item > .zdf-action-disabled > .fab,
.zdf-more-item > .zdf-action-disabled > i.far,
.zdf-more-item > .zdf-action-disabled > i.fas,
.zdf-more-item > .zdf-action-disabled > i.fab,
.zdf-iconlink > .far,
.zdf-iconlink > .fas,
.zdf-iconlink > .fab,
.zdf-iconlink > div.far,
.zdf-iconlink > div.fas,
.zdf-iconlink > div.fab {
    width: 1em;
    text-align: center;
    flex: 0 0 1em;
}

/* Hard spacing fallback for dropdown items */
.zdf-more-item a > .far,
.zdf-more-item a > .fas,
.zdf-more-item a > .fab,
.zdf-more-item a > div.far,
.zdf-more-item a > div.fas,
.zdf-more-item a > div.fab,
.zdf-more-item > .zdf-action-disabled > .far,
.zdf-more-item > .zdf-action-disabled > .fas,
.zdf-more-item > .zdf-action-disabled > .fab,
.zdf-more-item > .zdf-action-disabled > i.far,
.zdf-more-item > .zdf-action-disabled > i.fas,
.zdf-more-item > .zdf-action-disabled > i.fab {
    margin-right: 0;
}

/* Keep More trigger aligned like other inline links */
.zdf-action-primary {
    display: inline-block;
    font-size: inherit !important;
    line-height: inherit !important;
    vertical-align: baseline;
    white-space: nowrap;
}

.zdf-action-primary > .far,
.zdf-action-primary > .fas,
.zdf-action-primary > .fab,
.zdf-action-primary > i.far,
.zdf-action-primary > i.fas,
.zdf-action-primary > i.fab,
.zdf-action-primary > div.far,
.zdf-action-primary > div.fas,
.zdf-action-primary > div.fab {
    display: inline-block;
    width: 1em;
    text-align: center;
    margin-right: 0.14rem;
    vertical-align: baseline;
}

/* Keep More trigger aligned like other inline links */
.zdf-more-toggle {
    display: inline-block;
    font-size: inherit !important;
    line-height: inherit !important;
    vertical-align: baseline;
    white-space: nowrap;
}

.zdf-more-toggle > .far,
.zdf-more-toggle > .fas,
.zdf-more-toggle > .fab,
.zdf-more-toggle > i.far,
.zdf-more-toggle > i.fas,
.zdf-more-toggle > i.fab {
    width: auto;
    display: inline-block;
    margin-right: 0.14rem;
    vertical-align: baseline;
}

/* Disabled primary action style (e.g. Edit for RO rows) */
.zdf-action-disabled {
    display: inline-block;
    font-size: inherit !important;
    line-height: inherit !important;
    vertical-align: baseline;
    color: #9aa0a6;
    cursor: default;
}

/* Auth dialog spacing polish */
.auth-dialog .modal-body {
    padding-top: 0.75rem;
    padding-bottom: 0.5rem;
}

.auth-dialog .nav-tabs {
    margin-bottom: 0.75rem;
}

.auth-dialog .tab-content .tab-pane {
    padding-top: 0.1rem;
}

.auth-dialog form .form-group {
    margin-bottom: 0.65rem;
}

.auth-dialog .form-check {
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
}

.auth-dialog .text-right {
    margin-top: 0.5rem;
}

.auth-dialog #auth-signup-captcha {
    min-height: 78px;
}

.zdf-action-disabled > .far,
.zdf-action-disabled > .fas,
.zdf-action-disabled > .fab,
.zdf-action-disabled > i.far,
.zdf-action-disabled > i.fas,
.zdf-action-disabled > i.fab,
.zdf-action-disabled > div.far,
.zdf-action-disabled > div.fas,
.zdf-action-disabled > div.fab {
    display: inline-block;
    width: 1em;
    text-align: center;
    margin-right: 0.14rem;
    vertical-align: baseline;
}