:root { 
    --light-green: #48BB78; --green: #38A169;
    --light-red: #F56565; --red: #C53030;
    --light-yellow: #F6AD55; --yellow: #DD6B20;
     
    --pt-size: 60px;
}

table { text-align: left; }
hr { border-color: var( --light-gray ); }

html, body, .default-theme-body, .default-theme-page-content { height: 100%; }
.default-theme-body { display: flex; flex-direction: column; }
.fl-layout, .fl-layout-15, .fl-layout-25, .fl-layout-33, .fl-layout-50, 
.fl-layout-15-even, .fl-layout-25-even, .fl-layout-33-even, .fl-layout-50-even { height: 100%; }

.fl-layout { grid-gap: 2px; }

.fl-list-h li { padding: 12px; }
.fl-dd { border: 1px solid transparent; }
.fl-dd:hover { background-color: var( --light-gray ); border: 1px solid var( --gray ); border-radius: 6px; }
.fl-dd-list { background-color: var( --white ); margin-top: 12px; }

.fl-dd-hoverlist {  background-color: var( --white ); border: 1px solid var( --light-gray ); border-radius: 6px; }

.fl-dd-hoverlist > li { padding: 6px; border-left: 4px solid var( --white ); margin-top: 4px; margin-bottom: 4px; }
.fl-dd-hoverlist > li:hover { background-color: var( --light-gray ); }

.fl-dd-hoverlist > li:nth-child(4n + 1) { border-left: 4px solid var( --light-gray ); }
.fl-dd-hoverlist > li:hover:nth-child(4n + 1) { border-left: 4px solid var( --gray ); }
.fl-dd-hoverlist > li:nth-child(4n + 2) { border-left: 4px solid var( --light-gray ); }
.fl-dd-hoverlist > li:hover:nth-child(4n + 2) { border-left: 4px solid var( --gray ); }
.fl-dd-hoverlist > li:nth-child(4n + 3) { border-left: 4px solid var( --light-gray ); }
.fl-dd-hoverlist > li:hover:nth-child(4n + 3) { border-left: 4px solid var( --gray ); }
.fl-dd-hoverlist > li:nth-child(4n) { border-left: 4px solid var( --light-gray ); }
.fl-dd-hoverlist > li:hover:nth-child(4n) { border-left: 4px solid var( --gray ); }

.fl-dd-small { min-width: 250px; }

.tc-auto-search-highlight { background-color: var( --gray ); }
.tc-auto-search-results { background-color: var( --light-gray ); }
.tc-auto-search-items { padding: 6px; }
.tc-auto-search-results-all { padding: 6px; text-align: right; }

.dt-controls-save-container { }
.dt-loading { }
.dt-details-control { cursor: pointer; text-align: left; }
.dt-controls-cancel { }
.dt-controls-save { }
.dt-controls-select { }
.dt-controls-text { }

.dialog { border: none; background-color: #ffffff; border-radius: 6px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2); max-width: 90%; overflow: hidden; }
.dialog-background { opacity: 0.65; background-color: #333333; position: fixed;
    top: 0; left: 0; right: 0; bottom: 0; }
.dialog-header { display: flex; justify-content: space-between; align-items: center;
    padding: 10px; border-bottom: 1px solid var( --blue ); }
.dialog-content { padding: 20px; }
.dialog-title { font-size: 20px; font-weight: 700; color: black; margin: 0; }
.dialog-close { font-size: 20px; color: #888888; cursor: pointer; background: none;  border: none;
    padding: 14px; transition: color 0.2s; }
.dialog-close:hover { color: #333333; }
.dialog-controls { padding: 10px; border-top: 1px solid var( --gray ); display: flex;
	justify-content: flex-end; gap: 10px; background-color: var( --light-gray ); }
.dialog-controls button { padding: 10px; border-radius: 6px; font-size: 14px; cursor: pointer;
    transition: background-color 0.2s, border-color 0.2s; font-weight: 600; width: auto; margin-left:0px; }
.dialog-controls-cancel, .dialog-controls-ok { background-color: #6c757d; color: white;
    border: 1px solid #6c757d; }
.dialog-controls-cancel:hover, .dialog-controls-ok:hover { background-color: #5a6268;
    border-color: #5a6268; }

.default-theme-messages { margin: 20px; }
.default-theme-messages-error { background-color: #ffebeb; border: 1px solid #ff4d4f;
    color: #cf1322; padding: 10px; margin-bottom: 10px; border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08); display: flex; align-items: center;
    font-size: 16px; font-weight: 500; }
.default-theme-messages-error .error-icon { margin-right: 12px; color: #ff4d4f; }
.default-theme-messages-ok { background-color: #f6ffed; border: 1px solid #52c41a; color: #237804; 
    padding: 10px; margin-bottom: 10px; border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08); display: flex; align-items: center;
    font-size: 16px; font-weight: 500; }
.default-theme-messages-ok .success-icon { margin-right: 12px; color: #52c41a; }

.action-menu-container { position: relative; display: inline-block; }
.action-menu-toggle { background: none !important; border: 1px solid transparent !important; padding: 6px 10px;
    font-size: 16px; color: #555 !important; cursor: pointer; border-radius: 4px; transition: all 0.2s; }
.action-menu-container:hover .action-menu-toggle { border-color: #e6e6e6 !important; color: var(--blue) !important; }
.action-menu-dropdown { display: none; position: absolute; top: 100%; right: 0; z-index: 100; min-width: 180px;
    background-color: #fff; border: 1px solid #ddd; border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); padding: 5px 0; margin-top: 5px; }
.action-menu-dropdown.pop-up { top: auto; bottom: 100%; margin-bottom: 5px; }
.action-menu-dropdown .dropdown-item { width: 100%; text-align: left; background: none; border: none; padding: 10px;
    font-size: 14px; color: #333; cursor: pointer; display: flex; align-items: center;
    gap: 10px; transition: background-color 0.15s; }
.action-menu-dropdown .dropdown-item:hover { background-color: #eee; color: var(--blue); }
.action-menu-dropdown .dropdown-item i { font-size: 14px; color: #888; width: 18px; }
.action-menu-dropdown .dropdown-item.remove-action i { color: #dc3545; }

.default-theme-content-left, .default-theme-content-right { max-width: 250px; min-width: 250px !important; }
.default-theme-nb { font-size: 18px; width: 100%; }
.default-theme-header:first-child { border-top: 1px solid var( --light-gray ); }
.default-theme-nb-header > li { border: 1px solid transparent; }
.default-theme-nb-header > li:hover { background-color: var( --gray ); border: 1px solid var( --gray ); color: var( --white ); border-radius: 6px; }
.default-theme-nb-header-item { color: var( --black ); }

.default-theme-content { border-top: 1px solid var( --gray ); height: 100%; }
.default-theme-content-left { border-top: 1px solid var( --gray ); border-right: 1px solid var( --gray ); }
.default-theme-content-right, .default-theme-content-left { border-top: 1px solid var( --gray ); }

.default-theme-currency { padding: 6px; text-align:right !important; }
.default-theme-currency > a { text-align:center; font-weight: bold; padding: 6px; background-color: var( --gray ); border: 1px solid var( --gray ); color: #fff; border-radius: 4px; }
.default-theme-currency > a:hover { opacity: 0.8; }

.default-theme-ratings { color: var( --light-gray ); }
.tc-rating-hilight { opacity: 1 !important; color: var( --gray ); }

.fl-pagination { background-color: #fff; text-align: center; }
.fl-pagination a { font-size: 18px; color: var( --black ); font-weight: bold; border: 1px solid transparent; 
border-radius: 6px; padding: 12px; padding-left: 16px; padding-right: 16px; width: auto; }
.fl-pagination a:hover { background-color: var( --gray ); border: 1px solid var( --gray ); color: var( --white ); }

.fl-forms, .fl-forms input, .fl-forms button, .fl-forms textarea, .fl-forms select, 
.fl-forms fieldset, .fl-forms input[type=submit], .fl-forms input[type=button], 
.fl-forms label { padding-top: 12px; padding-bottom: 12px; font-weight: bold; font-size: var( --txl ); }
.fl-forms textarea, .fl-forms select { border: 1px solid #ccc; border-radius: 6px; font-size: 16px; background-color: #fff;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05); transition: box-shadow 150ms ease, border-color 150ms ease; }
.fl-forms input[type=text]:focus, .fl-forms input[type=password]:focus, .fl-forms input[type=email]:focus, 
.fl-forms textarea:focus, .fl-forms select:focus { }
.fl-forms input[type=submit], .fl-forms input[type=button], 
.fl-forms button { background-color: var( --gray ); border: 1px solid var( --gray ); color: var( --white ); border-radius: 6px; }
.fl-forms input[type=submit]:hover, .fl-forms input[type=button]:hover, 
.fl-forms button:hover { opacity: 0.8; }
.fl-forms textarea, .fl-forms select, .fl-forms input[type=text], .fl-forms input[type=password] { font-weight: normal; }

.fl-btn { display: inline-block; padding: 12px; background-color: var( --gray ); border: 1px solid var( --gray ); 
color: #fff !important; border-radius: 6px; font-size: 18px; font-weight: bold; text-align:center; }
.fl-btn:hover { opacity: 0.8; }
    
.tc-tabs > ul > li > a { font-size: 18px; font-weight: bold; }
.tc-selected-tab { padding: 12px; background-color: var( --light-gray ); border: 1px solid var( --light-gray ) !important;  }
.tc-unselected-tab { padding: 12px; background-color: var( --light-gray ); color: var( --black ); }
.tc-unselected-tab:hover { background-color: var( --light-gray ); }
.tc-tabs > div { border-top: 1px solid var( --light-gray ); }

.tc-accordion > li > a { display: block; font-weight: bold; padding: 12px; 
   background-color: var( --white ); color: var( --black ); }
.tc-accordion > li > a:hover { background-color: var( --light-gray ); }
.tc-accordion > li > ul > li > a { background-color: var( --white ); color: var( --black ); }
.tc-accordion > li > ul > li > a:hover { background-color: var( --light-gray ); }

.fl-tooltip > span { color: #fff; background-color: var( --black ); border-radius: 4px; font-weight: bold; text-align: center; }
.fl-tip-top:hover span:after { border-top-color: var( --black ); }

.tc-character-counter-error { color: var( --red ); }
.tc-character-counter-warn { color: var( --yellow ); }
.tc-character-counter-ok { color: var( --green ); }    

.fl-layout-width-30 { flex-basis: 40%; min-width: 40%; }
.default-theme-banner { width: 300px; margin-left: -2px; }
.default-theme-logo { width: 100px; margin-top: -2px; display: inherit; margin-right: auto; margin-left: auto; }

.default-theme-banner-container { display: flex; align-items: center; }

.pages-content { padding: 12px; }
.pages-content ul, .pages-content ol { margin-left: 12px; }

.btn-icon { padding: 6px; background-color: var( --gray ); border: 1px solid var( --gray ); color: var( --white ); 
    border-radius: 6px; font-size: 20px; cursor: pointer; }
.btn-icon:hover { background-color: var( --light-gray ); border: 1px solid var( --light-gray ); color: var( --white ); }
.btn-icon:visited { color: var( --white ); }

.fl-line-lg { border-color: var( --gray ); margin-top: 20px; margin-bottom: 20px; }

.plugin-navigation-menu { margin-bottom: 4px; }
.plugin-navigation-menu-header { display: block; font-weight: bold; font-size: 16px; color: var( --black ); padding: 12px; background-color: var( --light-gray ); }
.plugin-navigation-menu > a { display: block; font-weight: bold; font-size: 16px; color: var( --black ); 
padding: 12px; border-left: 4px solid var( --light-gray ); }
.plugin-navigation-menu > a:hover { background-color: var( --light-gray ); border-left: 4px solid var( --gray ); }

.tc-editor { width: 100%; border: 1px solid #ddd; border-radius: 4px; background-color: #ffffff; }
.tc-editor-layout { height: 100%; background-color: white; }
.tc-editor-layout-editor { height: 100%; }
.tc-editor-menu { display: inline-flex; align-items: center; gap: 2px; }
.tc-editor-menu-divider { border-right: 1px solid #eee; padding-right: 6px; margin-right: 6px; }
.tc-editor-menu-item { display: flex; align-items: center; justify-content: center; border: none; border-radius: 4px; cursor: pointer; color: #555; transition: background-color 0.2s, color 0.2s; }
.tc-editor-menu-item:hover { background-color: #f0f0f0; border: none; }
.tc-editor-menu-item i.material-icons { font-size: 20px; padding: 4px; }
.tc-editor-controls-display { display: block; }
.tc-editor-menu-item-container .tc-editor-menu-item select { border: none; background: transparent; padding: 0 4px; margin-left: 5px; height: 20px; font-size: 13px; }
.tc-editor-menu-item select:focus { border: none; background: transparent; box-shadow: none; }
.tc-editor-frame { border: 1px solid #ddd; height: 100% !important; border-radius: 6px; }
.tc-editor-layout td { border: 0px; padding: 0px;}
.tc-editor-layout tr:hover { background-color: transparent; }
.tc-editor-controls { border: 1px solid #ccc; background-color: white; border-radius: 4px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); min-width: 245px; }
.tc-editor-color-buttons { display: block; width: 20px; height: 20px; border-radius: 3px; border: 1px solid #eee !important; margin: 1px; transition: transform 0.1s; }
.tc-editor-color-buttons:hover { border: 1px solid #999 !important; transform: scale(1.1); }
.tc-editor-grid { border-collapse: separate; border-spacing: 2px; }
.tc-editor-controls-buttons input[type=button] { display: inline-block; padding: 8px; margin-left: 5px; border: none; border-radius: 4px; cursor: pointer; font-size: 13px; }
.tc-editor-controls-ok { background-color: var(--blue); color: white; }
.tc-editor-controls-cancel { background-color: #e0e0e0; color: #333; }

/* Smartphones in portrait */
@media (min-width: 0px) and (max-width: 479px) { 
  .default-theme-content-left, .default-theme-content-right { max-width: inherit; }
  .fl-forms-columns, .fl-forms-column { display: block; }
  .default-theme-currency { text-align: center !important; }
  .default-theme-banner { margin-left: auto; margin-right: auto; }
  .default-theme-banner-container { display: inline-flex; }
}

/* Smartphones in landscape */
@media (min-width: 480px) and (max-width: 767px) { 
   .default-theme-content-left, .default-theme-content-right { max-width: inherit; }
   .default-theme-currency { text-align: center !important; }
   .default-theme-banner { margin-left: auto; margin-right: auto; }
   .default-theme-banner-container { display: inline-flex; }
}