/**
 * All of the CSS for your admin-specific functionality should be
 * included in this file.
 */

 h3 { font-size: 24px; font-weight: 400; margin-bottom: 20px; display: flex; align-items: center;}
 input[type="radio"] { margin-right: 10px; margin-left: 20px; }
 div.select_url { margin-top: 10px; margin-left: -20px;}
 #select_type {margin-left: 26px !important; }
 .select_div { margin-bottom: 3%; }
 #succ_page_id { margin-left: 10px; }
 .select_url input[type="text"] { width: 50%;margin-top: 5px; margin-left: 20px; box-sizing: border-box; }
 div.select_type, div.select_page { margin-top: 20px; }
 select { width: 50%; padding: 10px; margin-top: 5px; box-sizing: border-box; }
 input[type="hidden"] { display: none; }
 .wrapper_container_setting { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin-top: -15px; margin-bottom: 25px; }
 .wraaper_settings_custom_js { margin-top: 30px; }
 .input_wrraper_div_container { margin-left: -20px; }
 .input_wrraper_div_container_custom_js { margin-left: -18px; font-size: 15px; }
 .wrapper-container-header-spacing {margin-bottom: 10px;}
 
 .checkbox-wrapper-8 { margin-right: 40%; zoom: 1.3;}
 .checkbox-wrapper-8 .tgl { display: none; }
 .checkbox-wrapper-8 .tgl, .checkbox-wrapper-8 .tgl:after, .checkbox-wrapper-8 .tgl:before, .checkbox-wrapper-8 .tgl *, .checkbox-wrapper-8 .tgl *:after, .checkbox-wrapper-8 .tgl *:before, .checkbox-wrapper-8 .tgl+.tgl-btn { box-sizing: border-box; }
 .checkbox-wrapper-8 .tgl::-moz-selection, .checkbox-wrapper-8 .tgl:after::-moz-selection, .checkbox-wrapper-8 .tgl:before::-moz-selection, .checkbox-wrapper-8 .tgl *::-moz-selection, .checkbox-wrapper-8 .tgl *:after::-moz-selection, .checkbox-wrapper-8 .tgl *:before::-moz-selection, .checkbox-wrapper-8 .tgl+.tgl-btn::-moz-selection, .checkbox-wrapper-8 .tgl::selection, .checkbox-wrapper-8 .tgl:after::selection, .checkbox-wrapper-8 .tgl:before::selection, .checkbox-wrapper-8 .tgl *::selection, .checkbox-wrapper-8 .tgl *:after::selection, .checkbox-wrapper-8 .tgl *:before::selection, .checkbox-wrapper-8 .tgl+.tgl-btn::selection { background: none; }
 .checkbox-wrapper-8 .tgl+.tgl-btn { outline: 0; display: block; width: 4em; height: 2em; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
 .checkbox-wrapper-8 .tgl+.tgl-btn:after, .checkbox-wrapper-8 .tgl+.tgl-btn:before { position: relative; display: block; content: ""; width: 50%; height: 100%; }
 .checkbox-wrapper-8 .tgl+.tgl-btn:after { left: 0; }
 .checkbox-wrapper-8 .tgl+.tgl-btn:before { display: none; }
 .checkbox-wrapper-8 .tgl:checked+.tgl-btn:after { left: 50%; }
 .checkbox-wrapper-8 .tgl-skewed+.tgl-btn { overflow: hidden; transform: skew(-10deg); -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: all 0.2s ease; font-family: sans-serif; background: #888; }
 .checkbox-wrapper-8 .tgl-skewed+.tgl-btn:after, .checkbox-wrapper-8 .tgl-skewed+.tgl-btn:before { transform: skew(10deg); display: inline-block; transition: all 0.2s ease; width: 100%; text-align: center; position: absolute; line-height: 2em; font-weight: bold; color: #fff; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4); }
 .checkbox-wrapper-8 .tgl-skewed+.tgl-btn:after { left: 100%; content: attr(data-tg-on); }
 .checkbox-wrapper-8 .tgl-skewed+.tgl-btn:before { left: 0; content: attr(data-tg-off); }
 .checkbox-wrapper-8 .tgl-skewed+.tgl-btn:active { background: #888; }
 .checkbox-wrapper-8 .tgl-skewed+.tgl-btn:active:before { left: -10%; }
 .checkbox-wrapper-8 .tgl-skewed:checked+.tgl-btn { background: #37aa6d; }
 .checkbox-wrapper-8 .tgl-skewed:checked+.tgl-btn:before { left: -100%; }
 .checkbox-wrapper-8 .tgl-skewed:checked+.tgl-btn:after { left: 0; }
 .checkbox-wrapper-8 .tgl-skewed:checked+.tgl-btn:active:after { left: 10%; }
 
 #selected-file-container { margin-top: 20px; }
 #file-preview { display: flex; align-items: center; }
 #file-icon { margin-right: 10px; }
 #file-icon img { max-width: 50px; height: auto; }
 #file-info { margin-right: 10px; }
 #file-preview{ background: white; padding: 15px; }
 #file-image { margin-right: 10px; }
 #file-title, #file-name, #file-size { margin: 0; }
 .button_css_file{ float: right; margin: auto; }
 .button-add-site-icon { width: 100%; cursor: pointer; text-align: center; border: 1px dashed #c3c4c7; box-sizing: border-box; padding: 9px 0; line-height: 1.6; max-width: 270px }
 #remove-file-button { color: red; }
 
 .check_box_title { color: black; font-size: 18px; font-weight: 500;}
 .checkbox-wrapper-container { margin-right: 40%;}
 .checkbox-con { margin: 10px; display: flex; align-items: center; color: white; flex-direction: row; justify-content: space-between; }
 .toggle-switch { position: relative; display: inline-block; width: 80px; height: 40px; cursor: pointer; margin-left: 100px; }
 .toggle-switch-header { cursor: pointer;}
 .toggle-switch input[type="checkbox"] { display: none; }
 .toggle-switch-background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #ddd; border-radius: 20px; box-shadow: inset 0 0 0 2px #ccc; transition: background-color 0.3s ease-in-out; }
 .toggle-switch-handle { position: absolute; top: 5px; left: 5px; width: 30px; height: 30px; background-color: #fff; border-radius: 50%; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); transition: transform 0.3s ease-in-out; }
 .toggle-switch::before { content: ""; position: absolute; top: -25px; right: -35px; font-size: 12px; font-weight: bold; color: #aaa; text-shadow: 1px 1px #fff; transition: color 0.3s ease-in-out; }
 .toggle-switch input[type="checkbox"]:checked+.toggle-switch-handle { transform: translateX(45px); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2), 0 0 0 3px #05c46b; }
 .toggle-switch input[type="checkbox"]:checked+.toggle-switch-background { background-color: #05c46b; box-shadow: inset 0 0 0 2px #04b360; }
 .toggle-switch input[type="checkbox"]:checked+.toggle-switch:before { content: "On"; color: #05c46b; right: -15px; }
 .toggle-switch input[type="checkbox"]:checked+.toggle-switch-background .toggle-switch-handle { transform: translateX(40px); }
 
 
 .tooltip { position: relative; }
 .tooltip:after, .tooltip:before { opacity: 0; pointer-events: none; bottom: 100%; left: 50%; position: absolute; z-index: 10; transform: translate(-50%, 10px); transform-origin: top; transition: all 0.18s ease-out 0.18s; }
 .tooltip:after { background-color: white; box-shadow: 0 0 3px #2771b1; color: #2771b1; content: attr(data-tooltip); padding: 10px; white-space: nowrap; margin-bottom: 11px; }
 .tooltip:before { width: 0; height: 0; content: ""; margin-bottom: 6px; }
 .tooltip:hover:before, .tooltip:hover:after { opacity: 1; pointer-events: auto; transform: translate(-50%, 0); } [data-tooltip-pos="right"]:before, [data-tooltip-pos="right"]:after { bottom: auto; left: 100%; top: 50%; transform: translate(-10px, -50%); } [data-tooltip-pos="right"]:after { margin-left: 11px; } [data-tooltip-pos="right"]:hover:before, [data-tooltip-pos="right"]:hover:after { transform: translate(0, -50%); } [data-tooltip-length]:after { white-space: normal; }
 [data-tooltip-length="large"]:after { width: 260px; }
 .component--example{ margin-left:10px; }
 .cf7-ad-section { background-color: #fff3cd; border: 1px solid #ffeeba; padding: 20px; margin-top: 20px; border-radius: 5px; box-shadow: 0 1px 3px rgba(0, 0, 0, .1); }
 .cf7-ad-section h2 { color: #856404; margin-top: 0; margin-left: -13px !important; }
 .cf7-ad-section p { color: #856404; }
 .cf7-ad-section ul { list-style: disc; padding-left: 20px; margin: 0; }
 .cf7-ad-section ul li { color: #856404; margin-bottom: 5px; }
 .cf7-ad-section .button-primary { background-color: #856404; border-color: #856404; color: #fff; text-decoration: none; }
 .cf7-ad-section .button-primary:hover { background-color: #6c4a00; border-color: #6c4a00; }
 .mt20 { margin: 0px;}