/* Default Theme Variables (Light Theme) - Premium Redesign */
:root {
    font-family: 'Arial', sans-serif;
    --primary-color: #007AFF; /* iOS Blue */
    --primary-hover: #0056b3;
    --primary-light: rgba(0, 122, 255, 0.1);
    --success-color: #34C759; /* iOS Green */
    --danger-color: #FF3B30; /* iOS Red */
    --warning-color: #FF9500; /* iOS Orange */
    --background-color:  #f1f3f5; /* Body uses card background directly */
    --card-background: #FFFFFF;
    --text-color: #1C1C1E; /* Near Black */
    --text-secondary-color: #636366; /* Gray */
    --border-color: rgba(60, 60, 67, 0.29); /* Subtle Border */
    --input-background: #f1f3f5;
    --input-border-color: rgba(60, 60, 67, 0.2);
    --input-focus-border: var(--primary-color);
    --shadow-color: rgba(0, 0, 0, 0.1);
    --glass-background: rgba(248, 248, 250, 0.85); /* More opaque glass */
    --secondary-color: #8E8E93; /* iOS Secondary Gray */
    --secondary-hover: #636366;
    --avatar-background: #E5E5EA;
    --log-info-color: var(--primary-color);
    --log-success-color: var(--success-color);
    --log-error-color: var(--danger-color);
    --log-warning-color: var(--warning-color);
    --log-timestamp-color: var(--text-secondary-color);
    --modal-overlay-color: rgba(0, 0, 0, 0.5); /* Lighter overlay */
    --outline-btn-color: var(--primary-color);
    --outline-btn-hover-bg: var(--primary-light);
    --card-border-radius: 14px; /* Slightly larger radius */
    --input-border-radius: 10px;
    --button-border-radius: 10px;
    --form-shadow: 0 8px 24px rgba(0, 0, 0, 0.06); /* Softer shadow */
    --premium-gradient: linear-gradient(180deg, #F9F9FC 0%, #F2F2F7 100%); /* Subtle vertical gradient */
    --transition-standard: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --font-family-sans: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
}

/* Tema Escuro - Premium Redesign */
@media (prefers-color-scheme: dark) {
    :root {
        font-family: 'Arial', sans-serif;
        --primary-color: #0A84FF; /* iOS Dark Blue */
        --primary-hover: #3395ff;
        --primary-light: rgba(10, 132, 255, 0.15);
        --success-color: #30D158; /* iOS Dark Green */
        --danger-color: #FF453A; /* iOS Dark Red */
        --warning-color: #FF9F0A; /* iOS Dark Orange */
        --background-color: #151718; /* Body uses card background directly */
        --card-background: #1C1C1E; /* Dark Gray */
        --text-color: #FFFFFF;
        --text-secondary-color: #8E8E93; /* Lighter Gray */
        --border-color: rgba(84, 84, 88, 0.65); /* Darker Subtle Border */
        --input-background: #151718;
        --input-border-color: rgba(84, 84, 88, 0.5);
        --shadow-color: rgba(0, 0, 0, 0.3);
        --glass-background: rgba(28, 28, 30, 0.85); /* Dark Glass */
        --secondary-color: #8E8E93;
        --secondary-hover: #b0b0b3;
        --avatar-background: #3A3A3C;
        --log-timestamp-color: var(--text-secondary-color);
        --modal-overlay-color: rgba(0, 0, 0, 0.7);
        --outline-btn-color: var(--primary-color);
        --outline-btn-hover-bg: var(--primary-light);
        --form-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
        --premium-gradient: linear-gradient(180deg, #0a0a0a 0%, #000000 100%);
        --contact-detail-color-dark: var(--text-secondary-color);
        --placeholder-color-dark: #5a5a5e; /* Adjusted dark placeholder */
    }

     /* Dark mode placeholder style */
    .ql-editor.ql-blank::before {
        color: var(--placeholder-color-dark) !important;
        font-style: italic; /* Make placeholder italic */
    }

    /* Dark mode scrollbar styling for relevant elements */
    .contact-preview-list::-webkit-scrollbar,
    .log-area::-webkit-scrollbar,
    #editor-container::-webkit-scrollbar, /* Add for resizable editor */
    emoji-picker::-webkit-scrollbar {
        width: 8px;
        height: 8px; /* For horizontal scrollbars if they appear */
    }
    .contact-preview-list::-webkit-scrollbar-track,
    .log-area::-webkit-scrollbar-track,
    #editor-container::-webkit-scrollbar-track,
    emoji-picker::-webkit-scrollbar-track {
        background: transparent; /* Make track transparent */
        border-radius: 4px;
    }
     .contact-preview-list::-webkit-scrollbar-thumb,
     .log-area::-webkit-scrollbar-thumb,
     #editor-container::-webkit-scrollbar-thumb,
     emoji-picker::-webkit-scrollbar-thumb {
        background-color: var(--secondary-color); /* Thumb color */
        border-radius: 4px;
        border: 2px solid var(--input-background); /* Match track background */
    }
     .contact-preview-list::-webkit-scrollbar-thumb:hover,
     .log-area::-webkit-scrollbar-thumb:hover,
     #editor-container::-webkit-scrollbar-thumb:hover,
     emoji-picker::-webkit-scrollbar-thumb:hover {
        background-color: var(--primary-hover); /* Hover color */
    }
}

/* Estilos Base - Premium Redesign */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-family-sans);
    background-color: var(--background-color);
    color: var(--text-color);
    min-height: 100vh;
    display: flex;
    align-items: flex-start; /* Align container to top */
    justify-content: center;
    padding: 0; /* Remove body padding */
    line-height: 1.6; /* Improved readability */
}

.container {
    max-width: 1280px; 
    width: 100%;
    /* Removed background, backdrop-filter, box-shadow, border */
    border-radius: 0; /* Remove radius */
    padding: 2.5rem 3rem; /* Keep padding for content spacing */
    display: flex;
    flex-direction: column;
    animation: fadeIn 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    margin: 0 auto; /* Center container horizontally */
    position: relative;
    /* overflow: hidden; Keep or remove based on testing */
}


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

/* Header - Premium Redesign */
.header {
    display: flex;
    align-items: center;
    justify-content: space-between; /* Align title left, potential elements right */
    padding-bottom: 1.5rem; /* Increased padding */
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 2.5rem; /* Increased margin */
    position: relative;
}

/* Removed header::after gradient line */

.header h2 {
    font-size: 1.25rem; /* Slightly larger */
    font-weight: 600; /* SF Pro uses 600 for boldish */
    color: var(--text-color); /* Use standard text color */
    display: flex;
    align-items: center;
    gap: 0.8rem;
    letter-spacing: -0.01em; /* Subtle tightening */
    /* Removed gradient text */
}

.header h2 i {
    color: var(--primary-color); /* Icon uses primary color */
    font-size: 1.6rem; /* Adjust icon size */
}

/* Two Column Grid Layout */
.main-content {
    display: grid;
    /* Adjusted column sizing - Give right panel more relative space */
    grid-template-columns: minmax(400px, 1fr) minmax(400px, 1fr); /* Equal proportion, min width 400px */
    gap: 3rem; /* Consistent gap */
    width: 100%;
    align-items: start;
    transition: var(--transition-standard);
}

@media (max-width: 1024px) {
    .main-content {
        gap: 2rem; /* Reduced gap for medium screens */
    }
}

/* Form Panel - Premium Redesign */
.form-panel {
    display: flex;
    flex-direction: column;
    gap: 1.5rem; /* Consistent gap */
    background: var(--card-background);
    border-radius: var(--card-border-radius);
    padding: 2rem 2.2rem; /* Adjusted padding */
    box-shadow: var(--form-shadow);
    border: 1px solid var(--border-color);
    position: relative;
    min-height: 0;
    transition: var(--transition-standard);
    overflow: visible; /* Allow potential overflows like focus rings */
}

.form-panel:hover {
     /* Subtle shadow enhancement on hover */
    /* transform: translateY(-3px); Explicitly removed */
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

/* Removed form-panel::before and ::after */

#mass-message-form {
    display: flex;
    flex-direction: column;
    /* gap: 1.5rem; Gap between form groups */
}

/* Preview Panel (Container for Contact Preview) - Premium Redesign */
.preview-panel {
    position: sticky; 
    top: 2.5rem; /* Adjusted sticky top position */
    height: calc(100vh - 5rem); /* Adjusted height calculation */
    max-height: 80vh; /* Adjusted max-height */
    display: flex; 
    flex-direction: column; /* Ensure vertical layout */
    align-self: start; 
}

/* Form Group - Premium Redesign */
.form-group {
    margin-bottom: 1.5rem; /* Increased spacing */
}

/* Label - Premium Redesign */
label {
    display: block;
    margin-bottom: 0.6rem; /* Increased spacing */
    font-weight: 500; /* Slightly lighter weight */
    font-size: 0.9rem; /* Slightly smaller */
    color: var(--text-secondary-color); /* Use secondary text color */
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

label i {
    color: var(--secondary-color); /* Icon uses secondary color */
    font-size: 0.9rem; /* Adjust icon size */
}

/* Input, Select, Textarea - Premium Redesign */
/* input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
select,
textarea */

input, select, textarea {
    width: 100%;
    padding: 0.9rem 1.1rem; /* Increased padding */
    border: 1px solid var(--input-border-color); /* Use specific input border color */
    border-radius: var(--input-border-radius);
    background: var(--input-background);
    color: var(--text-color);
    font-size: 1rem; /* Standard base font size */
    font-family: var(--font-family-sans); /* Ensure font consistency */
    transition: border-color var(--transition-standard), box-shadow var(--transition-standard);
    box-shadow: none; /* Remove default inner shadow */
    /* appearance: none; Remove default styling */
    /* -webkit-appearance: none; */
    -moz-appearance: none;
}
/* Estilo opcional para checkbox */
input[type="checkbox"] {
    width: auto;
    padding: 0;
    margin-right: 0.5rem; /* Espaço entre o checkbox e o label */
    accent-color: var(--primary-color); /* Cor customizada */
    cursor: pointer;
}
select{
    -webkit-appearance: none; /* Remove default arrow in WebKit browsers */
    -moz-appearance: none; /* Remove default arrow in Firefox */
    appearance: none; /* Remove default arrow in other browsers */
    background-color: var(--input-background); /* Ensure consistent background */
    background-image: none; /* Remove any default background image */
}

input:hover, select:hover, textarea:hover {
    border-color: var(--secondary-color); /* Subtle hover border */
}

select {
    cursor: pointer; /* Ensure pointer cursor for dropdown */
}

input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--input-focus-border); /* Use primary color for focus border */
    /* Subtle focus ring */
    box-shadow: 0 0 0 3px var(--primary-light); 
}

/* Select Specific Styles - Premium Redesign */
select {
    /* Custom arrow using SVG, themed with primary color */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23007AFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1.1rem center; /* Adjusted position */
    background-size: 1.1rem; /* Adjusted size */
    padding-right: 3rem; /* Ensure space for arrow */
}

/* Dark mode select arrow */
@media (prefers-color-scheme: dark) {
    select {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230A84FF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    }
}

/* Drag and Drop Area - Premium Redesign */
.drop-zone {
    border: 1px dashed var(--input-border-color); /* Use input border color, dashed */
    border-radius: var(--input-border-radius);
    padding: 2.5rem; /* Increased padding */
    text-align: center;
    cursor: pointer;
    transition: var(--transition-standard);
    position: relative;
    background-color: transparent; /* Make background transparent */
    overflow: hidden;
}

.drop-zone:hover {
    border-color: var(--primary-color);
    background-color: var(--primary-light); /* Use light primary background on hover */
}

.drop-zone.drag-over {
    border-color: var(--primary-color);
    border-style: solid; /* Solid border when dragging over */
    background-color: var(--primary-light);
    transform: none; /* Remove scale effect */
}

.drop-zone-text {
    color: var(--text-secondary-color);
    font-size: 0.95rem;
    font-weight: 500;
}

.drop-zone-input {
    position: absolute;
    inset: 0; /* Cover entire area */
    opacity: 0;
    cursor: pointer;
}

/* File Name Display - Premium Redesign */
.file-name-display {
    margin-top: 0.8rem; /* Adjusted spacing */
    font-size: 0.9rem;
    color: var(--success-color);
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center; /* Center the text */
    gap: 0.5rem;
}

.file-name-display i {
    font-size: 1rem;
}

/* Attachment Preview Styles */
.attachment-preview {
    display: block; /* Ensure it takes its own line */
    margin-top: 0.8rem; /* Space above the preview */
    max-width: 100%; /* Don't exceed container width */
    height: auto; /* Maintain aspect ratio */
    border-radius: 8px; /* Slightly rounded corners */
    object-fit: contain; /* Ensure the whole image/audio player is visible */
}

.image-preview {
    width: 80px; /* Define width for square */
    height: 80px; /* Define height for square */
    object-fit: cover; /* Crop the image to fit */
    cursor: pointer; /* Indicate it's clickable */
    transition: transform 0.2s ease; /* Add slight transition */
}

/* .image-preview duplicado removido */

.image-preview:hover {
    transform: scale(1.05); /* Slight zoom on hover */
}

.audio-preview {
    max-height: 60px; /* Limit height for audio player */
    width: 100%; /* Make audio player take full width */
}


/* Rich Text Editor Styles - Premium Redesign */
.message-input-wrapper {
    position: relative;
    display: flex; /* Use flex for better alignment */
    flex-direction: column; /* Stack editor and toolbar */
    height: auto;
    margin-bottom: 0; /* Remove bottom margin, handled by form gap */
}

/* Quill Editor Container - Premium Redesign */
#editor-container {
    min-height: 150px; /* Increased min-height */
    height: 150px; /* Increased initial height */
    border-radius: var(--input-border-radius);
    background: var(--input-background);
    resize: vertical; 
    overflow: auto; 
    color: var(--text-color);
    font-size: 1rem; /* Match input font size */
    line-height: 1.6; /* Match body line height */
    font-family: var(--font-family-sans); /* Use main font */
    border: 1px solid var(--input-border-color); /* Use input border */
    transition: border-color var(--transition-standard), box-shadow var(--transition-standard);
    order: 1; /* Editor comes first */
    margin-bottom: 0.5rem; /* Space between editor and toolbar */
}

/* Override Quill's default styles */
.ql-toolbar.ql-snow {
    display: none; 
}

.ql-container.ql-snow {
    border: none !important; /* Remove Quill's border */
    border-radius: 0; /* Remove Quill's radius */
    font-family: inherit;
}

.ql-editor {
    padding: 0.9rem 1.1rem; /* Match input padding */
    min-height: 80px; /* Adjusted min-height for content area */
    background-color: var(--input-background);
}

#editor-container:focus-within { /* Style container when editor has focus */
    outline: none;
    border-color: var(--input-focus-border);
    box-shadow: 0 0 0 3px var(--primary-light);
}

.ql-editor p {
    margin-bottom: 0.8rem; /* Slightly more space between paragraphs */
}

/* WhatsApp Format Toolbar - Premium Redesign */
.whatsapp-format-toolbar {
    display: flex;
    gap: 0.5rem; /* Slightly increased gap */
    padding: 0; /* Remove padding */
    border-top: none;
    margin-top: 0; /* Remove margin */
    order: 2; /* Toolbar comes after editor */
    justify-content: flex-start; /* Align to start */
}

.format-button {
    color: var(--secondary-color);
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: none;
    border: 1px solid var(--border-color);
    border-radius: var(--input-border-radius);
    transition: 0.2s;
}

.format-button:hover {
    background-color: var(--primary-light); /* Use light primary background */
    color: var(--primary-color);
    border-color: transparent; /* Keep border transparent on hover */
}

.format-button i { 
   pointer-events: none; 
   font-size: 1.1rem; /* Slightly larger icons */
}

.format-button.active {
    background-color: var(--primary-color);
    color: white;
    border-color: var(--primary-color);
}

/* Placeholder List Container */
.placeholder-list-container {
    position: absolute;
    bottom: 50px; /* Position above the toolbar */
    right: 50px; /* Position near the placeholder button */
    z-index: 1100; /* Same as emoji picker */
    background: var(--card-background);
    border: 1px solid var(--border-color);
    border-radius: var(--card-border-radius);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    padding: 0.8rem 0; /* Padding inside the container */
    animation: fadeInUp 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    width: 250px; /* Adjusted width for the list */
    max-height: 200px; /* Max height before scrolling */
    overflow-y: auto; /* Enable scrolling */
}

/* Estilização da barra de rolagem para placeholder-list-container */
.placeholder-list-container::-webkit-scrollbar {
    width: 10px;
}

.placeholder-list-container::-webkit-scrollbar-track {
    background: var(--card-background);
    border-radius: var(--card-border-radius);
}

.placeholder-list-container::-webkit-scrollbar-thumb {
    background-color: var(--secondary-color);
    border-radius: var(--card-border-radius);
    border: 2px solid var(--card-background);
}

.placeholder-list-container::-webkit-scrollbar-thumb:hover {
    background-color: var(--primary-color);
}

/* Firefox */
.placeholder-list-container {
    scrollbar-width: thin;
    scrollbar-color: var(--secondary-color) var(--card-background);
}

.placeholder-list-container:hover {
    scrollbar-color: var(--primary-color) var(--card-background);
}

.placeholder-list-container.hidden {
    display: none;
}

.placeholder-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.placeholder-list li {
    padding: 0.6rem 1.2rem; /* Padding for each list item */
    cursor: pointer;
    font-size: 0.9rem;
    color: var(--text-color);
    transition: background-color 0.2s, color 0.2s;
}

.placeholder-list li:hover {
    background-color: var(--primary-light);
    color: var(--primary-color);
}

/* Ajuste do tamanho do container de mensagens prontas */
#canned-responses-container {
    width: 350px; /* Maior largura */
    max-height: 400px; /* Maior altura */
    display: flex;
    flex-direction: column;
    height: 400px; /* Fixar altura para layout flex */
}

/* Estilo da barra de pesquisa dentro do container de mensagens prontas */
#canned-responses-search {
    width: 100%;
    padding: 0.7rem 0.8rem;
    margin-top: 0.5rem;
    margin-bottom: 0.8rem;
    border: 1px solid var(--input-border-color);
    border-radius: var(--input-border-radius);
    font-size: 0.9rem;
    color: var(--text-color);
    background-color: var(--input-background);
    box-sizing: border-box;
}
/* Estilos para o container de mensagens prontas */
.canned-responses-header {
    padding: 0.8rem 1.2rem;
    border-bottom: 1px solid var(--border-color);
    flex-shrink: 0; /* Não encolher */
}

#canned-responses-container.hidden {
    display: none;
}

.canned-responses-header h4 {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-color);
}

.canned-responses-list {
    list-style: none;
    padding: 0;
    margin: 0;
    overflow-y: auto;
    flex-grow: 1; /* Ocupa espaço restante */
}

.canned-responses-list li {
    padding: 0.8rem 1.2rem;
    cursor: pointer;
    border-bottom: 1px solid var(--border-color);
    transition: background-color 0.2s, color 0.2s;
}

.canned-responses-list li:last-child {
    border-bottom: none;
}

.canned-responses-list li:hover {
    background-color: var(--primary-light);
}

.canned-response-title {
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.3rem;
    color: var(--primary-color);
}

.canned-response-preview {
    font-size: 0.85rem;
    color: var(--text-secondary-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.canned-responses-list .loading,
.canned-responses-list .error,
.canned-responses-list .empty {
    padding: 1rem 1.2rem;
    text-align: center;
    font-style: italic;
    color: var(--text-secondary-color);
    cursor: default;
}

.canned-responses-list .error {
    color: var(--danger-color);
}


/* Emoji Picker Element Style - Premium Redesign */
emoji-picker {
    position: absolute;
    bottom: 50px; /* Adjusted position */
    right: 0;
    z-index: 1100;
    background: var(--card-background);
    border: 1px solid var(--border-color);
    border-radius: var(--card-border-radius);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15); /* Enhanced shadow */
    padding: 0; /* Remove padding, handled internally */
    animation: fadeInUp 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    width: 350px; /* Adjusted width */
    max-height: 300px; /* Increased max-height */
    overflow: hidden; /* Hide main overflow, internal elements scroll */

    /* Theme Customization using CSS Variables */
    --emoji-picker-background: var(--card-background);
    --emoji-picker-text-color: var(--text-color);
    --emoji-picker-indicator-color: var(--primary-color);
    --emoji-picker-category-icon-color: var(--text-secondary-color);
    --emoji-picker-category-icon-active-color: var(--primary-color);
    --emoji-picker-search-background: var(--input-background);
    --emoji-picker-search-color: var(--text-color);
    --emoji-picker-search-border-color: var(--input-border-color);
    --emoji-picker-hover-background: var(--primary-light); /* Use light primary */
    --emoji-picker-focus-background: var(--primary-light);
    --emoji-picker-border-color: var(--border-color);
    --emoji-picker-scrollbar-thumb-color: var(--secondary-color);
    --emoji-picker-scrollbar-track-color: transparent; /* Transparent track */
    --emoji-picker-font-family: var(--font-family-sans); /* Use main font */
    --emoji-picker-font-size: 0.95rem; /* Adjust font size */
    --emoji-picker-border-radius: var(--card-border-radius); /* Match card radius */
}

emoji-picker.hidden {
    display: none;
}

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

/* Interval Container - Premium Redesign */
.interval-container {
    display: flex;
    gap: 1rem; /* Keep gap */
}

.interval-container input {
    position: relative;
    /* Padding adjusted by custom number input styles */
}

/* Removed absolute positioning for 'seg' text */
.interval-container input {
    padding-right: 60px; /* Keep space for buttons */
}

/* Button Group - Premium Redesign */
.button-group {
    display: flex;
    gap: 0.8rem; /* Slightly reduced gap */
    margin-top: 2.5rem; /* Increased margin */
}

/* Base Button Styles - Premium Redesign */
.btn {
    padding: 0.9rem 1.5rem; /* Adjusted padding */
    border: none;
    border-radius: var(--button-border-radius);
    font-weight: 500; /* Adjusted weight */
    cursor: pointer;
    display: inline-flex; /* Use inline-flex */
    align-items: center;
    justify-content: center;
    gap: 0.5rem; /* Adjusted gap */
    transition: var(--transition-standard);
    flex: 1; /* Keep flex grow */
    font-size: 0.95rem; /* Slightly smaller font */
    letter-spacing: 0; /* Remove letter spacing */
    position: relative;
    overflow: hidden;
    text-align: center;
    line-height: 1.4; /* Ensure consistent line height */
    -webkit-tap-highlight-color: transparent; /* Remove tap highlight on mobile */
}

/* Removed btn::before shine effect */

/* Primary Button - Premium Redesign */
.btn-primary {
    background-color: var(--primary-color);
    color: white;
    box-shadow: 0 4px 10px rgba(0, 122, 255, 0.25); /* Adjusted shadow */
}

.btn-primary:hover {
    background-color: var(--primary-hover);
    box-shadow: 0 6px 14px rgba(0, 122, 255, 0.3); /* Enhanced hover shadow */
}

.btn-primary:active {
    box-shadow: 0 2px 6px rgba(0, 122, 255, 0.2);
}

/* Stop State for Primary Button */
.btn-primary[data-state="stop"] {
    background-color: var(--danger-color);
    box-shadow: 0 4px 10px rgba(255, 59, 48, 0.25);
}

.btn-primary[data-state="stop"]:hover {
    background-color: #d43025; /* Darker red */
    box-shadow: 0 6px 14px rgba(255, 59, 48, 0.3);
}

/* Danger Button - Premium Redesign */
.btn-danger {
    background-color: var(--danger-color);
    color: white;
    box-shadow: 0 4px 10px rgba(255, 59, 48, 0.25);
}

.btn-danger:hover {
    background-color: #d43025; /* Darker red */
    box-shadow: 0 6px 14px rgba(255, 59, 48, 0.3);
}

.btn-danger:active {
    box-shadow: 0 2px 6px rgba(255, 59, 48, 0.2);
}

/* Secondary Button - Premium Redesign */
.btn-secondary {
    background-color: var(--secondary-color);
    color: white;
    box-shadow: 0 4px 10px rgba(142, 142, 147, 0.2); /* Adjusted shadow */
}

.btn-secondary:hover {
    background-color: var(--secondary-hover);
    box-shadow: 0 6px 14px rgba(142, 142, 147, 0.25);
}

.btn-secondary:active {
    box-shadow: 0 2px 6px rgba(142, 142, 147, 0.15);
}

/* Load Contacts Button - Premium Redesign (inherits .btn and .btn-secondary) */
#load-contacts-button {
    padding: 0.8rem 1.5rem; /* Adjusted padding */
    min-height: auto; 
    line-height: 1.4; 
}

/* Outline Button - Premium Redesign */
.btn-outline {
    background: transparent;
    border: 1px solid var(--outline-btn-color);
    color: var(--outline-btn-color);
    box-shadow: none; /* No shadow for outline */
}

/* Removed btn-outline::after fill effect */

.btn-outline:hover {
    background: var(--outline-btn-hover-bg); /* Use light primary background */
    color: var(--primary-color); /* Ensure text color matches */
    border-color: var(--outline-btn-color); /* Keep border color */
    /* transform removido para hover do btn-outline */
}

.btn-outline:active {
    background: rgba(0, 122, 255, 0.15); /* Slightly darker background on active */
    /* transform removido para active do btn-outline */
}

/* Contact Preview Styles - Premium Redesign */
/* (Container styles already updated) */

.contact-preview-container:hover {
    /* Subtle shadow enhancement on hover */
    /* transform: translateY(-3px); Explicitly removed */
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

/* Removed contact-preview-container::before and ::after */

.contact-preview-container h3 {
    font-size: 1.1rem; /* Slightly smaller title */
    font-weight: 600;
    color: var(--text-color); /* Standard text color */
    display: flex;
    align-items: center;
    gap: 0.6rem;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 1.2rem; /* Increased padding */
    margin-bottom: 1.5rem; /* Increased margin */
    position: relative;
}

.contact-preview-container h3 i {
    color: var(--primary-color); /* Icon uses primary color */
    font-size: 1.2rem; /* Adjust icon size */
    /* Removed gradient text */
}

/* Contact Preview List - Premium Redesign */
.contact-preview-list {
    overflow-y: auto;
    flex-grow: 1;
    scroll-behavior: smooth;
    /* Removed fixed max-height, rely on flex-grow and panel height */
}

/* Scrollbar styles already defined in dark mode section, ensure they apply generally */
.contact-preview-list::-webkit-scrollbar,
.log-area::-webkit-scrollbar,
#editor-container::-webkit-scrollbar, 
emoji-picker::-webkit-scrollbar {
    width: 8px;
    height: 8px; 
}
.contact-preview-list::-webkit-scrollbar-track,
.log-area::-webkit-scrollbar-track,
#editor-container::-webkit-scrollbar-track,
emoji-picker::-webkit-scrollbar-track {
    background: transparent; 
    border-radius: 4px;
}
 .contact-preview-list::-webkit-scrollbar-thumb,
 .log-area::-webkit-scrollbar-thumb,
 #editor-container::-webkit-scrollbar-thumb,
 emoji-picker::-webkit-scrollbar-thumb {
    background-color: var(--secondary-color); 
    border-radius: 4px;
    border: 2px solid var(--card-background); /* Use card background for border */
}
 .contact-preview-list::-webkit-scrollbar-thumb:hover,
 .log-area::-webkit-scrollbar-thumb:hover,
 #editor-container::-webkit-scrollbar-thumb:hover,
 emoji-picker::-webkit-scrollbar-thumb:hover {
    background-color: var(--primary-hover); 
}

/* Update dark mode scrollbar border */
@media (prefers-color-scheme: dark) {
    .contact-preview-list::-webkit-scrollbar-thumb,
    .log-area::-webkit-scrollbar-thumb,
    #editor-container::-webkit-scrollbar-thumb,
    emoji-picker::-webkit-scrollbar-thumb {
       border: 2px solid var(--card-background); /* Ensure dark card background is used */
   }
}

/* Preview Placeholder - Premium Redesign */
.preview-placeholder {
    color: var(--text-secondary-color); /* Use secondary text */
    text-align: center;
    padding: 3rem 1.5rem; /* Increased padding */
    font-style: normal; /* Remove italic */
    font-size: 0.95rem;
    background: var(--background-color); /* Use main background color */
    border-radius: var(--input-border-radius);
    border: 1px dashed var(--border-color); /* Keep dashed border */
    margin: auto 0; /* Center vertically if list is empty */
}

/* Contact Preview Item - Premium Redesign */
.contact-preview-item {
    display: flex;
    align-items: center;
    padding: 0.9rem 0.5rem; /* Adjusted padding */
    border-bottom: 1px solid var(--border-color);
    gap: 0.8rem; /* Reduced gap */
    animation: fadeInItem 0.4s ease-out forwards; /* Ensure animation completes */
    border-radius: 8px; /* Slightly smaller radius for items */
    transition: background-color var(--transition-standard), transform var(--transition-standard);
    position: relative; /* Keep for remove button */
}

.contact-preview-item:hover {
    background-color: var(--primary-light); /* Use light primary background */
    transform: none; /* Remove translateX */
    cursor: pointer; /* Add pointer cursor on hover */
}

.contact-preview-item:last-child {
    border-bottom: none;
}

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

.contact-avatar {
    position: relative;
}

/* Contact Avatar - Premium Redesign */
.contact-avatar {
    position: relative;
    flex-shrink: 0; /* Prevent avatar shrinking */
}

.contact-avatar::after {
    content: "";
    position: absolute;
    bottom: 1px; /* Adjusted position */
    right: 1px;
    width: 10px;
    height: 10px;
    background-color: var(--success-color);
    border-radius: 50%;
    border: 2px solid var(--card-background); /* Use card background for border */
    box-shadow: 0 1px 2px rgba(0,0,0,0.1); /* Add subtle shadow */
}

.contact-avatar img {
    width: 42px; /* Slightly smaller */
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
    background-color: var(--avatar-background);
    box-shadow: none; /* Remove individual shadow */
    border: none; /* Remove border */
}

.contact-info {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow: hidden;
}

/* Contact Info - Premium Redesign */
.contact-name {
    font-weight: 500; /* Adjusted weight */
    font-size: 0.95rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--text-color);
    line-height: 1.3; /* Adjust line height */
}

.contact-detail {
    font-size: 0.85rem;
    color: var(--text-secondary-color); /* Use secondary text */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    align-items: center;
    gap: 0.3rem;
    line-height: 1.3; /* Adjust line height */
}

/* Improve dark mode contrast for contact detail */
@media (prefers-color-scheme: dark) {
    .contact-detail {
        color: var(--contact-detail-color-dark);
    }
}

.contact-detail i {
    font-size: 0.8rem;
    color: var(--secondary-color); /* Use secondary color for icon */
    margin-top: -1px; /* Fine-tune alignment */
}

/* Remove Contact Button - Premium Redesign */
.remove-contact-button {
    position: absolute;
    top: 50%; /* Center vertically */
    right: 10px; /* Position from right */
    transform: translateY(-50%); /* Vertical centering */
    background: transparent;
    border: none;
    color: var(--secondary-color);
    font-size: 1rem; /* Slightly larger icon */
    cursor: pointer;
    padding: 6px; /* Increase clickable area */
    border-radius: 50%;
    opacity: 0; /* Hidden by default */
    transition: opacity var(--transition-standard), background-color var(--transition-standard), color var(--transition-standard);
}

.contact-preview-item:hover .remove-contact-button {
    opacity: 0.6; /* Show on item hover */
}

.remove-contact-button:hover {
    opacity: 1;
    color: var(--danger-color);
    background-color: rgba(255, 59, 48, 0.1); /* Light danger background */
    /* transform removido para hover do botão de remover contato */
}

/* Log Trigger Button Container - Premium Redesign */
.log-trigger-container {
    display: flex;
    justify-content: flex-start;
    margin-top: 0.5rem; /* Reduced margin */
}

/* Log trigger button inherits .btn and .btn-outline styles */
.log-trigger-container .btn-outline {
    flex: none; /* Don't grow */
    padding: 0.7rem 1.3rem; /* Adjusted padding */
    font-weight: 500; /* Match button weight */
    font-size: 0.9rem; /* Slightly smaller */
}

.log-trigger-container .btn-outline i {
    margin-right: 0.4rem; /* Adjusted gap */
    transition: transform var(--transition-standard);
}

.log-trigger-container .btn-outline:hover i {
    transform: none; /* Remove rotate effect */
}

/* Log Modal Styles - Premium Redesign */
.log-modal-overlay {
    position: fixed;
    inset: 0;
    background-color: var(--modal-overlay-color);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.3s;
    backdrop-filter: blur(8px); /* Increased blur */
    -webkit-backdrop-filter: blur(8px);
}

.log-modal-overlay:not(.hidden) {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.log-modal-overlay .log-container {
    background: var(--card-background);
    border-radius: var(--card-border-radius);
    padding: 0; /* Padding handled by inner elements */
    border: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    width: 90%;
    max-width: 800px; /* Slightly reduced max-width */
    max-height: 80vh; /* Adjusted max-height */
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2); /* Enhanced shadow */
    transform: scale(0.97) translateY(15px); /* Adjusted animation */
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

.log-modal-overlay:not(.hidden) .log-container {
    transform: scale(1) translateY(0);
}

/* Removed log-container::before gradient line */

/* Log Header - Premium Redesign */
.log-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.2rem 1.8rem; /* Increased padding */
    border-bottom: 1px solid var(--border-color);
    background-color: var(--card-background); /* Ensure background */
    flex-shrink: 0;
    position: relative;
}

/* Log Title - Premium Redesign */
.log-title {
    font-weight: 600;
    font-size: 1.1rem; /* Adjusted size */
    display: flex;
    align-items: center;
    gap: 0.6rem; /* Adjusted gap */
    color: var(--text-color); /* Use standard text color */
}

.log-title i {
    color: var(--primary-color); /* Use primary color for icon */
    font-size: 1.2rem; /* Adjust icon size */
    /* Removed gradient text */
}

/* Log Actions - Premium Redesign */
.log-actions {
    display: flex;
    align-items: center;
    gap: 0.8rem; /* Adjusted gap */
}

/* Log Area within Modal - Premium Redesign */
.log-area {
    padding: 1.5rem 1.8rem; /* Adjusted padding */
    overflow-y: auto;
    font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace; /* Prioritize SF Mono */
    font-size: 0.88rem; /* Slightly adjusted size */
    line-height: 1.65; /* Increased line height */
    flex-grow: 1;
    background-color: var(--background-color); /* Use main background for contrast */
    color: var(--text-color);
    scroll-behavior: smooth;
    max-height: calc(80vh - 100px); /* Calculate max-height based on header/footer */
    overflow-y: auto; 
}

/* Thumb styling remains similar, applied to all */
.contact-preview-list::-webkit-scrollbar-thumb,
.log-area::-webkit-scrollbar-thumb,
#editor-container::-webkit-scrollbar-thumb,
emoji-picker::-webkit-scrollbar-thumb {
    background-color: var(--secondary-color); /* Thumb color */
    border-radius: 4px;
    border: 2px solid var(--input-background); /* Creates a 'floating' effect */
}

.contact-preview-list::-webkit-scrollbar-thumb:hover,
.log-area::-webkit-scrollbar-thumb:hover,
#editor-container::-webkit-scrollbar-thumb:hover,
emoji-picker::-webkit-scrollbar-thumb:hover {
    background-color: var(--primary-hover); /* Hover color */
}

/* Remove redundant individual scrollbar styles */
/* .log-area::-webkit-scrollbar { ... } */
/* .log-area::-webkit-scrollbar-track { ... } */
/* .log-area::-webkit-scrollbar-thumb { ... } */
/* .log-area::-webkit-scrollbar-thumb:hover { ... } */

.log-area::-webkit-scrollbar-thumb {
    background: var(--secondary-color);
    border-radius: 10px;
}

.log-area::-webkit-scrollbar-thumb:hover {
    background: var(--primary-color);
}

/* Log Entry - Premium Redesign */
.log-entry {
    margin-bottom: 1rem; /* Increased spacing */
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--border-color); /* Use standard border color, solid */
    display: flex;
    flex-direction: column;
    animation: fadeInLog 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    position: relative;
    padding-left: 1.5rem; /* Increased padding for icon space */
}

.log-entry:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

/* Use icon color for the side line */
.log-entry::before {
    content: "";
    position: absolute;
    left: 0;
    top: 2px; /* Align with text */
    bottom: 2px; /* Align with text */
    width: 4px; /* Slightly thicker */
    border-radius: 2px;
    background-color: var(--secondary-color); /* Default color */
}

.log-entry.info::before { background-color: var(--log-info-color); }
.log-entry.success::before { background-color: var(--log-success-color); }
.log-entry.error::before { background-color: var(--log-error-color); }
.log-entry.warning::before { background-color: var(--log-warning-color); }
/* Removed debug style */

@keyframes fadeInLog {
     from { opacity: 0; transform: translateX(-5px); } /* Slide in from left */
     to { opacity: 1; transform: translateX(0); }
}

/* Log Line (Icon + Message) - Premium Redesign */
.log-line {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem; /* Adjusted gap */
}

.log-icon {
    position: absolute; /* Position icon over the line */
    left: -6px; /* Adjust position */
    top: 3px; 
    flex-shrink: 0;
    font-size: 1rem; /* Adjusted size */
    width: 16px; /* Ensure consistent width */
    text-align: center;
    color: var(--secondary-color); /* Default icon color */
    background-color: var(--background-color); /* Match log area background */
    padding: 0 2px; /* Space around icon */
}

.log-message {
    flex-grow: 1;
    word-break: break-word;
    padding: 0; /* Remove padding */
    color: var(--text-color); /* Ensure standard text color */
}

/* Log Timestamp - Premium Redesign */
.log-timestamp {
    font-size: 0.78rem; /* Slightly larger */
    color: var(--log-timestamp-color);
    margin-top: 0.4rem; /* Adjusted spacing */
    padding-left: 0; /* Remove padding, aligned with message */
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.log-timestamp::before {
    content: ""; /* Remove clock emoji */
}

/* Log Entry Type Icons - Premium Redesign */
.log-entry.info .log-icon { color: var(--log-info-color); filter: none; }
.log-entry.success .log-icon { color: var(--log-success-color); filter: none; }
.log-entry.error .log-icon { color: var(--log-error-color); filter: none; }
.log-entry.warning .log-icon { color: var(--log-warning-color); filter: none; }
/* Removed debug style */

/* Buttons within Log Header - Premium Redesign */
.clear-log-button, .close-log-button {
    background: transparent;
    border: 1px solid var(--border-color);
    color: var(--text-secondary-color); /* Use secondary text color */
    border-radius: var(--button-border-radius); /* Match button radius */
    padding: 0.5rem 0.9rem; /* Adjusted padding */
    font-size: 0.85rem;
    font-weight: 500; /* Match button weight */
    cursor: pointer;
    display: inline-flex; /* Use inline-flex */
    align-items: center;
    gap: 0.4rem; /* Adjusted gap */
    transition: var(--transition-standard);
    position: relative;
    overflow: hidden;
    line-height: 1.4;
}

/* Removed ::before fill effect */

.clear-log-button:hover, .close-log-button:hover {
    background-color: var(--primary-light); /* Use light primary background */
    color: var(--primary-color);
    border-color: var(--primary-light); /* Match background */
}

.close-log-button {
    padding: 0.5rem; /* Make close button square-ish */
    font-size: 1.2rem; /* Larger close icon */
    line-height: 1; /* Adjust line height for icon */
}

.clear-log-button i, .close-log-button i {
    transition: transform var(--transition-standard);
    font-size: 1rem; /* Adjust icon size */
}

/* Remove hover icon transforms */
.clear-log-button:hover i { transform: none; }
.close-log-button:hover i { transform: none; }

/* Loading Spinner - Premium Redesign */
.spinner {
    border: 3px solid var(--primary-light); /* Use light primary for track */
    border-left-color: var(--primary-color); /* Use primary for spinner part */
    border-radius: 50%;
    width: 28px; /* Slightly larger */
    height: 28px;
    animation: spin 0.8s linear infinite; /* Smoother animation */
    margin: 3rem auto; /* Increased margin */
    filter: none; /* Remove filter */
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Loading Indicator (Placeholder) - Premium Redesign */
.loading-indicator {
    display: flex; /* Use flex to center spinner */
    justify-content: center;
    align-items: center;
    padding: 3rem 1.5rem; /* Match placeholder padding */
    background: var(--background-color); 
    border-radius: var(--input-border-radius);
    border: 1px dashed var(--border-color); 
    margin: auto 0; 
}

.loading-indicator .spinner {
    width: 28px; /* Match main spinner size */
    height: 28px;
    margin: 0; /* Remove margin when inside indicator */
}

/* Removed loading-indicator .spinner::after */

/* Load Contacts Button Styling - Inherits .btn and .btn-secondary */
/* (Specific styles already adjusted previously) */

#load-contacts-button:disabled {
    opacity: 0.6; /* Adjusted disabled opacity */
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
    background-color: var(--secondary-color); /* Ensure base color */
}

/* Remove icon rotation on hover */
#load-contacts-button i {
    transition: none; 
}
#load-contacts-button:hover i:not(:disabled) {
    transform: none; 
}

/* Select Option with Color Dot - Premium Redesign */
.select-option {
    display: flex;
    align-items: center;
    gap: 0.6rem; /* Adjusted gap */
}

.select-option .color-dot {
    width: 10px; /* Slightly smaller */
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    border: 1px solid rgba(0,0,0,0.1); /* Subtle border */
}

/* Responsividade - Premium Redesign */
@media (max-width: 1024px) {
    .container {
        padding: 2rem 1.5rem; /* Adjust padding */
        /* Styles removed previously still apply */
    }
    .main-content {
        grid-template-columns: 1fr; /* Stack columns */
        gap: 2rem;
    }
    .preview-panel {
        position: static; 
        height: auto; 
        max-height: 60vh; /* Adjusted max-height */
        overflow-y: auto; 
    }
    .contact-preview-container{
         padding: 1.5rem; /* Adjust padding */
    }
     .contact-preview-list {
        margin-right: -8px; /* Match scrollbar */
        padding-right: 8px; /* Match scrollbar */
    }
}

@media (max-width: 768px) {
    .container {
        padding: 1.5rem 1rem; /* Further reduce padding */
    }
    .header h2 {
        font-size: 1.6rem; /* Adjust title size */
    }
    .main-content {
        gap: 1.5rem; /* Reduce gap */
    }
    .form-panel, .contact-preview-container {
        padding: 1.5rem; /* Adjust padding */
    }
    .log-modal-overlay .log-container {
        width: 95%;
        max-height: 90vh; /* Allow slightly more height */
    }
    .log-header, .log-area {
        padding: 1rem 1.2rem; /* Adjust padding */
    }
}

@media (max-width: 576px) {
    /* body padding already 0 */
    .container {
        padding: 1.5rem 1rem; /* Consistent padding */
    }
    .header h2 {
        font-size: 1.5rem;
    }
    .interval-container {
        flex-direction: column; 
        gap: 0.8rem; /* Adjust gap */
    }
    .button-group {
        flex-direction: column; 
        gap: 0.8rem; /* Adjust gap */
    }
    .contact-preview-container, .log-modal-overlay .log-container {
        padding: 1.2rem; /* Adjust padding */
    }
     .log-header {
        padding: 0.8rem 1.2rem;
    }
    .log-area {
        padding: 1rem 1.2rem;
        font-size: 0.85rem; /* Slightly smaller log font */
    }
    input, select, textarea, .btn {
        font-size: 0.95rem; /* Adjust base font size for inputs/buttons */
    }
    label {
        font-size: 0.85rem; /* Adjust label size */
    }
}

/* Theme Toggle Button - Premium Redesign */
.theme-toggle {
    background: none;
    border: none;
    color: var(--text-secondary-color); /* Use secondary color */
    cursor: pointer;
    padding: 0.5rem; /* Increase padding */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color var(--transition-standard), color var(--transition-standard);
    position: absolute; /* Position absolutely */
    top: 1.5rem; /* Adjust position */
    right: 1.5rem;
}

.theme-toggle:hover {
    background: var(--primary-light); /* Use light primary background */
    color: var(--primary-color); /* Use primary color */
}

.theme-toggle i {
    font-size: 1.2rem; /* Adjust icon size */
}

/* Hide default spinners on number inputs */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

 input[type=number] {
   -moz-appearance: textfield; /* Firefox */
 }

 /* Custom Number Input with Buttons - Premium Redesign */
 .number-input-container {
    display: flex;
    align-items: center;
    position: relative;
    flex-grow: 1; 
 }

 .number-input-container input[type=number] {
    padding-right: 64px; /* Adjusted space for buttons */
    text-align: center; 
 }

 .interval-button {
    position: absolute;
    top: 0; /* Align with input top */
    bottom: 0; /* Align with input bottom */
    background-color: transparent; /* Transparent background */
    border: none; /* Remove border */
    border-left: 1px solid var(--input-border-color); /* Separator line */
    color: var(--text-secondary-color); /* Use secondary text color */
    cursor: pointer;
    width: 32px; /* Adjusted width */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color var(--transition-standard), color var(--transition-standard);
    z-index: 1; 
    font-size: 1rem; /* Larger icon */
 }

 .interval-button:hover {
    background-color: var(--primary-light); /* Light primary background */
    color: var(--primary-color);
 }
 
 .interval-button:active {
    background-color: rgba(0, 122, 255, 0.15); /* Slightly darker active */
 }

 .interval-button.interval-decrement {
    right: 32px; /* Position left button */
    border-radius: 0; 
    border-right: none; 
 }

 .interval-button.interval-increment {
    right: 0; /* Position rightmost button */
    border-top-right-radius: var(--input-border-radius); 
    border-bottom-right-radius: var(--input-border-radius); 
 }

 .interval-button i {
    pointer-events: none; 
 }

/* Advanced Filters Section */
.advanced-filters-section {
  margin-top: 1.5rem; /* Space above the section */
  margin-bottom: 1.5rem; /* Space below the section */
  border-top: 1px solid var(--border-color); /* Separator line */
  padding-top: 1.5rem; /* Space below the line */
}

.advanced-filters-toggle {
  background: none;
  border: none;
  color: var(--primary-color);
  font-weight: 500;
  font-size: 0.95rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0; /* Padding for clickable area */
  width: 100%; /* Make button full width */
  text-align: left;
  transition: color 0.2s;
}

.advanced-filters-toggle:hover {
  color: var(--primary-hover);
}

.advanced-filters-toggle .toggle-icon {
  margin-left: auto; /* Push icon to the right */
  transition: transform 0.3s ease;
}

.advanced-filters-content {
  padding-top: 1.5rem; /* Space below toggle button */
  overflow: hidden;
  transition: max-height 0.4s ease-out, opacity 0.4s ease-out, padding-top 0.4s ease-out;
  max-height: 1000px; /* Set a large max-height for expanded state */
  opacity: 1;
}

.advanced-filters-content.hidden {
  max-height: 0;
  opacity: 0;
  padding-top: 0;
  /* Prevent interaction when hidden */
  pointer-events: none;
  /* Ensure form groups inside don't add margin when hidden */
  margin-bottom: 0; 
}

/* Adjust margin for form groups inside the advanced section */
.advanced-filters-content .form-group {
  margin-bottom: 1.5rem; /* Keep consistent spacing */
}

.advanced-filters-content .form-group:last-child {
  margin-bottom: 0; /* Remove margin from last item */
}

/* --- Estilos para o Modo Contém/Não Contém Clicável --- */

/* Container do filtro de query (controle de visibilidade) */
.filter-query-container {
  transition: opacity 0.3s ease, max-height 0.3s ease, margin-bottom 0.3s ease; /* Manter transições */
  overflow: hidden;
  max-height: 200px; /* Altura suficiente para o conteúdo */
  opacity: 1;
}

.filter-query-container.hidden {
  opacity: 0;
  max-height: 0;
  margin-bottom: 0 !important; /* Remove margem quando oculto */
  padding-top: 0;
  padding-bottom: 0;
  border: none;
  pointer-events: none; /* Impede interação quando oculto */
}

/* Estilo para o span clicável (Contém/Não Contém) */
.query-mode-toggle {
  font-weight: 600; /* Destaca a palavra */
  color: var(--primary-color); /* Usa a cor primária */
  cursor: pointer;
  padding: 2px 4px; /* Pequeno padding para área de clique */
  border-radius: 4px;
  transition: background-color 0.2s, color 0.2s;
  margin-left: 4px; /* Espaço após "Conversa" */
  user-select: none; /* Impede seleção de texto */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}


/* --- Schedule Modal Styles - Premium Redesign --- */
.schedule-modal-overlay {
    position: fixed;
    inset: 0;
    background-color: var(--modal-overlay-color);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050; /* Slightly higher than log modal if needed */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.3s;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.schedule-modal-overlay:not(.hidden) {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.schedule-modal-container {
    background: var(--card-background);
    border-radius: var(--card-border-radius);
    padding: 0; /* Padding handled by inner elements */
    border: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    width: 90%;
    max-width: 500px; /* Smaller max-width for schedule modal */
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
    transform: scale(0.97) translateY(15px);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

.schedule-modal-overlay:not(.hidden) .schedule-modal-container {
    transform: scale(1) translateY(0);
}

.schedule-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.2rem 1.8rem;
    border-bottom: 1px solid var(--border-color);
    flex-shrink: 0;
}

.schedule-modal-header h3 {
    font-weight: 600;
    font-size: 1.1rem;
    color: var(--text-color);
    margin: 0; /* Remove default margin */
}

.close-modal-button { /* Generic close button style */
    background: transparent;
    border: none;
    color: var(--text-secondary-color);
    font-size: 1.4rem; /* Larger icon */
    cursor: pointer;
    padding: 0.4rem; /* Clickable area */
    line-height: 1;
    border-radius: 50%;
    transition: color 0.2s, background-color 0.2s;
}

.close-modal-button:hover {
    color: var(--danger-color);
    background-color: rgba(255, 59, 48, 0.1);
}

.schedule-modal-body {
    padding: 1.8rem; /* Padding for content */
    flex-grow: 1;
    /* No overflow needed here unless content is very long */
}

.schedule-modal-body .form-group {
    margin-bottom: 1.5rem; /* Consistent spacing */
}

.schedule-modal-body .form-group:last-child {
    margin-bottom: 0;
}

/* Style for datetime-local input */
input[type="datetime-local"] {
    /* Inherits base input styles */
    /* Add specific adjustments if needed */
    cursor: text; /* Ensure text cursor */
}

/* Style for datetime-local icon (browser specific) */
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.2s;
}

input[type="datetime-local"]::-webkit-calendar-picker-indicator:hover {
    opacity: 1;
}

.schedule-modal-footer {
    display: flex;
    justify-content: flex-end; /* Align buttons to the right */
    gap: 0.8rem;
    padding: 1.2rem 1.8rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--background-color); /* Slightly different background for footer */
    flex-shrink: 0;
}

/* Buttons in footer inherit .btn styles */
#cancel-schedule-button {
    /* Inherits .btn, apply secondary style */
    background-color: var(--secondary-color);
    color: white;
    box-shadow: 0 4px 10px rgba(142, 142, 147, 0.2);
}
#cancel-schedule-button:hover {
    background-color: var(--secondary-hover);
    /* transform removido para hover do botão cancelar agendamento */
    box-shadow: 0 6px 14px rgba(142, 142, 147, 0.25);
}

#confirm-schedule-button {
    /* Inherits .btn, apply primary style */
}


/* --- Right Panel Tabs - Premium Redesign --- */
.right-panel {
    position: sticky;
    top: 2.5rem;
    height: calc(100vh - 5rem); /* Match preview panel height */
    max-height: 80vh; /* Match preview panel max-height */
    display: flex;
    flex-direction: column;
    background: var(--card-background);
    border-radius: var(--card-border-radius);
    padding: 0; /* Remove padding, handled by inner elements */
    box-shadow: var(--form-shadow);
    border: 1px solid var(--border-color);
    overflow: hidden; /* Hide overflow for the panel itself */
}

.tabs-container {
    display: flex;
    border-bottom: 1px solid var(--border-color);
    flex-shrink: 0; /* Prevent tabs from shrinking */
    padding: 0 2rem; /* Increased horizontal padding */
    background-color: var(--background-color); /* Slightly different background for tabs */
    width: 100%; /* Ensure full width */
}

.tab-button {
    padding: 1rem 1.2rem; /* Generous padding */
    cursor: pointer;
    background: none;
    border: none;
    border-bottom: 3px solid transparent; /* Indicator line */
    color: var(--text-secondary-color);
    font-weight: 500;
    font-size: 0.95rem;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: color 0.2s, border-color 0.2s;
    margin-bottom: -1px; /* Overlap border */
    position: relative;
}

.tab-button:hover {
    color: var(--text-color);
}

.tab-button.active {
    color: var(--primary-color);
    border-bottom-color: var(--primary-color);
    font-weight: 600;
}

.tab-button i {
    font-size: 1rem; /* Adjust icon size */
    margin-right: 0.2rem; /* Slight space before text */
}

/* Counter Badge Style */
.tab-button span {
    background-color: var(--secondary-color);
    color: var(--card-background); /* White or dark text depending on theme */
    padding: 0.15rem 0.6rem; /* Slightly wider padding */
    border-radius: 10px; /* Pill shape */
    font-size: 0.75rem; /* Smaller font for badge */
    font-weight: 600;
    margin-left: 0.6rem; /* More space between text and badge */
    min-width: 24px; /* Slightly wider minimum width */
    text-align: center;
    line-height: 1.3;
    display: inline-block; /* Needed for padding/border-radius */
}

/* Adjust badge color in dark mode if needed */
@media (prefers-color-scheme: dark) {
    .tab-button span {
        background-color: var(--secondary-color);
        color: var(--card-background); /* Keep text light */
    }
}

.tab-button.active span {
    background-color: var(--primary-color);
    color: white;
}

.tab-content {
    display: none; /* Hide inactive tabs */
    flex-grow: 1; /* Allow content to fill space */
    overflow-y: auto; /* Enable scrolling for content */
    padding: 1.5rem; /* Padding inside tab content */
    position: relative; /* For placeholder positioning */
    /* Apply scrollbar styling */
    scrollbar-width: thin;
    scrollbar-color: var(--secondary-color) transparent;
}
.tab-content::-webkit-scrollbar { width: 8px; height: 8px; }
.tab-content::-webkit-scrollbar-track { background: transparent; border-radius: 4px; }
.tab-content::-webkit-scrollbar-thumb {
    background-color: var(--secondary-color);
    border-radius: 4px;
    border: 2px solid var(--card-background);
}
.tab-content::-webkit-scrollbar-thumb:hover { background-color: var(--primary-hover); }
@media (prefers-color-scheme: dark) {
    .tab-content::-webkit-scrollbar-thumb { border: 2px solid var(--card-background); }
}


.tab-content.active {
    display: flex; /* Use flex to allow placeholder centering */
    flex-direction: column; /* Stack content vertically */
}

/* Placeholder within tabs */
.tab-placeholder {
    color: var(--text-secondary-color);
    text-align: center;
    padding: 3rem 1.5rem;
    font-size: 0.95rem;
    background: var(--background-color);
    border-radius: var(--input-border-radius);
    border: 1px dashed var(--border-color);
    margin: auto; /* Center placeholder vertically and horizontally */
    width: calc(100% - 2rem); /* Adjust width to fit padding */
}

/* Ensure contact list takes full height within its tab */
#preview-tab-content {
    padding: 0; /* Remove padding if contact list handles it */
}
#contact-preview-list {
     padding: 1.5rem; /* Add padding back to list */
     height: 100%; /* Make list take full height of tab */
     overflow-y: auto; /* Ensure scrolling */
}
#contact-preview-list .preview-placeholder {
    margin: auto; /* Re-center placeholder */
    width: auto; /* Reset width */
}


/* --- Scheduled Tasks / Saved Configs List Styles --- */
.scheduled-tasks-list,
.saved-configs-list {
    display: flex;
    flex-direction: column;
    gap: 0.8rem; /* Space between items */
}

.list-item { /* Common style for scheduled tasks and saved configs */
    background-color: var(--background-color); /* Use main background */
    border: 1px solid var(--border-color);
    border-radius: var(--input-border-radius);
    padding: 1rem 1.2rem;
    display: flex;
    flex-direction: column; /* Stack info and actions */
    gap: 0.5rem; /* Space within item */
    transition: background-color 0.2s, box-shadow 0.2s;
}

.list-item:hover {
    background-color: var(--primary-light);
    /* box-shadow: 0 2px 8px rgba(0,0,0,0.05); */
}

.list-item-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start; /* Align items top */
    gap: 0.8rem;
}

.list-item-title {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--text-color);
    flex-grow: 1;
    word-break: break-word; /* Wrap long titles */
}

.list-item-title i {
    margin-right: 0.4rem;
    color: var(--secondary-color);
}

.list-item-actions {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0; /* Prevent actions from shrinking */
}

.list-item-details {
    font-size: 0.85rem;
    color: var(--text-secondary-color);
    display: flex;
    flex-direction: column; /* Stack details */
    gap: 0.3rem;
}

.detail-line {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.detail-line i {
    width: 14px; /* Align icons */
    text-align: center;
    color: var(--secondary-color);
    font-size: 0.8rem;
}

.status-badge {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 12px; /* Pill shape */
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: white;
    background-color: var(--secondary-color); /* Default */
}

.status-badge.status-pending { background-color: var(--warning-color); }
.status-badge.status-running { background-color: var(--primary-color); } /* Blue for running */
.status-badge.status-sent { background-color: var(--success-color); }
.status-badge.status-failed { background-color: var(--danger-color); }
.status-badge.status-cancelled { background-color: var(--secondary-color); opacity: 0.7; }

/* Action Buttons within list items */
.list-item-button {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.3rem;
    border-radius: 50%;
    font-size: 1rem;
    line-height: 1;
    transition: color 0.2s, background-color 0.2s;
}

.list-item-button:hover {
    color: var(--primary-color);
    background-color: var(--primary-light);
}

.list-item-button.delete:hover,
.list-item-button.cancel:hover {
    color: var(--danger-color);
    background-color: rgba(255, 59, 48, 0.1);
}

.list-item-button i {
    display: block; /* Ensure icon fills button */
}

.query-mode-toggle:hover {
  background-color: var(--primary-light); /* Fundo leve no hover */
}

/* Ajuste na label principal para alinhar corretamente com o span */
.filter-query-container label {
  display: flex; /* Garante alinhamento */
  align-items: center; /* Alinha ícone, texto e span */
  gap: 0.4rem; /* Mantém o gap padrão */
}


/* --- Image Preview Modal --- */
.image-preview-modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1100; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgba(0,0,0,0.85); /* Black w/ opacity */
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  animation: fadeInModal 0.3s ease;
}

.image-preview-modal.hidden {
    display: none;
}

.image-preview-modal:not(.hidden) {
    display: block; /* Show when not hidden */
}


.image-preview-modal .modal-content {
  margin: auto;
  display: block;
  max-width: 80%;
  max-height: 80vh;
  animation: zoomInModal 0.3s ease;
}

.close-image-preview {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
  cursor: pointer;
}

.close-image-preview:hover,
.close-image-preview:focus {
  color: #bbb;
  text-decoration: none;
}

@keyframes fadeInModal {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes zoomInModal {
    from { transform: scale(0.8); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

/* --- Estilos para Importação de Contatos --- */
.import-contacts-container {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 1rem;
}
 
/* Estilização da barra de rolagem para import-contacts-container e data-preview-container */
.import-contacts-container::-webkit-scrollbar,
.data-preview-container::-webkit-scrollbar {
    width: 10px;
}

.import-contacts-container::-webkit-scrollbar-track,
.data-preview-container::-webkit-scrollbar-track {
    background: var(--card-background);
    border-radius: var(--card-border-radius);
}

.import-contacts-container::-webkit-scrollbar-thumb,
.data-preview-container::-webkit-scrollbar-thumb {
    background-color: var(--secondary-color);
    border-radius: var(--card-border-radius);
    border: 2px solid var(--card-background);
}

.import-contacts-container::-webkit-scrollbar-thumb:hover,
.data-preview-container::-webkit-scrollbar-thumb:hover {
    background-color: var(--primary-color);
}

/* Firefox */
.import-contacts-container,
.data-preview-container {
    scrollbar-width: thin;
    scrollbar-color: var(--secondary-color) var(--card-background);
}

.import-contacts-container:hover,
.data-preview-container:hover {
    scrollbar-color: var(--primary-color) var(--card-background);
}

.import-contacts-button {
    width: 100%;
    justify-content: center;
    padding: 0.8rem;
    font-weight: 500;
}

.import-contacts-button i {
    margin-right: 0.5rem;
}

/* Estilos para a tabela de prévia de dados */
.data-preview-container {
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid var(--border-color);
    border-radius: var(--input-border-radius);
    background-color: var(--input-background);
    margin-top: 0.5rem;
}

.data-preview-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.data-preview-table th {
    background-color: rgba(0, 122, 255, 0.15); /* Cor menos transparente para melhor visibilidade */
    color: var(--primary-color);
    font-weight: 600;
    text-align: left;
    padding: 0.7rem;
    position: sticky;
    top: 0;
    z-index: 1;
    border-bottom: 1px solid var(--border-color);
    backdrop-filter: blur(8px); /* Fundo fosco */
    -webkit-backdrop-filter: blur(8px); /* Suporte para Safari */
}

.data-preview-table td {
    padding: 0.6rem 0.7rem;
    border-bottom: 1px solid var(--border-color);
    color: var(--text-color);
}

.data-preview-table tr:last-child td {
    border-bottom: none;
}

.data-preview-table tr:nth-child(even) {
    background-color: rgba(0, 0, 0, 0.02);
}

@media (prefers-color-scheme: dark) {
    .data-preview-table tr:nth-child(even) {
        background-color: rgba(255, 255, 255, 0.02);
    }
}

/* Estilos para o grupo de opções de rádio */
.radio-group {
    display: flex;
    gap: 1.5rem;
    margin-top: 0.5rem;
}

.radio-option {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.radio-option input[type="radio"] {
    width: auto;
    margin: 0;
    cursor: pointer;
}

.radio-option label {
    margin: 0;
    font-weight: normal;
    color: var(--text-color);
    cursor: pointer;
}

/* Estilos para seletor de dias da semana */
.weekdays-selector {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    margin-top: 0.5rem;
}

.weekday-option {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background-color: var(--input-background); /* Fundo neutro para os dias */
    padding: 0.5rem;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.2s ease;
    user-select: none; /* Evita seleção do texto ao clicar repetidamente */
}

.weekday-option:hover {
    background-color: var(--primary-light); /* Fundo ao passar o mouse */
}

.weekday-option input[type="checkbox"] {
    width: auto;
    margin: 0;
    cursor: pointer;
}

.weekday-option label {
    margin: 0;
    font-weight: normal;
    color: var(--text-color);
    cursor: pointer;
    user-select: none; /* Evita seleção do texto ao clicar repetidamente */
}

.weekday-option input[type="checkbox"] {
    width: auto;
    margin: 0;
    cursor: pointer;
}

.weekday-option label {
    margin: 0;
    font-weight: normal;
    color: var(--text-color);
    cursor: pointer;
}

/* Estilo para opção de checkbox genérica (como "Envio Recorrente") */
.checkbox-option {
    display: flex;
    align-items: center;
    gap: 0.5rem; /* Espaço entre checkbox e label */
    cursor: pointer; /* Indica que a área é clicável */
    user-select: none; /* Evita seleção do texto ao clicar repetidamente */
}

.checkbox-option input[type="checkbox"] {
    /* Herda estilos de input[type="checkbox"] (linha 287) */
    margin: 0; /* Remove margem padrão se houver */
    background-color: var(--input-background); /* Ajusta fundo do checkbox */
    border-radius: 4px; /* Bordas arredondadas para o fundo */
    cursor: pointer;
    border: 1px solid var(--input-border-color); /* Adiciona borda para destacar a caixinha */
    width: 18px;
    height: 18px;
    appearance: none; /* Remove estilo padrão */
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
}

.checkbox-option input[type="checkbox"]:checked::before {
    content: "";
    position: absolute;
    top: 2px; /* Ajustado para alinhar melhor verticalmente */
    left: 6px;
    width: 4px;
    height: 9px;
    border: solid var(--primary-color);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* Aplica o mesmo estilo para os checkboxes dos dias da semana */
.weekday-option input[type="checkbox"] {
    border: 1px solid var(--input-border-color);
    width: 18px;
    height: 18px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    background-color: var(--input-background);
    border-radius: 4px;
    cursor: pointer;
    margin: 0;
}

.weekday-option input[type="checkbox"]:checked::before {
    content: "";
    position: absolute;
    top: 2px; /* Alinhado com o ajuste do outro checkbox */
    left: 6px;
    width: 4px;
    height: 9px;
    border: solid var(--primary-color);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.weekday-option input[type="checkbox"]:focus {
    outline: none;
    box-shadow: 0 0 0 3px var(--primary-light);
}

.checkbox-option input[type="checkbox"]:focus {
    outline: none; /* Remove contorno padrão */
    box-shadow: 0 0 0 3px var(--primary-light); /* Sombra para foco mais suave */
}

.checkbox-option label {
    /* Herda estilos de label (linha 246) */
    margin: 0; /* Remove margem padrão */
    font-weight: normal; /* Peso normal para label de opção */
    color: var(--text-color); /* Cor padrão do texto */
    cursor: pointer; /* Cursor de ponteiro para o label também */
    user-select: none; /* Evita seleção do texto ao clicar repetidamente */
}
