:root {
  --text: #484d55;
  --text-light: #9ca3af;
  --text-grey: #757b8a;
  --headings: #10172a;
  --background-light: #f6f6f9;
  --background-dark: #252627;
  --border: #e1e2eb;
  --border-dark: #c7c8d1;
  --input-border: #dcdce4;
  --primary: #2f75e6;
  --primary-lighter: #c7dcff;
  --primary-darker: #2e6cd2;
  --success: #04cb58;
  --danger: #e23807;
  --tooltip: #fffbf0;
}



*{box-sizing: border-box;}
html,body{min-height:100vh;overflow:hidden}
:root {font-family: 'Inter', sans-serif;font-size:14px;}

body{height:100vh;margin:0;padding:0;background:#fff;color: var(--text);font-synthesis: none;text-rendering: optimizeLegibility;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-webkit-text-size-adjust: 100%;}

h1{color:var(--headings);margin:2em 0 1em 0;font-weight:600;font-size:2em;line-height:1.2}
h2{color:var(--headings);margin:2em 0 1em 0;font-weight:500;font-size:1.40em;line-height:1.2;font-weight:bold}
h3{color:var(--headings);margin:2em 0 1em 0;font-weight:500;font-size:1.15em;line-height:1.2}
h4{color:var(--headings);margin:2em 0 1em 0;font-weight:500;font-size:1.05em;line-height:1.2}
h1:first-child, h2:first-child, h3:first-child, h4:first-child{margin-top:0em;}

p{margin:0 0 1.5em 0;}
a{color:var(--text);}

hr{border:none;border-bottom:1px solid var(--border);margin:40px 0;}

ul{margin:0 0 1.5em 0;padding:0}
ul li{margin:0 0 .5em 20px;padding:0}

.text--danger{color: var(--danger)}

button{font-family:inherit;font-size:inherit;border:none;}


.datatable tr *:last-child{width:50px;font-size:20px}

.block{background:#fff;border-radius:10px;border:1px solid var(--border);padding:15px 25px}

.checklist{margin:0 0 1.5em 0;padding:0;}
.checklist li{margin:0 0 3px 0;padding:0;list-style:none;display:flex;gap:10px;align-items:center}
.checklist li span:first-child{font-size:12px;}

/*******************************************************/
/* Animation
/*******************************************************/

.fade-enter-active, .fade-leave-active {transition:opacity .15s;}
.fade-enter-from, .fade-leave-to {opacity:0;}

.fadezoom-enter-active, .fadezoom-leave-active {transition:all .20s;}
.fadezoom-enter-from, .fadezoom-leave-to {opacity:0;transform: scale(0.95);}

.fadeinup-enter-active,.fadeinup-leave-active {transition:all .15s ease-in-out;}
.fadeinup-enter-to, .fadeinup-leave{ }
.fadeinup-enter-from, .fadeinup-leave-to {opacity:0;transform: translatey(5%)}

.fadeindown-enter-active,.fadeindown-leave-active {transition:all .10s ease-in-out;}
.fadeindown-enter-to, .fadeindown-leave{ }
.fadeindown-enter-from, .fadeindown-leave-to {opacity:0;transform: translatey(-10%)}

.modal-enter-from, .modal-leave-to {opacity: 0;}
.modal-enter-from .modal__container, .modal-enter-leave-to .modal__container{transform: scale(.9);}


.site{display:flex;height:100vh;flex-direction:column}


/*******************************************************/
/* Admin Sidebar
/*******************************************************/

.admin{}

.admin-sidebar{position:fixed;z-index:2;top:0;bottom:0;width:50px;display:flex;flex-direction:column;background:var(--background-dark);color:#fff;transition:.15s all;padding:0 15px;overflow-x:hidden;overflow-y:auto}
.admin--sidebar-active .admin-sidebar{}
.admin:has(.modal--active) .admin-sidebar{z-index:1}
body.tox-fullscreen .admin-sidebar{z-index:1;}

.admin-sidebar::-webkit-scrollbar{width:5px}
.admin-sidebar::-webkit-scrollbar-track{background:transparent}
.admin-sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.3);border-radius:10px}

.admin-sidebar__main{flex:1;}

.admin-sidebar__logo{margin:14px 0 -21px 0;height:32px;position:relative;}
.admin-sidebar__logo img{position:absolute;}
.admin-sidebar__logo img.logo-shape{width:20px;height:20px;top:0;left:0;}
.admin-sidebar__logo img.logo-text{width:110px;opacity:0;top:0px;left:30px;transition:.2s opacity}
.admin--sidebar-active .admin-sidebar__logo img.logo{opacity:1}
.admin--sidebar-active .admin-sidebar__logo img{opacity:1;}

.admin-sidebar__section{height:50px;position:relative;}
.admin-sidebar__section:after{z-index:1;content:'';border-top:1px solid rgba(255,255,255,0.15);position:absolute;left:0;width:100%;top:50%;}
.admin-sidebar__section span{z-index:2;opacity:0;position:absolute;left:0;top:50%;transform: translateY(-50%);white-space:nowrap;padding:0 10px 0 0;transition:.2s all;color:#bcbcbc;text-transform:uppercase;font-size:11px;}
.admin--sidebar-active .admin-sidebar__section span{opacity:1;background: var(--background-dark)}


.admin-sidebar__nav{}
.admin-sidebar__nav ul{margin:0;padding:0;list-style:none;}
.admin-sidebar__nav ul{}
.admin-sidebar__nav ul li{margin:0;padding:0;list-style:none;line-height:1;display:flex;gap:20px}
.admin-sidebar__nav ul li:not(:last-child){margin:0 0 6px 0;}
.admin-sidebar__nav ul li a{cursor:pointer}
.admin-sidebar__nav ul li a:nth-child(2){display:none;}
.admin-sidebar__nav ul li .button{color:#bcbcbc;font-size:12px;display:flex;flex:1;justify-content:flex-start;}
.admin-sidebar__nav ul li .button[aria-current="page"]{color:#fff;}
.admin-sidebar__nav ul li .button:hover{color:#fff;}
.admin-sidebar__nav ul li .button .button__icon{opacity:.4;color:#fff}
.admin-sidebar__nav ul li .button .button__icon svg{width:18px;height:18px;}
.admin-sidebar__nav ul li .button .button__label{opacity:0;transition:.2s all}
.admin--sidebar-active .admin-sidebar__nav ul li .button .button__label{opacity:1;}
.admin-sidebar__nav ul li.admin-sidebar__nav--active .button__icon{color:#fff;opacity:1}
.admin-sidebar__nav ul li.admin-sidebar__nav--active .button__label{color:#fff;}
.admin-sidebar__nav ul li ul{margin:10px 0 0 20px;}
.admin-sidebar__nav ul li ul li{margin:0 0 10px 0;}

.admin-sidebar__footer{padding:10px 0 10px 0px}

/* Sidebar open/hover/pinned state */
.admin--sidebar-hover .admin-sidebar{width:180px;}
.admin--sidebar-pinned .admin-sidebar{width:180px;}
.admin--sidebar-pinned .admin-sidebar__header{opacity:1}
.admin--sidebar-pinned .admin-sidebar__section span{display:block;}
.admin--sidebar-pinned .admin-sidebar__nav ul li .button .button__label{display:block;}
.admin--sidebar-pinned .adminbar{left:180px;}
.admin--sidebar-pinned .admin__main{left:180px;}
.admin--sidebar-pinned .site-preview{left:180px;}

.site-preview{position:fixed;z-index:1;top:50px;right:0;bottom:0;left:50px;}

/*******************************************************/
/* User Menu
/*******************************************************/

.user-menu{position:relative;font-size:12px;anchor-name:--user-anchor;}
.user-menu .button{padding:10px 10px;margin:0 -10px}
.user-menu .button:hover{background:rgba(255,255,255,0.1) !important;padding:10px 10px}

/*******************************************************/
/* Sidebar Flyout Menus
/*******************************************************/

.sidebar-flyout{position:relative;}
.sidebar-flyout--settings{anchor-name:--settings-anchor;}
.sidebar-flyout--tools{anchor-name:--tools-anchor;}
.sidebar-flyout--pe{anchor-name:--pe-anchor;}
.sidebar-flyout__chevron{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;width:0;height:22px;color:#bcbcbc;opacity:0;transition:.1s all;flex-shrink:0;overflow:hidden;pointer-events:none;}
.sidebar-flyout__chevron:hover{opacity:1;color:#fff}
.sidebar-flyout__chevron svg{width:16px;height:16px;flex-shrink:0;}
.admin--sidebar-active .sidebar-flyout__chevron{width:22px;opacity:.5;pointer-events:auto;}
.sidebar-flyout__menu{position:fixed;top:anchor(top);left:anchor(right);margin-left:15px;background:#363636;min-width:180px;border-radius:5px;padding:6px 0;box-shadow:0 8px 30px rgba(0,0,0,0.4);z-index:1000;white-space:nowrap;position-try-fallbacks:flip-block;}
.sidebar-flyout__menu--settings{position-anchor:--settings-anchor;}
.sidebar-flyout__menu--tools{position-anchor:--tools-anchor;}
.sidebar-flyout__menu--pe{position-anchor:--pe-anchor;}
.sidebar-flyout__menu--user{position-anchor:--user-anchor;top:auto;bottom:anchor(bottom);}
.sidebar-flyout__menu::before{content:'';position:absolute;top:0;bottom:0;right:100%;width:15px;}
.sidebar-flyout__item{display:flex;align-items:center;gap:10px;padding:6px 12px;color:#d1d5db;text-decoration:none;transition:.1s all;cursor:pointer;background:none;border:none;width:100%;text-align:left;font-family:inherit;font-size:12px;}
.sidebar-flyout__item:hover{background:rgba(255,255,255,0.1);color:#fff}
.sidebar-flyout__item-icon{display:flex;align-items:center;justify-content:center;width:18px;height:18px;opacity:.7;flex-shrink:0;}
.sidebar-flyout__item-icon svg{width:18px;height:18px;}
.sidebar-flyout__item:hover .sidebar-flyout__item-icon{opacity:1}
.sidebar-flyout__item-label{flex:1}
.sidebar-flyout__header{display:flex;align-items:center;gap:10px;padding:8px 12px;font-size:12px}
.sidebar-flyout__header-avatar{display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0}
.sidebar-flyout__header-avatar svg{width:20px;height:20px;opacity:.6}
.sidebar-flyout__header-info{flex:1;overflow:hidden}
.sidebar-flyout__header-name{font-weight:600;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sidebar-flyout__header-email{color:#9ca3af;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.sidebar-flyout__divider{height:1px;background:rgba(255,255,255,0.1);margin:8px 0}


/*******************************************************/
/* AI Chat Popover
/*******************************************************/

/* Disable pointer events on everything during drag/resize */
body.ai-chat-dragging * {
  pointer-events: none !important;
}

body.ai-chat-dragging .ai-chat-popover,
body.ai-chat-dragging .ai-chat-popover * {
  pointer-events: auto !important;
}

/* Popover container */
.ai-chat-popover {
  position: fixed;
  z-index: 1200;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
  display: flex;
  flex-direction: column;
  transition: opacity 0.2s ease, transform 0.2s ease;
  overflow: hidden;
}

/* Header */
.ai-chat-popover__header {
  background: #f7f7f8;
  padding: 12px 16px;
  border-bottom: 1px solid #e0e0e0;
  cursor: move;
  display: flex;
  align-items: center;
  justify-content: space-between;
  user-select: none;
  min-height: 48px;
}

.ai-chat-popover__header:active {
  cursor: grabbing;
}

.ai-chat-popover__title {
  font-weight: 600;
  font-size: 14px;
  color: #1f1f1f;
}

.ai-chat-popover__close {
  background: transparent;
  border: none;
  padding: 4px;
  cursor: pointer;
  color: #666;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  transition: background 0.2s;
}

.ai-chat-popover__close:hover {
  background: rgba(0, 0, 0, 0.05);
}

/* Content area */
.ai-chat-popover__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #fff;
}

/* Messages area */
.ai-chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Chat message bubbles */
.chat-message {
  display: flex;
  max-width: 85%;
  animation: fadeIn 0.2s ease;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.chat-message--user {
  align-self: flex-end;
}

.chat-message--ai {
  align-self: flex-start;
}

.chat-message__text {
  padding: 10px 14px;
  border-radius: 16px;
  font-size: 14px;
  line-height: 1.5;
  word-wrap: break-word;
}

.chat-message--user .chat-message__text {
  background: #0b93f6;
  color: #fff;
  border-bottom-right-radius: 4px;
}

.chat-message--ai .chat-message__text {
  background: #f1f1f1;
  color: #1f1f1f;
  border-bottom-left-radius: 4px;
}

.chat-message--error .chat-message__text {
  background: #ff4444;
  color: #fff;
}

.empty-chat {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #666;
  font-style: italic;
  text-align: center;
  padding: 20px;
}

/* File attachments preview */
.ai-chat-attachments {
  padding: 8px 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border-top: 1px solid #e0e0e0;
  background: #fafafa;
}

.attachment-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 16px;
  padding: 6px 10px 6px 12px;
  font-size: 13px;
  max-width: 200px;
}

.attachment-chip__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #1f1f1f;
}

.attachment-chip__remove {
  background: transparent;
  border: none;
  padding: 2px;
  cursor: pointer;
  color: #666;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.attachment-chip__remove:hover {
  background: rgba(0, 0, 0, 0.05);
}

.attachment-chip__remove svg {
  width: 12px;
  height: 12px;
}

/* Draggable divider between messages and input */
.ai-chat-divider {
  height: 6px;
  background: #e0e0e0;
  cursor: row-resize;
  flex-shrink: 0;
  position: relative;
  transition: background 0.15s;
}

.ai-chat-divider:hover,
.ai-chat-divider:active {
  background: #c0c0c0;
}

/* Input wrapper - flex column with shared border */
.ai-chat-input-wrapper {
  padding: 14px;
  background: #fff;
  flex-shrink: 0;
  box-sizing: border-box;
}

/* Inner border container: textarea on top, toolbar on bottom */
.ai-chat-input-wrapper > .ai-chat-input,
.ai-chat-input-wrapper > .ai-chat-input-toolbar {
  /* grouped for the shared border container below */
}

.ai-chat-input-wrapper {
  display: flex;
  flex-direction: column;
  min-height: 120px;
}

/* The textarea + toolbar share a single rounded border via a pseudo-container approach:
   We put the border on the wrapper's inner area by nesting textarea and toolbar
   inside a visual group. Since we can't add a wrapper div without changing HTML,
   we use the wrapper itself minus its padding as the border container. */

.ai-chat-input {
  width: 100%;
  border: 1px solid #e0e0e0;
  border-bottom: none;
  border-radius: 12px 12px 0 0;
  padding: 10px 12px;
  font-size: 14px;
  line-height: 1.5;
  font-family: inherit;
  resize: none;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  transition: border-color 0.2s;
  box-sizing: border-box;
  scrollbar-width: thin; /* Firefox */
  scrollbar-color: transparent transparent; /* Firefox - hide by default */
}

/* Show scrollbar on hover/focus for Firefox */
.ai-chat-input:hover,
.ai-chat-input:focus {
  scrollbar-color: #d0d0d0 transparent; /* Firefox */
}

/* Scrollbar styling for webkit browsers */
.ai-chat-input::-webkit-scrollbar {
  width: 6px;
}

.ai-chat-input::-webkit-scrollbar-track {
  background: transparent;
}

.ai-chat-input::-webkit-scrollbar-thumb {
  background: transparent; /* Hidden by default */
  border-radius: 3px;
}

/* Show scrollbar on hover/focus for webkit */
.ai-chat-input:hover::-webkit-scrollbar-thumb,
.ai-chat-input:focus::-webkit-scrollbar-thumb {
  background: #d0d0d0;
}

.ai-chat-input:hover::-webkit-scrollbar-thumb:hover,
.ai-chat-input:focus::-webkit-scrollbar-thumb:hover {
  background: #b0b0b0;
}

.ai-chat-input:focus {
  outline: none;
  border-color: #0b93f6;
}

/* When textarea is focused, also highlight the toolbar border */
.ai-chat-input:focus + .ai-chat-input-toolbar {
  border-color: #0b93f6;
}

.ai-chat-input::placeholder {
  color: #999;
}

/* Toolbar row below textarea */
.ai-chat-input-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 8px;
  border: 1px solid #e0e0e0;
  border-top: none;
  border-radius: 0 0 12px 12px;
  background: #fff;
  transition: border-color 0.2s;
}

/* Attach button */
.ai-chat-attach-btn {
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #666;
  transition: all 0.2s;
}

.ai-chat-attach-btn:hover {
  background: #f7f7f8;
  border-color: #ccc;
}

/* Send button */
.ai-chat-send-btn {
  background: #1f1f1f;
  border: none;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #fff;
  transition: all 0.2s;
}

.ai-chat-send-btn:hover:not(:disabled) {
  background: #000;
  transform: scale(1.05);
}

.ai-chat-send-btn:disabled {
  background: #e0e0e0;
  color: #999;
  cursor: not-allowed;
}

.ai-chat-send-btn svg {
  width: 18px;
  height: 18px;
}

/* Resize handle */
.resize-handle {
  position: absolute;
  background: transparent;
  z-index: 10;
}

.resize-handle--corner {
  right: 0;
  bottom: 0;
  width: 20px;
  height: 20px;
  cursor: nwse-resize;
}

.resize-handle--corner::after {
  content: '';
  position: absolute;
  right: 4px;
  bottom: 4px;
  width: 10px;
  height: 10px;
  border-right: 2px solid #ccc;
  border-bottom: 2px solid #ccc;
  opacity: 0.7;
  transition: all 0.2s;
}

.resize-handle--corner:hover::after {
  border-color: #666;
  opacity: 1;
  right: 3px;
  bottom: 3px;
  width: 12px;
  height: 12px;
}


/*******************************************************/
/* Top Adminbar
/*******************************************************/

.adminbar{background:var(--background-dark);color:#fff;display:flex;align-items:center;height:50px;padding:0 15px;position:fixed;top:0;left:50px;right:0;}
.adminbar:hover{z-index:2;}
.adminbar__start{flex:1;}

.adminbar__main{padding:10px 0px;position:relative;flex:1;max-width:250px;white-space:nowrap;display:flex;align-items:center;gap:10px;}
.adminbar__main-title{cursor:pointer}
.adminbar__main-title-linked:hover{text-decoration:underline}
.adminbar__main .adminbar__main-text{}
.adminbar__main .adminbar__main-text .adminbar__main-status{font-size:11px;opacity:.7;}
.adminbar__main-title{font-weight:bold;font-size:1.2em;}
.adminbar__main-dropdown-title{}

.adminbar__middle{width:100%;text-align:center;width:200px;}

.adminbar__end{flex:1;text-align:right;display:flex;gap:10px;justify-content:flex-end}

.adminbar__dropdown{position:absolute;top:50px;z-index:3;background: var(--background-dark);width:100%;max-width:120px;transition:.1s all;border-radius:5px;padding:2px;box-shadow:0px 0px 10px rgba(0,0,0,0.2);border:1px solid #6f6f6f}
.adminbar__dropdown .button{border:none;}
.adminbar__dropdown .button:not(.active):not(:hover){opacity:.7}
.adminbar__dropdown .button.active{background:#000;}
.adminbar__dropdown .button:hover{opacity:1}
.adminbar__dropdown .button__label{flex:1;text-align:left}

.dropdown{position:relative}
.dropdown__trigger{display:flex;align-items:center;gap:8px;padding:8px 12px;background:transparent;border:1px solid #6f6f6f;border-radius:5px;color:#fff;cursor:pointer;font-size:13px;font-weight:500;min-width:140px;justify-content:space-between}
.dropdown__trigger:hover{border-color:#999}
.dropdown__icon{transition:transform .15s ease}
.dropdown--open .dropdown__icon{transform:rotate(180deg)}
.dropdown__menu{position:absolute;top:100%;left:0;right:0;padding-top:4px;background:transparent;z-index:10}
.dropdown__menu-inner{background:var(--background-dark);border:1px solid #6f6f6f;border-radius:5px;padding:4px;box-shadow:0 4px 12px rgba(0,0,0,0.3)}
.dropdown__item{display:block;width:100%;padding:8px 12px;background:none;border:none;color:#bcbcbc;text-align:left;cursor:pointer;border-radius:3px;font-size:13px}
.dropdown__item:hover{background:rgba(255,255,255,0.1);color:#fff}
.dropdown__item--active{color:#fff;background:rgba(255,255,255,0.15)}

/* Title dropdown (integrated with page title) */
.adminbar__title-dropdown{position:relative;margin:0 0 0 -15px;display:inline-block}
.adminbar__title-dropdown-trigger{display:flex;align-items:center;gap:15px;padding:0 15px 0 20px;background:transparent;border:none;border-left:1px solid #4d4d4e;border-right:1px solid #4d4d4e;color:#fff;cursor:pointer;height:50px;min-width:250px;max-width:350px}
.adminbar__title-dropdown-trigger:hover{background:rgba(255,255,255,0.05)}
.adminbar__title-dropdown-text{display:flex;flex-direction:column;text-align:left;flex:1;overflow:hidden}
.adminbar__title-dropdown-status{font-size:11px;opacity:0.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adminbar__title-dropdown-label{font-size:1.2em;font-weight:bold;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adminbar__title-dropdown-icon{opacity:0.7;transition:transform .15s ease}
.adminbar__title-dropdown--open .adminbar__title-dropdown-icon{transform:rotate(180deg)}
.adminbar__title-dropdown-menu{position:absolute;top:100%;left:0;padding-top:0;background:transparent;z-index:10;width:250px}
.adminbar__title-dropdown-menu-inner{background:var(--background-dark);border:1px solid #4d4d4e;border-top:none;padding:4px}
.adminbar__title-dropdown-item{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;background:none;border:none;color:#bcbcbc;text-align:left;cursor:pointer;font-size:13px}
.adminbar__title-dropdown-item:hover{background:rgba(255,255,255,0.1);color:#fff}
.adminbar__title-dropdown-item--active{color:#fff;background:rgba(255,255,255,0.15)}
.adminbar__title-dropdown-item svg{width:16px;height:16px;flex-shrink:0}


/*******************************************************/
/* API Working
/*******************************************************/

.api-working{position:fixed;top:-5px;left:0;right:0;z-index:100;margin:0;transition:.2s all;opacity:0;}
.api-working--active{top:0;opacity:1}
.api-working__line {width: 100%;height:5px;position: relative;overflow: hidden;background-color: rgba(255,255,255,1)}
.api-working__line:before {content: "";position: absolute;left: -50%;height: 5px;width: 40%;background-color: #397ff1;animation: lineAnim 1s linear infinite;}
@keyframes lineAnim {0% {left: -40%;}50% {left: 20%;width: 80%;}100% {left: 100%;width: 100%;}}

/*******************************************************/
/* Content
/*******************************************************/

.admin__main{position:fixed;top:50px;left:50px;right:0;bottom:0;overflow:auto;z-index:1}


.content{padding:30px 30px;}

.content-columns{display:flex;flex:1;gap:30px;margin:0 -30px}
.content-columns__main{flex:1;padding:0px 0 0 30px;width:100%;overflow:auto}
.content-columns__end{width:30%;max-width:300px;padding:0px 30px;min-width:275px;border-left:1px solid var(--border);}

.breadcrumb{font-size:.9em;padding:0px 30px;margin:15px 0 0 0}
.breadcrumb ul{margin:0;padding:0;list-style:none;display:flex;gap:10px}
.breadcrumb ul li{margin:0;padding:0;display:flex;gap:10px}
.breadcrumb ul li a{text-decoration: none;display:inline-flex;align-items:center;gap:5px}
.breadcrumb ul li a svg{width:16px;height:16px;}
.breadcrumb ul li:not(:last-child){font-weight:bold;cursor:pointer}
.breadcrumb ul li:first-child{font-weight:bold;cursor:pointer}
.breadcrumb ul li:not(:first-child):before{opacity:.5;content:'/';display:block;}

.page-title{border-bottom:1px solid var(--border);padding:20px 30px 20px 30px;background:#fff;position:sticky;top:0;display:flex;align-items:center;gap:15px;justify-content:space-between;}
.breadcrumb ~ .page-title{padding-top:10px;}
.page-title__start{}
.page-title__start > *{margin:0;}
.page-title__start h1{font-weight:500;font-size:2em;line-height:1.2}
.page-title__start h1 a{cursor:pointer;}
.page-title__start h1 a:hover{text-decoration:underline;}
.page-title__end{width:33.33%;text-align:right;display:flex;gap:15px;justify-content:flex-end;align-items:center;}

.subheading{display:flex;justify-content:space-between;align-items:center;margin:0 0 20px 0}
.subheading__start{}
.subheading__start h2{margin:0;}
.subheading__end{text-align:right}


.tabs__control{display:flex;gap:25px;margin:0 0 20px 0}
.tabs__control .tab__item{border-bottom:2px solid transparent;display:inline-flex;gap:10px;align-items:center;padding:5px 0px;cursor:pointer;text-decoration: none;color:var(--text);background:none}
.tabs__control .tab__item svg{width:18px;height:18px;opacity:.5;}
.tabs__control .tab__item--active{border-bottom:2px solid var(--primary);color:#000}
.tabs__control .tab__item--active svg{opacity:1;}
.tabs__control.tabs__control--vertical{display:block;margin:0}
.tabs__control.tabs__control--vertical .tab__item{display:block;margin:0 0 10px 0;padding:0 0 3px 0}
.tabs__control.tabs__control--vertical .tab__item--active{border-bottom:2px solid var(--primary);}

.list{border-collapse:collapse;width:100%}
.list__header{display:flex;;gap:15px;align-items:center;background:var(--background-light);padding:0 25px;border-radius:5px;margin:0 0 10px 0;overflow:hidden}
.list__header > .list__column{font-weight:bold;}

.list__column{padding:15px 0}

.list__body{margin:8px 0 0 0;}
.list__body.list__body--sortable{margin:0}

.list__item{position:relative;}
.list__item-selected .list__item-heading{border-color:#000}
.list__item-current .list__item-heading .list__column--title{color: var(--primary)}
.list__body:not(.list__body--sortable) .list__item{margin-bottom:8px}

.list__item-heading{display:flex;align-items:center;position:relative;background:#fff;border:1px solid var(--border);min-height:50px;gap:15px;padding:0 25px;border-radius:5px;text-decoration:none;overflow:hidden}
.list__item-heading--linked:hover{border-color:var(--border-dark);cursor:pointer}
.list__item--open > .list__item-heading{border-radius:5px 5px 0 0;border-color:var(--border-dark)}
.list__item-heading-link:hover{background: var(--background-light)}
.list__item--drag{cursor:move;}

.list__column--date{width:165px;}
.list__column--actions{width:50px;text-align:right;display:flex;justify-content:flex-end;gap:10px}
.list__column--link{color:#000;font-weight:500;text-decoration:none}
.list__column--link:hover{cursor:pointer}
.list__column--title{color:#000;position:relative;flex:1}
.list__column--title svg{width:24px;height:24px;vertical-align:middle;position:relative;top:-1px;margin:0 5px 0 0;opacity:.5}
.list__column--image{width:50px;margin:-10px 0 -10px -15px;font-size:0}
.list__column--image img{width:100%;height:100%;object-fit:fill;border-radius:5px;}
.list__column--gsp-id{width:100px}
.list__column--screenshot{width:150px;}
.list__column--screenshot .screenshot{max-height:150px;overflow:hidden;cursor:pointer;margin:-15px -25px -15px 0;font-size:0}
.list__column--screenshot .screenshot img{width:100%;;border-radius:5px}

.list__item-content{border:1px solid var(--border-dark);border-top:none;border-radius:0 0 5px 5px;padding:20px 20px}
.layout-preview{display:grid;gap:10px;}
.layout-preview__item{background:var(--background-light);border-radius:4px;padding:10px 10px;text-align:center}

.list__item-children{padding-left:20px}

.dragging{opacity:.4;}
.list__item.dragging .list__item-heading{background:rgba(255,255,255,.7);}


.drop-target{opacity:0;pointer-events:none;border:1px solid var(--primary);transition:.1s all;font-size:0;padding:0 !important;border-radius:100px;height:8px;margin:1px 0;}
.list__body > .drop-target:first-child{margin-top:-8px;}
.list__body.dragging-container-active{zzzpadding-bottom:75px;}
.dragging-container-active .drop-target{pointer-events:auto;}
.list__item.dragging + .drop-target{opacity:0;pointer-events:none}
.list__item.dragging .drop-target{opacity:0;pointer-events:none}

.post-status{display:inline-block;padding:3px 8px;border-radius:5px;border:1px solid transparent;font-weight:normal;font-size:12px;margin:-5px 0 -5px 5px}
.post-status--draft{border-color:orange;}
.post-status--schedule{border-color:blue;}


.post-tools{opacity:0;font-weight:normal;font-size:12px;position:absolute;right:10px;top:50%;transform: translateY(-50%);}
.list__item-heading:hover .post-tools{opacity:1;}
.post-tools ul{margin:0;padding:0;list-style:none;display:flex;border:1px solid var(--border);border-radius:5px}
.post-tools ul li{margin:0;display:inline-block;padding:6px 10px;background:var(--background-light);cursor:pointer}
.post-tools ul li a{text-decoration:none;}
.post-tools ul li:first-child{border-radius:5px 0 0 5px}
.post-tools ul li:last-child{border-radius:0 5px 5px 0}
.post-tools ul li:not(:last-child){border-right:1px solid var(--border);}
.post-tools ul li:hover{background:#fff}
.post-tools ul li svg{width:16px;height:16px;}

.toggle-hierarchy{cursor:pointer;background: var(--background-light);position:absolute;top:0;left:0;bottom:0;width:18px;text-align:center;border-right:1px solid var(--border);border-radius:5px 0 0 5px}
.toggle-hierarchy:hover{color:var(--primary);background:#fff}
.toggle-hierarchy svg{width:10px;height:10px;}

.drop-target--hovering{background:var(--primary);opacity:1;}

.drop-target--child{position:absolute;right:0;bottom:0;left:45px;}

.list__actions{margin:25px 0 0 0;}


.notice{background:#fff;padding:15px 25px;margin:0 0 30px 0;border:1px solid var(--primary);border-left:10px solid var(--primary);position:relative}
.notice--error{border:1px solid var(--danger);border-left:10px solid var(--danger);}
.notice--danger{border:1px solid var(--danger);border-left:10px solid var(--danger);}
.notice--success{border:1px solid var(--success);border-left:10px solid var(--success);}
.notice--muted{border:1px solid var(--border);border-left:10px solid var(--border)}
.notice > *:last-child{margin-bottom:0;}
.notice h2{font-size:1.3em;margin:0 0 1em 0;}
.notice p{margin:0 0 1em 0;}
.notice__close{position:absolute !important;top:8px;right:20px;}


.notice.global-error{position:fixed !important;top:10px;left:10px;right:10px;z-index:3;padding:25px 60px 25px 25px}
.notice.global-error .button{position:absolute;top:14px;right:20px;}

.tags{}
.tag{display:inline-block;font-size:12px;line-height:1;background: var(--background-light);padding:4px 10px;margin:0 4px 2px 0;border-radius:100px;;border:1px solid var(--border);cursor:pointer}
.tag--active{border:1px solid var(--primary);background:#fff;color:#000}


/*******************************************************/
/* Buttons
/*******************************************************/

button{font-family:inherit;font-size:inherit;background:none;border:none;margin:0;padding:0}

.buttons{display:flex;gap:15px;margin:15px 0 0 0}

.button{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:0 1.25em;line-height:1;white-space:nowrap;zzzvertical-align:middle;font-size:13px;margin:0;border-radius:4px;min-height:2.7em;text-decoration:none;cursor:pointer;position:relative;font-family:inherit;color:var(--text);border:1px solid var(--primary);touch-action:manipulation;transition:.2s all;font-weight:500;background:#fff;}
.button:not(.button--link):hover{color:#fff;background:var(--primary)}

.button--small{font-size:12px}
.button--small .button__icon svg{width:16px;height:16px;}

.button--pixel{border:1px solid var(--border);padding:4px;min-height:auto;border-radius:100px;margin-bottom:-2px;}
.button--pixel .button__icon{margin:0 !important;}
.button--pixel .button__icon svg{width:12px;height:12px;}

.zzzbutton--cycle-breakpoint.breakpoint-icon--base{opacity:0}
.field .button--cycle-breakpoint{opacity:0}
.field--has-value .button--cycle-breakpoint{opacity:1;}

.button__label{}
.button__label{font-weight:500}

.button__icon{vertical-align:middle;display:inline-flex;align-items:center;justify-content:center;border:none;background:none;outline:none;cursor:pointer;}
.button__icon svg{color:inherit;width:18px;height:18px;}
.button:hover .button__icon{}
.button__icon:only-child{margin:0 -.5em;}

.button:disabled, .button.button--disabled{border-color:var(--border);cursor:default;pointer-events:none;background: var(--background-light);color:var(--text-grey);}
.button.button--primary:disabled, .button--primary.button--disabled{}

.button--full-width{width:100%;}

.button--active{background:#fff;color:#000;}
.button--inactive{border:1px solid var(--border)}
.button--inactive .button__icon{opacity:.5}

.button--cancel{border:1px solid var(--border)}

.button--primary{background:var(--primary);color:#fff;border:1px solid transparent;}
.button--primary:hover{background:var(--primary-darker);color:#fff;border:1px solid transparent}
.button--primary .button__icon img, .button--primary .button__icon{}
.button--primary:hover .button__icon img, .button--primary:hover .button__icon svg{}


.button--link,.button--link:hover{background:none !important;border:none;box-shadow:none;padding:0;min-height:auto}
.button--link > span:only-child{margin:0 !important;}
.button--link:hover .button__icon svg{}
.button--link .button__label{margin-right:0;}
.button--link .button__icon{margin-left:0;}


.button--underline{text-decoration:underline;}

.button--delete{border-color:var(--danger) !important;color:var(--danger)}
.button--delete:hover{background-color:var(--danger);color:#fff;}
.button--delete.button--link:hover{background-color:none;color:var(--danger)}
.button--delete:hover .button__icon img, .button--primary-outline:hover .button__icon svg{filter:invert(100)}
.button--delete.button--link{color:var(--danger);}

.button--circle{border-radius:100px;width:2.6em;height:2.6em;aspect-ratio:1/1}

.button--new{background-color: var(--success);color:#000;border:none}
.button--new:hover{color: var(--success);}

.button--inverse{border-color:#4d4d4e;;color:#efefef;}
.button--inverse.button--active{background:#000 !important;}
.button--inverse:not(.button--primary){background:var(--background-dark);}
.button--inverse.button--disabled{border-color:#4d4d4e;}

.button-toggle{display:flex;}
.button-toggle .button:not(:only-child):first-child{border-top-right-radius:0;border-bottom-right-radius:0;border-right:none;}
.button-toggle .button:not(:only-child):last-child{border-top-left-radius:0;border-bottom-left-radius:0;;}
.zzzzbutton-toggle .button:not(.button--active) .button__icon{opacity:.5}


.button-toggle-group{display:flex;}
.button-toggle-group .button{border-color:var(--input-border);background-color:var(--background-light);border-right:none;flex:1}
.button-toggle-group .button:hover{color:#fff;}
.button-toggle-group .button--active{background-color:#fff;}
.button-toggle-group .button .button__icon{opacity:.4}
.button-toggle-group .button.button--active .button__icon{opacity:1}
.button-toggle-group .button.button--inherited .button__icon{opacity:1}
.button-toggle-group .button:first-child{border-radius:4px 0 0 4px;}
.button-toggle-group .button:not(:first-child):not(:last-child){border-radius:0;}
.button-toggle-group .button:last-child{border-radius:0 4px 4px 0;border-right:1px solid var(--input-border);}


/*******************************************************/
/* Page Modal
/*******************************************************/

.modal{opacity:0;visibility:hidden;background: rgba(47,64,92,0.3);position:fixed;z-index:1201;top:0;right:0;bottom:0;left:0;display:flex;align-items: center;justify-content: center;padding:20px 20px;transition:.1s all;font-size:14px;color:var(--text)}
.modal--active{opacity:1;visibility:visible}
.modal__container{background:#fff;width:100%;max-height:100%;width:95vw;height:95vh;max-width:1200px;border-radius:4px;display:flex;flex-direction:column;opacity:1;transform:scale(1);box-shadow:0 0 15px rgba(47,64,92,0.1)}
.modal__header{display:flex;gap:25px;align-items:center;padding:18px 30px;border-bottom:1px solid var(--border);background: var(--background-light);border-radius:4px 4px 0 0;font-weight:bold;font-size:1.2em;position:relative;}
.modal__close{position:absolute;right:20px;cursor:pointer;background:#fff;border:1px solid var(--border);border-radius:4px;line-height:0;padding:5px}
.modal__close svg{opacity:.8;width:18px;height:18px}

.modal__body{flex:1;overflow:auto;padding:30px 30px}
.modal__body > *:last-child{margin-bottom:0;}
.modal__body .page-title{padding-top:0;padding-left:0;padding-right:0;margin:0 0 20px 0;position:relative;}
.modal__body .content{overflow-y:visible}
.modal__footer{display:flex;align-items:center;justify-content:space-between;padding:15px 30px;background: var(--background-light);border-top:1px solid var(--border);border-radius:0 0 4px 4px;min-height:66px}
.modal__footer-start{display:flex;flex-direction:row;gap:15px;}
.modal__footer-end{display:flex;flex-direction:row;gap:15px;justify-content: flex-end}

.modal--media{}


/*******************************************************/
/* Form Elements
/*******************************************************/

.fields-grid{display:grid;grid-template-columns: 1fr;gap:20px;margin-bottom:20px;}
.fields-grid--2{grid-template-columns: repeat(2,1fr);}
.fields-grid--3{grid-template-columns: repeat(3,1fr);}
.fields-grid--4{grid-template-columns: repeat(4,1fr);}
.fields-grid--5{grid-template-columns: repeat(5,1fr);}
.fields-grid > .field{margin:0;}

.field{margin-bottom:20px;position:relative;flex:1}
.field:last-child{margin:0;}
.field--no-margin{margin:0;}
.field--half-margin{margin-bottom:.75em;}
.field__label{margin:0 0 5px 0;color:#000;font-weight:500;}
.field__label label{margin-right:4px;}
.field__label button{position:relative;vertical-align:text-bottom;}
.field--horizontal{display:flex;align-items:center}
.field--horizontal .field__label{margin:0 1em 0 0;width:20%;line-height:1.2}
.field--horizontal .field__input{flex:1;}

.field-editing-responsive-warning{margin:0 0 15px 0;font-size:11px;display:flex;align-items:center;gap:5px}
.field-editing-responsive-warning .button{flex:0;}

.field--nested-label{}
.field--nested-label .field__label{margin:0 0 .4em 0;font-size:.9em}


.field__required{color:red;margin:0 0 0 5px}
.field__input{position: relative;}
.field__description{font-size:.9em;margin:10px 0 0 0;}
.field__content{position:relative}
.field__required-message{font-size:.9em;color:red;margin:10px 0 0 0;}

.field__input--textfield, 
.field__input--password, 
.field__input--email,
.field__input--textarea,
.field__input--code,
.field__input--select,
.field__input--multiselect,
.field__input--date,
.field__input--number,
.field__input--telephone{width:100%;font-size:inherit;font-family:inherit;padding:.7em .75em .7em .75em;border:1px solid var(--input-border);border-radius:0;margin:0;color:#000;display:block;background:#fff;border-radius:4px;box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.01);}

textarea.field__input:focus,
select.field__input:focus,
input.field__input:focus{border-color:var(--primary);outline:3px solid var(--primary-lighter);}

.field__input--color{}
.field__input--textfield{}
.field__input--email{}
.field__input--textarea{}
.field__input--select{-webkit-appearance:none;padding-right:30px;background-color:#fff;background-image:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='20' fill='%23000' height='20' viewBox='0 0 24 24'><path fill='%23666' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>");background-position:99% 63%;background-repeat:no-repeat;}
.field__input--range{width:100%;margin: 0;padding: 0;}
.field__input--date{}
.field__input--textfield:disabled, .field__input--textarea:disabled, .field__input--select:disabled{background-color:#fff;color:#666}
.field__input--large{font-size:1.5em;}

.field__input--code{font-family:monospace;font-size:14px}

.field--type-color{}
.field--type-color .field__content{display:flex;gap:5px;}
.field--type-color .contrast-error-indicator{position:absolute;top:0;right:0;bottom:0;width:40px;padding:5px;z-index:1;font-weight:bold;border:1px solid red;display:flex;align-items:center;justify-content:center}
.field--type-color .nullability-checkbox{display:none;}
/*
.color-picker{position:absolute;top:100%;left:0;background:#fff;width:240px;padding:5px;border-radius:5px;border:1px solid var(--border);z-index:2}
.color-picker .color-picker__canvas{position:relative;font-size:0}
.color-picker .color-picker__canvas canvas{}
.color-picker .color-picker__pointer{opacity:0;border:2px solid rgba(255,255,255,0.8);width:16px;height:16px;border-radius:100px;position:absolute;z-index:2;pointer-events:none}
.color-picker .color-picker__canvas:hover .color-picker__pointer{opacity:1}
.color-picker .color-picker__presets{display:grid;grid-template-columns: repeat(5,1fr);gap:5px;margin:5px 0 0 0}
.color-picker .color-picker__presets .palette{width:100%;}
.palette{border-radius:5px;width:40px;height:35px;border:1px solid var(--border);outline:1px solid #fff}
.palette:hover{border:1px solid #999;outline:1px solid #fff}
.palette--empty{background-image: linear-gradient(45deg, #efefef 25%, transparent 25%), linear-gradient(-45deg, #efefef 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #efefef 75%), linear-gradient(-45deg, transparent 75%, #efefef 75%);background-size: 20px 20px;background-position: 0 0, 0 10px, 10px -10px, -10px 0px;}
.field--type-color .field__content > .palette{height:auto}
*/
.color-picker .color{outline:1px solid #fff;box-shadow:0 0 4px rgba(0,0,0,0.3)}
.color-picker .nullability-checkbox{display:none !important;}

.field--type-color .field__content .field__input--textfield{flex:1}

.field--type-link .field__link-preview{background:#fff;border:1px solid var(--border);padding:10px 35px 10px 15px;margin:0 0 10px 0;border-radius:5px;position:relative;overflow-wrap: break-word;cursor:pointer}
.field--type-link .field__link-preview:hover{border-color:var(--primary)}
.field--type-link .field__link-preview .button{position:absolute;top:7px;right:10px;;}

.field--type-range{}
.field--type-range .field__content{display:flex;position:relative;}
.field--type-range .field__content .field__input--textfield{flex:1}
.field--type-range .field__content .field__input--select{width:60px;}
.field--type-range .field__input--range{opacity:0;border:none;margin:0;padding:0;position:absolute;bottom:-15px;left:0;right:0;outline:none !important}
.field--type-range:hover .field__input--range{opacity:1}

.field--type-box-shadow{}
.field--type-box-shadow .field__content{display:grid;grid-template-columns:1fr 1fr;gap:15px 5px}
.field--type-box-shadow .field__content > div{position:relative;display:flex}
.field--type-box-shadow .field__content > div .field__input--textfield{flex:1}
.field--type-box-shadow .field__content > div .field__input--select{width:60px;}
.field--type-box-shadow .field__content > div .field__input--range{opacity:0;border:none;margin:0;padding:0;outline:none;position:absolute;bottom:-15px;left:0;right:0;}
.field--type-box-shadow .field__content > div:hover{z-index:2}
.field--type-box-shadow .field__content > div:hover .field__input--range{opacity:1}

.field--type-icon{}
.field--type-icon .field__content{}

.field--type-media{max-width:400px}
.field--type-media .selected-media-preview{margin:0 0 10px 0;position:relative;border:1px solid var(--border);font-size:0;text-align:center}
.field--type-media .selected-media-preview img{width:100%;height:100%;object-fit:contain;pointer-events:none;}

.focal-point{margin:0;position:absolute;top:50%;left:50%;transform: translate(-50%,-50%);pointer-events:none;background:rgba(255,255,255,0.8);border-radius:100px}

.field--type-image-position{display:none}

.field--type-checkbox{}
.field--type-checkbox .field__content{display:flex;align-items:center;gap:5px}
.field--type-checkbox .field__sublabel{}

.icon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px, 1fr));grid-gap:10px}

.icon-preview{display:block;padding:10px;border-radius:5px;border:1px solid var(--border);text-align:center;background:#fff;position:relative;content-visibility: auto}
.icon-preview:hover{border:1px solid var(--border-dark);}
.icon-preview svg, .icon-preview img{width:48px;height:48px}
.icon-preview .icon-delete{position:absolute;top:2px;right:2px;}

.field--type-separator{border-bottom:1px solid var(--border-dark);}

.field--type-repeater{}

.field--type-tags .svelte-tags-input-layout{min-height:41px;}
.field--type-tags .svelte-tags-input-layout .svelte-tags-input-tag{font-size:15px !important;font-family:inherit !important;border-radius:5px !important;padding:5px 10px !important;background-color: var(--primary) !important}
.field--type-tags .svelte-tags-input-layout .svelte-tags-input{font-size:15px !important;font-family:inherit !important;border-radius:5px !important}

.repeater{display:grid;grid-template-columns: 1fr;gap:5px}
.repeater__item{border-radius:5px;cursor: grab;border:1px solid var(--border-dark)}
.repeater__item-header {padding:15px 15px;position:relative;font-weight:bold;cursor:pointer;display:flex;align-items:center;gap:10px;background:#e7ecf2;border-radius:5px 5px 0 0 }
.repeater__item--condensed .repeater__item-header {padding:5px;gap:5px}
.repeater__item-header-label{flex:1}
.repeater__item-header-actions{display:flex;gap:3px}
.repeater__item-drag{cursor:move;width:20px}
.repeater__item-drag svg{width:18px;height:18px;}
.repeater__item-body{padding:15px 15px;display:flex;flex-direction:column;gap:15px;border-radius:0 0 5px 5px}
.repeater__item-body .field{margin:0 0 10px 0;}
.repeater__item .settings{display:none;}
.repeater__item-active .settings{display:block}
.repeater__item .settings__heading{display:none}
.repeater__item .settings__section:last-child{border-bottom:0;}

.repeater__actions{display:flex;gap:10px}
.repeater__actions:not(:only-child){margin:20px 0 0 0;}

.search{display:flex;gap:10px;}
.search .button{display:flex;}

.pagination{display:flex;justify-content:space-between;gap:20px;margin:30px 0 0 0}


.color-palette{display:grid;grid-template-columns:repeat(auto-fill,minmax(60px, 1fr));position:relative;}
.color-palette__item{display:inline-block;aspect-ratio:1/1;border:1px solid var(--border);cursor:pointer;position:relative;transition:.2s all;margin:1px}
.color-palette__item div{opacity:0;}
.color-palette__item:hover div{opacity:1;}
.color-palette__item-actions{display:flex;gap:6px;justify-content:center;position:absolute;top:15px;left:0;right:0;width:100%;}
.color-palette__item-hex{position:absolute;bottom:0;left:0;right:0;background:#000;color:#fff;text-align:center;padding:2px 1px;font-weight:bold;font-size:12px} 


/*******************************************************/
/* Page/Form Builder
/*******************************************************/

.builder{display:none;width:100%;height:100%;z-index:2;}
.builder--active{display:flex;}

.builder__preview{flex:1;background:#fff;text-align:center;position:relative;z-index:1;overflow-y:hidden;overflow-x:auto}
.builder__preview-breakpoint-active{background:#fcfcfd;}

.preview-iframe{width:100%;height:100%;position:relative;}
body.is-dragging .preview-iframe{pointer-events:none}


/* Breakpoints */
.builder__preview-breakpoint-active {padding:15px;}
.builder__preview-breakpoint-active .preview-iframe{border:1px solid var(--border);}

.breakpoint-wrapper{}
.breakpoints--active{}

.breakpoint-wrapper .breakpoints{display:flex;justify-content:center;flex:1;gap:5px}
.breakpoint-wrapper .breakpoints button{background:none;margin:0;padding:5px;font-size:0;cursor:pointer;border-radius:100px}
.breakpoint-wrapper .breakpoints button svg{width:16px;height:16px;color:#fff;opacity:.7}
.breakpoint-wrapper .breakpoints .button--active{background: var(--primary);}
.breakpoint-wrapper .breakpoints .button--active:not(:first-child){background:var(--primary);}
.breakpoint-wrapper .breakpoints .button--active svg{opacity:1;}


.builder-settings{background: var(--background-light);border-left:1px solid var(--border);;display:flex;flex-direction: column;width:300px;font-size:12px}

.builder-settings__start{flex:1;overflow-y:auto;padding:0 15px}
.builder-settings__start::-webkit-scrollbar{width:7px;background-color:#F5F5F5;position:relative;right:-7px}
.builder-settings__start::-webkit-scrollbar-track{border-radius:10px;background:rgba(0,0,0,0.1);}
.builder-settings__start::-webkit-scrollbar-thumb{border-radius:10px;background:#c2c2c2;}
.builder-settings__start::-webkit-scrollbar-thumb:hover{background:#7d7d7d;}
.builder-settings__end{padding:15px 15px;}

.builder-settings__table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--border);}
.builder-settings__table th{width:20%;border-bottom:1px solid var(--border);text-align:left;padding:5px 10px}
.builder-settings__table td{border-bottom:1px solid var(--border);;padding:5px 10px}


.dragging-tooltip{position:fixed;z-index:10;background:#fff;border-radius:5px;border:1px solid var(--primary);padding:10px 40px;pointer-events:none;color:#000;box-shadow:0 0 30px rgba(0,0,0,0.2)}

.add-content-columns{display:flex;gap:30px}
.add-content-columns__column{width:175px}
.add-content-columns__content{flex:1}

.add-content-columns__column{}
.add-content-columns__column ul{margin:0 0 15px 0;padding:0 0 15px 0;list-style:none;}
.add-content-columns__column ul li{margin:0 0 10px 0;padding:0 0 10px 0;border-bottom:1px solid var(--border);list-style:none;font-weight:bold;}
.add-content-columns__column ul li:last-child{border:none}
.add-content-columns__column ul li ul{margin:10px 0 0 0}
.add-content-columns__column ul li ul li{margin:0 0 8px 0;font-weight:normal;border:none;border:none}
.add-content-columns__column ul li ul li:last-child{margin:0;}
.add-content-columns__column .tab__item button{border:none}
.add-content-columns__column .tab__item--active button{font-weight:bold}

.add-content{display:grid;;grid-template-columns:repeat(auto-fill,minmax(250px, 1fr));gap:15px;}
.add-content.add-content--sections{}

.add-content__item{background: var(--background-light);border:1px solid var(--border);border-radius:4px;text-align:center;z-index:100;user-select: none;cursor:pointer;display: flex;flex-direction: column;justify-content: center;}
.add-content__item:hover{border:1px solid #000;}
.add-content__item *{user-select: none;}
.add-content__item-image{user-select: none;text-align:center;font-size:0;background:#fff;border-bottom:1px solid var(--border);border-radius:5px 5px 0 0;max-height:300px;overflow:hidden}
.add-content__item-image img{width:100%;border-radius:5px 5px 0 0;}
.add-content__item-image.add-content__item-image--library{aspect-ratio:16/9;width:100%;height:100%;}
.add-content__item-image.add-content__item-image--library img{width:100%;height:100%;object-fit: cover;object-position: top left;transition:.5s all}
.add-content__item-image.add-content__item-image--library:hover img{object-position: bottom left}
.add-content__item-image svg{width:64px;height:64px;margin:25px 0}
.add-content__item-content{padding:10px 20px;font-size:13px;}
.add-content__item-title{font-weight:bold;display:block;font-size:15px}
.add-content__item-tags{margin:8px 0 0 0}
.add-content__item-tags .add-content__item-tag{border:1px solid var(--border-dark);background:#fff;padding: 1px 8px 2px 8px;display:inline-block;margin:0 3px 3px 0;border-radius:100px;font-size:11px;}

.filter-tag-options{margin:0 0 10px 0}
.filter-tag-options-tag{border:1px solid var(--border-dark);background:#fff;padding: 1px 8px 2px 8px;display:inline-block;margin:0 3px 3px 0;border-radius:100px;font-size:11px;cursor:pointer}
.filter-tag-options-tag:hover, .filter-tag-options-tag--active{background: var(--primary);color:#fff}



/*******************************************************/
/* File Upload List
/*******************************************************/

.file-attachment-container {
  background: var(--primary-light);
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  padding: 1rem;
  margin-bottom: 1rem;
}

.file-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.file-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem;
  background: var(--color-bg-secondary);
  border: 1px solid var(--color-border);
  border-radius: 4px;
}

.file-item__icon {
  font-size: 1.5rem;
  line-height: 1;
  flex-shrink: 0;
}

.file-item__details {
  flex: 1;
  min-width: 0;
}

.file-item__label {
  width: 100%;
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--color-border);
  border-radius: 3px;
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
}

.file-item__meta {
  font-size: 0.75rem;
  color: var(--color-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.file-item__remove {
  padding: 0.25rem 0.5rem;
  background: var(--color-danger);
  color: white;
  border: none;
  border-radius: 3px;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  flex-shrink: 0;
}

.file-item__remove:hover {
  background: var(--color-danger-dark);
}

.file-item__remove:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}


/*******************************************************/
/* Component Tree
/*******************************************************/

.component-tree{}
.component-tree ul{margin:0;padding:0;list-style:none}
.component-tree ul ul{padding:0}
.component-tree ul li{margin:0;padding:0;font-size:12px;position:relative}
.component-tree ul li .component-tree__header{background:transparent;border:none;padding:4px 12px;display:flex;align-items:center;cursor:grab;border-radius:5px}
.component-tree ul li .component-tree__header:active{cursor:grabbing}
.component-tree ul li .component-tree__header-editing{background:rgba(var(--primary-rgb), 0.08)}
.component-tree ul li .component-tree__header-label{flex:1;display:flex;align-items:center;cursor:pointer;font-weight:500;color:#333}
.component-tree ul li .component-tree__header-buttons{display:flex;gap:2px;align-items:center;opacity:0;transition:opacity 0.15s}
.component-tree ul li .component-tree__header:hover .component-tree__header-buttons{opacity:1}
.component-tree ul li .component-tree__header:hover{background:rgba(0,0,0,0.04)}
.component-tree ul li .component-tree__header-editing:hover{background:rgba(var(--primary-rgb), 0.08)}
.component-tree__indent{display:inline-block;width:10px;flex-shrink:0}
.component-tree__icon{color:#888;flex-shrink:0;margin-right:6px;color:var(--primary)}
.component-tree__icon svg{width:14px;height:14px;display:block;}
.component-tree__menu-btn{background:none;border:none;padding:4px;cursor:pointer;border-radius:3px;color:#666;display:flex;align-items:center;justify-content:center}
.component-tree__menu-btn:hover{background:rgba(0,0,0,0.08);color:#333}
.component-tree__menu-btn svg{width:16px;height:16px;display:block}
.component-tree__context-menu{position:fixed;z-index:9999999999;background:#363636;border-radius:6px;min-width:140px;padding:4px 0;box-shadow:0 8px 30px rgba(0,0,0,0.4);font-size:12px}
.component-tree__context-menu button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:6px 12px;background:none;border:none;color:#e0e0e0;cursor:pointer;text-align:left;gap:12px}
.component-tree__context-menu button:hover{background:#4a90d9;color:#fff}
.component-tree__context-menu__label{flex:1}
.component-tree__context-menu__icon{color:#888;display:flex;align-items:center}
.component-tree__context-menu__icon svg{width:14px;height:14px}
.component-tree__context-menu button:hover .component-tree__context-menu__icon{color:rgba(255,255,255,0.7)}

.component-tree__root-drop-target {list-style: none;margin: 6px 0 0;min-height: 18px;position: relative;}
.component-tree__root-drop-target::after {content: '';position: absolute;left: 0;right: 0;top: 50%;transform: translateY(-50%);height: 0;border-radius: 4px;background: rgba(var(--primary-rgb, 58, 96, 254), 0.85);box-shadow: 0 0 8px rgba(var(--primary-rgb, 58, 96, 254), 0.45);opacity: 0;transition: all 0.12s ease;pointer-events: none;}
.component-tree__root-drop-target--active::after {height: 6px;opacity: 1;}
.component-tree__header {position: relative;}
li.is-dragging > .component-tree__header {opacity: 0.5;}
.component-tree__header--drop-inside {position: relative;}
.component-tree__header--drop-inside::after {content: '';position: absolute;inset: -4px;border-radius: 7px;border: 2px solid rgba(var(--primary-rgb, 58, 96, 254), 0.85);background: rgba(var(--primary-rgb, 58, 96, 254), 0.1);pointer-events: none;}
.component-tree__header--drop-before::before,.component-tree__header--drop-after::after {content: '';position: absolute;left: -4px;right: -4px;height: 6px;border-radius: 4px;background: rgba(var(--primary-rgb, 58, 96, 254), 0.85);box-shadow: 0 0 8px rgba(var(--primary-rgb, 58, 96, 254), 0.45);}
.component-tree__header--drop-before::before {top: -6px;}
.component-tree__header--drop-after::after {bottom: -6px;}
.component-tree__drop-indicator {height: 0;pointer-events: none;}
.component-tree__drop-indicator--before,.component-tree__drop-indicator--after {margin: 0;}
.component-tree__drop-indicator--inside {margin: 6px 0 0;height: 32px;border-radius: 6px;border: 2px dashed rgba(var(--primary-rgb, 58, 96, 254), 0.6);background: rgba(var(--primary-rgb, 58, 96, 254), 0.08);box-shadow: inset 0 0 10px rgba(var(--primary-rgb, 58, 96, 254), 0.15);}

/* Drag and drop styles */
.component-tree ul li.is-dragging{opacity:0.5}
.component-tree__drop-indicator{position:fixed;z-index:10000;pointer-events:none;background:var(--primary);height:3px;border-radius:2px;transition:all 0.1s ease;display:none}
.component-tree__drop-indicator.is-child{background:rgba(var(--primary-rgb),0.1);border:2px solid var(--primary);border-radius:5px;height:auto}

/* Section separator */
.component-tree ul li.component-tree__section-separator{border-top:1px solid var(--border);margin-top:6px;padding-top:6px}
.component-tree ul li.component-tree__section-separator:first-child{border-top:none;margin-top:0;padding-top:0}


/*******************************************************/
/* Page Builder Settings
/*******************************************************/

.settings{font-size:12px}
.settings__heading{font-weight:bold;font-size:1.3em;margin:20px 0 20px 0;display:flex;gap:10px;align-items:center}
.settings__heading .settings__heading-text{flex:1}
.settings__heading .settings__heading-tools{display:flex;align-items:center;gap:3px;align-items:center}

.settings__description{margin:-10px 10px 20px 10px;padding:10px 10px;border:1px solid var(--border);border-radius:5px}

.settings__tabs{display:flex;gap:0px;margin:0 0 10px 0;gap:20px;border-bottom:2px solid var(--border);}
.settings__tabs:empty{display:none;}
.settings__tabs .settings__tab{padding:0 0px 10px 0px;cursor:pointer}
.settings__tabs .settings__tab--active{border-bottom:2px solid var(--primary);color:#000;margin:0 0 -2px 0;padding-bottom:9px}

.settings__sections{}
.settings__sections--hidden{display:none}
.settings__section--hidden{display:none}
.settings__section{border-bottom:1px solid var(--border)}
.settings__section--active{padding-bottom:16px}
.settings__section:not(:last-child){}
.settings__section-heading{font-size:14px;font-weight:600;padding:14px 15px 14px 0px;cursor:pointer;background-position:100% 15px;background-size:18px;background-repeat:no-repeat;background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24'%3E%3Cpath fill='%23999' d='m10 17l5-5l-5-5v10z'/%3E%3C/svg%3E");}
.settings__section--active .settings__section-heading{color:#000;background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m7 10l5 5l5-5z'/%3E%3C/svg%3E");}
.settings__sections .settings__section:only-child .settings__section-heading{background-image:none;}
.settings__fields{display:none}
.settings__section--active > .settings__fields{display:block;}

.settings__fields{}
.settings__fields .field:not(:last-child){}
.settings__fields .settings__fields{margin-bottom:20px}

.theme-tree{margin:0 -15px}
.theme-tree ul{margin:0;padding:0;list-style:none;}
.theme-tree ul li{margin:0;padding:0;}
.theme-tree ul li.type-group{font-size:13px;margin:0 0 15px 0}
.theme-tree ul li.type-group .type-header{text-transform:capitalize;font-weight:bold;margin:0 0 5px 0;background: var(--border-dark);padding:5px 10px;color:#000}
.theme-tree ul li ul.type-styles{cursor:pointer;padding:0 5px}
.theme-tree ul li ul.type-styles span{display:block;border-radius:100px;padding:2px 10px;border:1px solid transparent;}
.theme-tree ul li ul.type-styles span:hover{border:1px solid var(--border-dark);}
.theme-tree ul li ul.type-styles > li:not(:last-child){border-bottom:1px solid var(--border);padding:5px 0 5px 0;}
.theme-tree ul li ul.type-styles ul{margin:4px 0 7px 10px;}
.theme-tree ul li ul.type-styles ul li{font-size:12px;margin:0;border:none;position:relative;}
.theme-tree ul li ul.type-styles ul li:before{content:'∙';position:absolute;top:2px;left:2px;}
.theme-tree ul li ul.type-styles li.selected {font-weight: bold;color:#000}
.theme-tree ul li ul.type-styles li.selected > span{border-color: var(--background-dark);background:#fff}
.theme-tree ul li ul.type-styles li.selected li{font-weight:normal;color:var(--text)}


/*******************************************************/
/* Media
/*******************************************************/

.media-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}

@media only screen and (max-width: 1124px) {
  .media-grid{grid-template-columns:repeat(4,1fr);}
}

.media-item{background:#fff;box-shadow:0px 0px 4px rgba(0,0,0,0.2);border-radius:4px;cursor:pointer;position:relative}
.media-item--active{outline:2px solid var(--primary);}
.media-item--selected{outline:2px solid var(--danger) !important;}
.media-grid--multiselect .media-item{user-select:none;-webkit-user-drag:none}
.media-grid--multiselect .media-item *{-webkit-user-drag:none}
.media-item:hover{outline:1px solid var(--primary);}
.media-item__checkbox{position:absolute;top:6px;right:6px;z-index:1}
.media-item__checkbox input{width:18px;height:18px;cursor:pointer}
.media-item__preview{font-size:0;aspect-ratio:3/2;background-image: linear-gradient(45deg, #EFEFEF 25%, transparent 25%), linear-gradient(-45deg, #EFEFEF 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #EFEFEF 75%), linear-gradient(-45deg, transparent 75%, #EFEFEF 75%);background-size: 20px 20px;background-position: 0 0, 0 10px, 10px -10px, -10px 0px;}
.media-item__preview img{width:100%;height:100%;object-fit:contain;border-radius:4px 4px 0 0}
.media-item__summary{padding:10px 10px;display:flex;gap:5px;flex-direction:column}
.media-item__meta-filename{font-weight:bold;overflow-wrap:anywhere;}
.media-item__meta-extension{}
.media-item__meta-missing-alt{color:red;}

.media-detail{display:flex;gap:20px;}
.media-detail__preview{text-align:center;width:60%;position:relative}
.media-detail__preview img{max-width:100%;}
.media-detail__info{flex:1}
.media-detail__stats{padding:20px;display:grid;grid-template-columns:1fr;gap:20px;background: var(--background-light);border-radius:5px;margin:0 0 20px 0}
.media-detail__stats .media-detail__stat{}
.media-detail__stats .media-detail__stat strong{display:block;}

.files-upload-label{display:block;width:100%;height:50vh;border:2px dashed var(--border);position:relative;text-align:center;display:flex;align-items:center;justify-content:center}

.spinner {width: 100%;height:100%;display: flex;align-items: center;justify-content: center;}
.spinner svg{width:100%;height:100%;max-width:100px;max-height:100px}


/*******************************************************/
/* Dynamic Tags
/*******************************************************/

.dynamic-tags{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px, 1fr));gap:10px;}
.dynamic-tag{border:1px solid var(--border);border-radius:4px;pointer-events:cursor;text-align:center;cursor:pointer;display:flex;flex-direction:column;}
.dynamic-tag:hover{border:1px solid var(--border-dark)}
.dynamic-tag__tag{background: var(--background-light);font-size:11px;padding:5px 10px;border-bottom:1px solid var(--border);border-radius:4px 4px 0 0;overflow:hidden}
.dynamic-tag__preview{font-weight:bold;background: #fff;padding:10px 10px;border-radius:0 0 4px 4px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; }
.dynamic-tag__preview p{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;line-height:1.2}
.dynamic-tag__preview p:empty{display:none;}
.dynamic-tag__preview *{margin:0;}


[data-tooltip]:before,[data-tooltip]:after {position: absolute;left: 50%;transform: translate(-50%);-webkit-font-smoothing: antialiased;margin: 0 auto;opacity: 0;visibility: hidden;z-index: 9;transition: 0.1s ease-in-out 0.1s;pointer-events:none}
[data-tooltip]:before {content: "";height: 0;width: 0;top: calc(100% + 1px);border-style: solid;border-width: 5px;border-color: transparent transparent var(--background-dark) transparent;}
[data-tooltip]:after {content: attr(data-tooltip);white-space: nowrap;background: var(--background-dark);padding: 0.5rem 1rem 0.5rem 1rem;font-size: 12px;box-sizing: border-box;top: calc(100% + 11px);color: #fff;border-radius: 2px;text-shadow: 0px 1px 1px #000;z-index: 9;}
[data-tooltip]:hover:before,[data-tooltip]:hover:after {opacity: 1;visibility: visible;transition: 0.1s ease-in-out 0.1s;transition-delay: .75s}
[data-tooltip][data-tooltip-right]:before,[data-tooltip][data-tooltip-right]:after{left:auto;right:-10px;transform:none}
[data-tooltip][data-tooltip-right]:before{right:3px;}
[data-tooltip][data-tooltip-left]:before,[data-tooltip][data-tooltip-left]:after{left:-10px;transform:none}
[data-tooltip][data-tooltip-left]:before{left:3px;}

[data-tooltip][data-tooltip-top]:before{top:unset;bottom: calc(100% + 1px)}
[data-tooltip][data-tooltip-top]:after{top:unset;bottom: calc(100% + 11px)}


/*******************************************************/
/* Layouts
/*******************************************************/

.layouts{display:grid;gap:20px;}

.datatable{width:100%;border-collapse:collapse;margin-bottom:1.5em;border-top:1px solid var(--border)}
.datatable th{padding:10px 10px;text-align:left}
.datatable td{padding:10px 10px;text-align:left}
.datatable tr th, .datatable tr td{border-bottom:1px solid var(--border)}
.datatable tbody tr:first-child td{border-top:1px solid var(--border)}
.datatable tr:nth-child(odd) td{background: var(--background-light)}


/*******************************************************/
/* Bulk Edit Table
/*******************************************************/

.bulk-update-table{width:100%;border-collapse:collapse;margin-bottom:1.5em;border-top:1px solid var(--border)}

.bulk-update-table thead{position:sticky;top:0;background:#fff;z-index:2}

.bulk-update-table th{padding:15px 15px;text-align:left;border:1px solid var(--border);height:70px}
.bulk-update-table td{padding:10px 15px;border:1px solid var(--border);vertical-align:top}
.bulk-update-table tr th, .datatable tr td{}
.bulk-update-table tbody tr:first-child td{}
.bulk-update-table tr{border-left:1px solid #fff}
.bulk-update-table tr:nth-child(odd) td{background: var(--background-light)}
.bulk-update-table.bulk-update-table--filter-enabled tr td:not(.bulk-update-table--checkbox){pointer-events:none;}
.bulk-update-table.bulk-update-table--filter-enabled tr:not(.selected) td:not(.bulk-update-table--checkbox){opacity:.3;}
.bulk-update-table input{margin:0;padding:0;}

.bulk-update-table--editing-field{}
.bulk-update-table--editing-field{pointer-events:none}
.bulk-update-table--editing-field td{}
.bulk-update-table--editing-field td.editable-cell--current{}


.bulk-update-table--checkbox{width:50px;text-align:center !important}
.bulk-update-table--title{min-width:250px}
.bulk-update-table--title > .bulk-update-table--title-div{position:relative;font-weight:bold}
.bulk-update-table--meta-title{min-width:250px}
.bulk-update-table--meta-description{min-width:300px}
.bulk-update-table--nofollow{width:130px;text-align:center !important;vertical-align:middle !important}
.bulk-update-table--noindex{width:130px;text-align:center !important;vertical-align:middle !important}
.bulk-update-table--status{width:120px;;vertical-align:middle !important}
.bulk-update-table--action{width:60px;text-align:center !important;vertical-align:middle !important}


tr[data-level="0"] .bulk-update-table--title .bulk-update-table--title-div{padding-left:0px;}
tr[data-level="0"] .bulk-update-table--title .bulk-update-table--title-div::before { content: "";position:absolute;left:0px;top:0px}

tr[data-level="1"] .bulk-update-table--title .bulk-update-table--title-div{padding-left:20px;}
tr[data-level="1"] .bulk-update-table--title .bulk-update-table--title-div::before { content: "— ";position:absolute;left:0px;top:0px}

tr[data-level="2"] .bulk-update-table--title .bulk-update-table--title-div{padding-left:40px;}
tr[data-level="2"] .bulk-update-table--title .bulk-update-table--title-div::before { content: "—— ";position:absolute;left:0px;top:0px}

tr[data-level="3"] .bulk-update-table--title .bulk-update-table--title-div{padding-left:60px;}
tr[data-level="3"] .bulk-update-table--title .bulk-update-table--title-div::before { content: "——— ";position:absolute;left:0px;top:0px}


.editable{position:relative;}
.editable--focused{pointer-events:initial}

.editable-actions{pointer-events:none;margin:0 0 5px 0;position:absolute;top:0;right:0}
.editable-actions button{opacity:0}
.editable--focused button{opacity:1;}

.editable--focused .editable-actions{pointer-events:initial}

.textarea{border: none;outline: none;margin:0;padding:0 65px 0 0px;min-width:100%;background:none;font-family:inherit;font-weight:inherit}
.editable:hover:not(.editable--focused) .textarea{outline: 1px dotted var(--primary);outline-offset:3px}
.editable--focused .textarea{outline: 1px solid var(--primary);outline-offset:3px}

.lettercount{background:#fff;border-radius:100px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;padding:4px 6px;line-height:1;font-weight:bold;border:1px solid var(--border)}
.lettercount--hidden{opacity:0;}
.lettercount--green{background:#4caf50;color:#fff}
.lettercount--red{background:#f44336;color:#fff}



/*******************************************************/
/* Auth
/*******************************************************/

.auth{max-width:450px;margin:0 auto 50px auto;border-radius:4px;background:#fff;padding:40px 40px 40px 40px;}

.auth .or{display:flex;align-items:center;gap:10px;margin:10px 0}
.auth .or span{border-top:1px solid var(--border);flex:1}

.auth__logo{margin:0 0 20px 0;text-align:center}
.auth__logo:only-child{margin:0;}
.auth__logo img{width:200px;}

.auth__title{margin:0 0 20px 0;text-align:center}
.auth__title h1{font-size:30px;margin:0 0 10px 0}
.auth__title > *:last-child{margin-bottom:0;}

.auth__footer{margin:20px 0 0 0}
.auth__footer > *:last-child{margin-bottom:0;}

.auth-role-admin .username{cursor:pointer;text-decoration:underline;text-decoration-color: var(--border-dark);}
.auth-role-admin .username:hover{}