.elementor-widget-section .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-section .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-html .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-html .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}/* Start custom CSS for html, class: .elementor-element-d255521 *//* General Reset and Base */
    .smart-mikrotik-generator * {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    .smart-mikrotik-generator {
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        background-color: #f8f9fa; /* Off-white background */
        color: #343a40; /* Dark grey text */
        padding: 25px;
        border-radius: 12px;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        max-width: 850px;
        margin: 30px auto;
    }

    /* Header */
    .generator-header {
        text-align: center;
        margin-bottom: 30px;
        padding-bottom: 20px;
        border-bottom: 1px solid #dee2e6; /* Light grey border */
    }
    .generator-header h1 {
        font-size: 2.2em;
        color: #0d6efd; /* Modern blue */
        margin-bottom: 10px;
    }
    .generator-header p {
        font-size: 1.1em;
        color: #6c757d; /* Muted grey */
    }

    /* Form Sections */
    .config-section {
        background-color: #ffffff; /* White background for sections */
        padding: 25px;
        border-radius: 8px;
        margin-bottom: 25px;
        border: 1px solid #e9ecef; /* Lighter border */
    }
    .config-section h2 {
        font-size: 1.6em;
        color: #495057; /* Medium dark grey */
        margin-bottom: 20px;
        padding-bottom: 10px;
        border-bottom: 1px solid #f1f3f5;
    }

    /* Form Elements */
    .form-row { /* Digunakan untuk elemen yang mungkin butuh baris baru atau full width */
        display: flex;
        flex-wrap: wrap;
        gap: 20px; 
        margin-bottom: 5px; /* Mengurangi margin bawah agar lebih rapat jika ada beberapa form-row */
    }
    .form-row-align-start { /* Khusus untuk mensejajarkan elemen di awal baris */
        display: flex;
        flex-wrap: wrap; /* Agar responsif jika tidak cukup lebar */
        gap: 20px; /* Jarak antar elemen */
        align-items: flex-start; /* Sejajarkan item di atas */
        margin-bottom: 15px;
    }

    .form-group {
        flex: 1 1 100%; /* Default ke lebar penuh jika tidak diatur lain */
        margin-bottom: 15px; 
    }
    
    .form-group-inline { /* Untuk elemen yang ingin sejajar dan tidak full width*/
        flex: 1 1 auto; /* Biarkan ukuran natural, tapi bisa membesar jika ada ruang */
        min-width: 200px; /* Lebar minimal agar tidak terlalu sempit */
    }

    .form-group.half-width { /* Tetap ada jika dibutuhkan di tempat lain */
        flex: 1 1 calc(50% - 10px); 
    }
    .form-group.third-width {
        flex: 1 1 calc(33.333% - 14px); /* (gap*2)/3 = 13.33, dibulatkan jadi 14px */
    }


    .smart-mikrotik-generator label {
        display: block;
        margin-bottom: 8px;
        font-weight: 600;
        font-size: 0.95em;
        color: #495057;
    }

    .smart-mikrotik-generator input[type="text"],
    .smart-mikrotik-generator input[type="number"],
    .smart-mikrotik-generator select {
        width: 100%;
        padding: 12px 15px;
        border: 1px solid #ced4da; /* Medium grey border */
        border-radius: 6px;
        font-size: 1em;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
    .smart-mikrotik-generator input[type="text"]:focus,
    .smart-mikrotik-generator input[type="number"]:focus,
    .smart-mikrotik-generator select:focus {
        border-color: #0d6efd; /* Modern blue focus */
        box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
        outline: none;
    }
    
    /* Radio Button Styling */
    .radio-group-styled {
        display: flex; /* Membuat radio button sejajar */
        flex-wrap: wrap; /* Agar bisa turun baris jika tidak cukup ruang */
        gap: 10px;
        align-items: center;
        padding: 10px;
        border: 1px solid #ced4da;
        border-radius: 6px;
    }
    .radio-group-styled input[type="radio"] {
        opacity: 0; 
        position: fixed;
        width: 0;
    }
    .radio-group-styled .radio-label {
        display: inline-block;
        padding: 8px 15px;
        background-color: #e9ecef;
        color: #495057;
        border-radius: 5px;
        cursor: pointer;
        transition: background-color 0.3s ease, color 0.3s ease;
        font-weight: normal; 
        margin-bottom: 0; 
    }
    .radio-group-styled input[type="radio"]:checked + .radio-label {
        background-color: #0d6efd; 
        color: white;
    }
    .radio-group-styled .radio-label:hover {
        background-color: #d1d5db;
    }
    .radio-group-styled input[type="radio"]:checked + .radio-label:hover {
         background-color: #0b5ed7; 
    }


    /* ISP Group Styling */
    .isp-config-section fieldset.isp-group {
        border: 1px solid #dee2e6; 
        padding: 20px;
        margin-bottom: 20px;
        border-radius: 8px;
        background-color: #fdfdff; 
    }
    .isp-config-section legend {
        font-weight: 600;
        font-size: 1.2em;
        padding: 0 10px;
        color: #0d6efd; 
        margin-left: 10px;
    }

    /* Buttons Styling */
    .button {
        padding: 12px 22px;
        border: none;
        border-radius: 6px;
        cursor: pointer;
        font-size: 1.05em;
        font-weight: 600;
        text-decoration: none;
        display: inline-block;
        transition: background-color 0.2s ease, transform 0.1s ease;
        text-align: center;
    }
    .button:hover {
        opacity: 0.9;
    }
    .button:active {
        transform: translateY(1px);
    }

    .form-actions-footer {
        display: flex; /* Tetap flex untuk alignment di masa depan jika ada tombol lain */
        justify-content: center; /* Tombol di tengah */
        margin-top: 30px;
        padding-top: 20px;
        border-top: 1px solid #dee2e6;
    }
    .action-button {
        background-color: #0d6efd; 
        color: white;
    }
    .full-width-button { /* Class baru untuk tombol Generate */
        width: 100%;
        max-width: 300px; /* Batasi lebar maksimal tombol agar tidak terlalu besar di layar lebar */
    }
   
    .copy-button {
        background-color: #198754; 
        color: white;
        margin-top: 15px;
        width: 100%; 
    }

    /* Output Area */
    .output-section {
        margin-top: 30px;
        background-color: #ffffff;
        padding: 25px;
        border-radius: 8px;
        border: 1px solid #e9ecef;
    }
    .output-section h2 {
        font-size: 1.6em;
        color: #495057;
        margin-bottom: 15px;
    }
    .smart-mikrotik-generator textarea {
        width: 100%;
        padding: 15px;
        border: 1px solid #ced4da;
        border-radius: 6px;
        font-family: 'Courier New', Courier, monospace; 
        font-size: 0.95em;
        line-height: 1.6;
        background-color: #e9ecef; 
        color: #212529; 
        min-height: 300px; 
    }
    
    .generator-disclaimer {
    margin-top: 25px; /* Jarak dari tombol copy */
    padding: 15px;
    background-color: #fff3cd; /* Warna latar kuning muda untuk perhatian */
    border: 1px solid #ffeeba; /* Border kuning */
    border-radius: 6px;
    font-size: 0.9em;
    color: #856404; /* Warna teks coklat tua */
    }
    
    .generator-disclaimer p {
        margin-bottom: 10px;
        line-height: 1.5;
    }
    
    .generator-disclaimer p:last-child {
        margin-bottom: 0;
    }
    
    .generator-disclaimer strong {
        color: #721c24; /* Warna merah tua untuk kata "PERHATIAN" */
    }
    
    /* Responsive adjustments (basic) */
    @media (max-width: 768px) {
        .form-group.half-width, /* Jika masih digunakan di tempat lain */
        .form-group.third-width,
        .form-group-inline { /* Semua elemen inline akan jadi full width di mobile */
            flex-basis: 100%; 
            min-width: unset; /* Hapus min-width di mobile */
        }
         .form-row-align-start, .form-row {
            gap: 0; /* Hapus gap agar margin-bottom dari .form-group bekerja */
        }
        .full-width-button {
             max-width: 100%; /* Tombol jadi full width di mobile */
        }
    }/* End custom CSS */