/* V30.0: CSS Custom Properties for easier theming */
:root {
    --tta-primary-color: #0073aa;
    --tta-primary-hover-color: #005a8e;
    --tta-accent-color: #3b82f6;
    --tta-accent-gradient: linear-gradient(135deg, #3b82f6, #2563eb);
    --tta-success-color: #22c55e;
    --tta-error-color: #ef4444;
    --tta-text-dark: #111827;
    --tta-text-medium: #4b5563;
    --tta-text-light: #6b7280;
    --tta-border-color: #d1d5db;
    --tta-bg-light: #f9fafb;
}

.tta-form-wrapper {
    min-height: calc(80vh - 100px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0;
}

.tta-form-container {
    max-width: 420px;
    margin: 24px auto;
    padding: 24px;
    border: 1px solid #eaeaea;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.tta-form-container h3, .tta-form-container h2 {
    text-align: center;
    margin-top: 0;
    margin-bottom: 20px;
}

.tta-form-container input[type="text"],
.tta-form-container input[type="email"],
.tta-form-container input[type="password"],
.tta-form-container select {
    width: 100%;
    padding: 8px;
    box-sizing: border-box;
}

.tta-form-container .tta-submit-button {
    width: 100%;
    padding: 10px;
    background: var(--tta-primary-color);
    color: #fff;
    border: none;
    border-radius: 4px;
    font-weight: bold; /* V19.85: Make submit button text bold */
    cursor: pointer;
}

.tta-form-container .tta-form-footer {
    text-align: center;
}

/* V19.86: Make footer links look like standard links */
.tta-form-container .tta-form-footer a {
    color: var(--tta-primary-color);
    text-decoration: underline;
}

/* V30.1: Styles for the Thank You page submit button */
.tta-thank-you-button {
    padding: 12px !important;
    background: var(--tta-accent-gradient) !important; /* Use !important to override base styles */
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 1.1em;
    transition: transform 0.2s, box-shadow 0.2s;
}

.tta-thank-you-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

/* V20.5: Enhanced Registration Form Styles */
.tta-registration-form {
    max-width: 900px; /* Increased width to accommodate two-column layout */
    padding: 32px;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.tta-registration-form h2 {
    font-size: 1.75em;
    font-weight: 700;
    color: var(--tta-text-dark);
}
.tta-registration-form .tta-form-intro {
    text-align: center;
    color: var(--tta-text-light);
    margin-top: -10px;
    margin-bottom: 25px;
}
.tta-registration-form label .tta-required-star {
    color: var(--tta-error-color); /* Use the theme's error color for consistency */
    font-weight: bold;
    margin-left: 3px;
}
.tta-registration-form input[type="text"],
.tta-registration-form input[type="email"],
.tta-registration-form input[type="password"],
.tta-registration-form select {
    padding: 12px;
    border: 1px solid var(--tta-border-color);
    border-radius: 6px;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.tta-registration-form input:focus,
.tta-registration-form select:focus {
    outline: none;
    border-color: var(--tta-accent-color);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}
.tta-registration-form .tta-submit-button {
    padding: 12px;
    font-size: 1.1em;
    background: var(--tta-accent-gradient);
    border-radius: 6px;
    transition: transform 0.2s, box-shadow 0.2s;
}
.tta-registration-form .tta-submit-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

/* V20.5: Password Strength Indicator List */
.tta-password-strength-list {
    list-style: none;
    padding: 0;
    margin: 8px 0 15px 0;
    font-size: 0.9em;
}
.tta-password-strength-list li {
    color: #ef4444; /* Default red color */
    margin-bottom: 4px;
    transition: color 0.3s, opacity 0.5s, max-height 0.5s, margin 0.5s, padding 0.5s; /* V20.9: Add all transitions */
    display: flex;
    align-items: center;
}
.tta-password-strength-list li::before {
    content: '❌';
    margin-right: 8px;
    font-size: 0.8em;
    transition: content 0.3s; /* V20.9: Add transition for the icon change */
}
.tta-password-strength-list li.met {
    color: #22c55e; /* Green color when condition is met */
}
.tta-password-strength-list li.met::before {
    content: '✅';
}
/* V42.0: Styles for Promotional Information section */
.tta-form-section {
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px solid var(--tta-border-color);
}

.tta-form-section-title {
    font-size: 1.25em;
    font-weight: 600; /* Slightly less bold for a cleaner look */
    color: var(--tta-text-medium); /* Use a theme color for text */
    margin-top: 0;
    margin-bottom: 20px;
    text-align: left; /* Align to the left */
    background: var(--tta-bg-light); /* A very light background from the theme */
    padding: 12px 15px;
    border-radius: 8px;
    border: 1px solid var(--tta-border-color); /* Add a subtle border */
}

.tta-terms-field {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.tta-terms-field input[type="checkbox"] {
    width: auto; /* Override default form input width */
    margin: 0;
}

.tta-terms-field label {
    margin: 0;
    font-size: 0.95em;
}

.tta-terms-field a,
.tta-form-container label a {
    text-decoration: underline;
    color: var(--tta-primary-color);
}

.tta-registration-form .tta-form-grid {
    display: grid;
    grid-template-columns: 1fr; /* Default to 1 column for mobile */
    gap: 0 40px; /* Only column gap, more space */
    border-top: 1px solid var(--tta-border-color); /* The single line the user wants */
    margin-top: 25px;
    padding-top: 20px;
}

@media screen and (min-width: 820px) { /* A bit wider breakpoint for two columns */
    .tta-registration-form .tta-form-grid {
        grid-template-columns: 1fr 1fr; /* Two equal columns */
    }
}

/* Remove the original border/margin from the sections inside the grid */
.tta-registration-form .tta-form-grid .tta-form-section {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

/* The submit button and footer are outside the grid, so they will span full width automatically */
.tta-registration-form .tta-submit-button {
    margin-top: 20px; /* Add some space above the button */
}


.tta-registration-form .tta-multi-select {
    width: 100%;
    height: 250px !important; /* Increased height for better visibility of countries, added !important to ensure override */
    padding: 8px;
}

/* V20.6: Enhanced Login Form Styles (matches registration form) */
.tta-login-form {
    max-width: 480px;
    padding: 32px;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.tta-login-form h2 {
    font-size: 1.75em;
    font-weight: 700;
    color: #111827;
}
.tta-login-form .tta-form-intro {
    text-align: center;
    color: #6b7280;
    margin-top: -10px;
    margin-bottom: 25px;
}
.tta-login-form input[type="email"],
.tta-login-form input[type="password"] {
    padding: 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.tta-login-form input:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}
.tta-login-form .tta-submit-button {
    padding: 12px;
    font-size: 1.1em;
    background: linear-gradient(135deg, #3b82f6, #2563eb);
    border-radius: 6px;
    transition: transform 0.2s, box-shadow 0.2s;
}
.tta-login-form .tta-submit-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

/* V-NEW: Styles for Contact Us Form */
.tta-contact-form {
    max-width: 540px; /* A bit wider for a message field */
    padding: 32px;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.tta-contact-form h2 {
    font-size: 1.75em;
    font-weight: 700;
    color: var(--tta-text-dark);
}
.tta-contact-form .tta-form-intro {
    text-align: center;
    color: var(--tta-text-light);
    margin-top: -10px;
    margin-bottom: 25px;
}
.tta-contact-form input[type="text"],
.tta-contact-form input[type="email"],
.tta-contact-form input[type="tel"],
.tta-contact-form select,
.tta-contact-form textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid var(--tta-border-color);
    border-radius: 6px;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box; /* Ensure padding doesn't affect width */
}
.tta-contact-form input:focus,
.tta-contact-form select:focus,
.tta-contact-form textarea:focus {
    outline: none;
    border-color: var(--tta-accent-color);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}
.tta-contact-form .tta-submit-button {
    padding: 12px;
    font-size: 1.1em;
    background: var(--tta-accent-gradient);
    border-radius: 6px;
    transition: transform 0.2s, box-shadow 0.2s;
}
.tta-contact-form .tta-submit-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}
.tta-contact-form .tta-alert {
    text-align: left;
    border-left-width: 5px;
    margin-bottom: 20px;
}
.tta-contact-form label .tta-required-star {
    color: var(--tta-error-color);
    font-weight: bold;
    margin-left: 3px;
}

/* V-NEW: Styles for Thank You Form required star */
.tta-thank-you-form label .tta-required-star {
    color: var(--tta-error-color);
    font-weight: bold;
    margin-left: 3px;
}

/* V-NEW: Styles for contact form phone input group */
.tta-contact-phone-code {
    width: 55%;
    padding: 8px !important; /* Use important to override the more general padding: 12px */
}

.tta-contact-phone-number {
    width: 45% !important; /* Use important to override width: 100% */
}

#email-validation-msg, #password-match-msg {
    font-size: 0.9em;
    margin-top: 5px;
    min-height: 18px;
}
.tta-password-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}
.toggle-password, .toggle-login-password {
    position: absolute;
    right: 10px;
    cursor: pointer;
    user-select: none;
}

/* V20.10: Enhanced Change Password Form Styles */
.tta-change-password-form {
    max-width: 540px; /* Increased width to match user request */
    padding: 32px;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.tta-change-password-form h2 {
    font-size: 1.75em;
    font-weight: 700;
    color: #111827;
}
.tta-change-password-form .tta-form-intro {
    text-align: center;
    color: #6b7280;
    margin-top: -10px;
    margin-bottom: 25px;
}
.tta-change-password-form input[type="password"] {
    padding: 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.tta-change-password-form input:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}
.tta-change-password-form .tta-submit-button {
    padding: 12px;
    font-size: 1.1em;
    background: linear-gradient(135deg, #3b82f6, #2563eb);
    border-radius: 6px;
    transition: transform 0.2s, box-shadow 0.2s;
}
.tta-change-password-form .tta-submit-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}
.tta-change-password-form .tta-alert {
    text-align: left;
    border-left-width: 5px;
    margin-bottom: 20px;
}

/* V23.0: Google Login Button and Divider */
.tta-google-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    padding: 10px;
    background-color: #ffffff;
    color: #444;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-weight: 600;
    font-size: 1.05em;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.2s, box-shadow 0.2s;
}
.tta-google-button:hover {
    background-color: #f9fafb;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.tta-google-button img {
    width: 18px;
    height: 18px;
}
.tta-divider {
    text-align: center;
    margin: 25px 0;
    color: #9ca3af;
    font-weight: 600;
}

/* V20.0: Styles for reCAPTCHA container */
.tta-recaptcha-container {
    display: flex;
    justify-content: center;
}

/* Dashboard Styles */
.tta-dashboard-container {
    max-width: 1000px;
    margin: 0 auto;
    background: #f9fafb;
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.07);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.tta-link-box {
    background: #fff;
    padding: 20px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    margin-top: 20px;
}
.tta-input-group {
    display: flex;
    align-items: center;
    gap: 10px;
}
.tta-copy-btn {
    padding: 10px 20px;
    background: #0073aa;
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.2s;
}
.tta-copy-btn:hover {
    background: #005a8e;
}

/* V67.0: Styles for the Download CSV button on the dashboard */
.tta-download-csv-btn {
    display: inline-flex; /* Use flex to align icon and text */
    background: var(--tta-text-medium, #4b5563);
    align-items: center;
    gap: 8px; /* Space between icon and text */
    color: #fff;
    padding: 5px 6px; /* V67.2: Reduced horizontal padding by ~40% */
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9em;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.tta-download-csv-btn:hover {
    background: var(--tta-text-dark, #111827);
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.tta-download-csv-btn .dashicons {
    font-size: 1.2em;
    line-height: 1;
}
.tta-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 20px;
    margin: 30px 0;
}
.tta-stat-box {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 25px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition: transform 0.2s, box-shadow 0.2s;
}
.tta-stat-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}
.tta-stat-header {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1em;
    color: #4b5563;
}
.tta-stat-icon .dashicons {
    font-size: 20px;
    color: #0073aa;
}
.tta-stat-value {
    font-size: 2.1em;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}
.tta-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}
.tta-table thead tr {
    background: #f3f4f6;
    color: #374151;
    text-align: left;
    font-weight: bold;
}
.tta-table th, .tta-table td {
    padding: 14px 18px;
    border-bottom: 1px solid #e5e7eb;
}
.tta-table tbody tr:last-child td {
    border-bottom: none;
}
.tta-table tbody tr.l1-sale { background-color: #e3f2fd; }
.tta-table tbody tr.l2-sale { background-color: #fce4ec; }
.tta-table tbody tr.rejected-sale { background-color: #ffebee; color: #c62828; }

/* V19.92: Add a beautiful background to the commission history table header */
.tta-details-section .tta-table thead tr {
    background: linear-gradient(135deg, #4CAF50, #2E7D32); /* A nice green gradient */
    color: #ffffff;
}


/* V19.0: Styles for the combined payout summary box */
.tta-payout-summary-box {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 29% 25% 23% 23%; /* V19.98: Adjust column widths as requested */
    align-items: center;
    padding: 15px; /* Reduced padding */
}
.tta-payout-summary-item {
    padding: 10px 20px;
    text-align: center;
}
.tta-payout-summary-item:not(:last-child) {
    border-right: 1px solid #e5e7eb;
}
@media screen and (max-width: 768px) {
    .tta-payout-summary-box { grid-template-columns: 1fr; }
    .tta-payout-summary-item { padding: 15px 0; }
    .tta-payout-summary-item:not(:last-child) { border-right: none; border-bottom: 1px solid #e5e7eb; }
}

/* V19.1: Styles for the combined sales summary box */
.tta-sales-summary-box {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    padding: 15px;
}
.tta-sales-summary-item {
    padding: 10px 20px;
    text-align: center;
}
.tta-sales-summary-item:not(:last-child) {
    border-right: 1px solid #e5e7eb;
}
@media screen and (max-width: 768px) {
    .tta-sales-summary-box { grid-template-columns: 1fr; }
    .tta-sales-summary-item { padding: 15px 0; }
    .tta-sales-summary-item:not(:last-child) { border-right: none; border-bottom: 1px solid #e5e7eb; }
}

/* V19.2: Styles for the combined secondary summary box */
.tta-secondary-summary-box {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    padding: 15px;
}
.tta-secondary-summary-item {
    padding: 10px 20px;
    text-align: center;
}
.tta-secondary-summary-item:not(:last-child) {
    border-right: 1px solid #e5e7eb;
}
@media screen and (max-width: 768px) {
    .tta-secondary-summary-box { grid-template-columns: 1fr; }
    .tta-secondary-summary-item { padding: 15px 0; }
    .tta-secondary-summary-item:not(:last-child) { border-right: none; border-bottom: 1px solid #e5e7eb; }
}

/* V18.99: Add margin to sub-affiliates table to separate it from the sales table */
.tta-sub-affiliates-section .tta-table {
    margin-top: 20px;
}

/* V19.91: Add a beautiful background to the sub-affiliates table header */
.tta-sub-affiliates-section .tta-table thead tr {
    background: linear-gradient(135deg, #008ac5, #005a8e);
    color: #ffffff;
}

/* V19.94: Add different background colors for each sub-affiliate row */
.tta-sub-affiliates-section .tta-table tbody .sub-affiliate-row-0 { background-color: #e3f2fd; } /* Light Blue */
.tta-sub-affiliates-section .tta-table tbody .sub-affiliate-row-1 { background-color: #e8f5e9; } /* Light Green */
.tta-sub-affiliates-section .tta-table tbody .sub-affiliate-row-2 { background-color: #fff3e0; } /* Light Orange */
.tta-sub-affiliates-section .tta-table tbody .sub-affiliate-row-3 { background-color: #f3e5f5; } /* Light Purple */
.tta-sub-affiliates-section .tta-table tbody .sub-affiliate-row-4 { background-color: #fce4ec; } /* Light Pink */

/* V69.0: Styles for sortable table headers on dashboard */
.tta-table thead th a {
    text-decoration: none;
    color: inherit; /* Inherit color from the th element (which is white) */
    cursor: pointer; /* V70.0: Make it look clickable */
    user-select: none; /* V70.0: Prevent text selection on click */
    transition: color 0.2s;
    outline: none; /* V71.0: Remove dotted border on click/focus */
}

.tta-table thead th a:hover {
    color: #f0f0f0; /* A slightly lighter white on hover */
}

.tta-table thead th a .dashicons {
    font-size: 16px;
    line-height: 1;
    vertical-align: text-bottom; /* Aligns the arrow better with the text */
}

/* V74.0: Style for the default (non-active) sort icon */
.tta-table thead th a .dashicons.dashicons-sort {
    opacity: 0.6;
}
/* V51.0: Styles for sub-affiliate avatar in dashboard table */
.tta-sub-affiliate-avatar {
    width: 45px; /* V63.x: Increased size */
    height: 45px; /* V63.x: Increased size */
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    vertical-align: middle; /* Align with text in the row */
}

.tta-sub-affiliate-avatar-placeholder .dashicons {
    font-size: 34px; /* V63.x: Increased size */
    line-height: 45px; /* V63.x: Match height */
    height: 45px; /* V63.x: Increased size */
    width: 45px; /* V63.x: Increased size */
    color: #9ca3af;
    vertical-align: middle;
}

/* V18.76: Ensure withdrawal and payment settings pages have consistent width */
.tta-withdrawal-page-container .tta-dashboard-container,
.tta-payment-settings-container .tta-dashboard-container {
    width: 100%;
}

/* V18.84: Redesigned Withdrawal Page Layout */
.tta-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease-in-out;
}

.tta-balance-box-main {
    background: linear-gradient(135deg, #22c55e, #16a34a); /* V18.88: Changed color to match dashboard button */
    color: #fff;
    border-radius: 12px;
    padding: 10px 20px; /* Further reduced padding to make the box smaller */
    text-align: center;
    margin-bottom: 40px;
    box-shadow: 0 8px 25px rgba(34, 197, 94, 0.2); /* V18.88: Changed shadow color to match background */
}
.tta-balance-label {
    font-size: 1.3em; /* Increased size as requested */
    opacity: 0.9;
    font-weight: bold;
}
.tta-balance-amount-main {
    display: block;
    font-size: 2.8em;
    font-weight: 700;
    margin-top: 5px;
}

.tta-withdrawal-grid {
    display: grid;
    grid-template-columns: 1fr; /* Single column on mobile */
    gap: 40px;
}

@media screen and (min-width: 960px) {
    .tta-withdrawal-grid {
        grid-template-columns: 1fr 1fr; /* Two columns on larger screens */
    }
}

/* V18.84: Removed old withdrawal box styles, now using tta-card */
.tta-withdrawal-form-container {
    /* This container holds the form inside the card */
    margin-top: 0;
}

.tta-balance-box {
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 25px;
    text-align: center;
    margin-bottom: 25px;
}
.tta-balance-box strong {
    font-size: 1.1em;
    color: #374151;
}
.tta-balance-amount {
    display: block;
    font-size: 2.8em;
    font-weight: 700;
    color: #0073aa;
    margin-top: 5px;
}
.tta-alert {
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 8px;
    border-left: 5px solid;
}
.tta-alert-success { background-color: #dcfce7; color: #166534; border-color: #22c55e; }
.tta-alert-error { background-color: #fee2e2; color: #991b1b; border-color: #ef4444; }
.tta-alert-warning { background-color: #fefce8; color: #854d0e; border-color: #facc15; }
.tta-alert-info { background-color: #eef2ff; color: #3730a3; border-color: #6366f1; }

.tta-withdrawal-form .tta-input-group {
    display: flex;
    gap: 10px;
    align-items: stretch; /* V18.67: Ensure items have same height */
    margin-top: 8px;
}
.tta-withdrawal-form input[type="number"] {
    flex: 0 1 36%; /* V18.86: Reduce width by another 40% (60% * 0.6 = 36%) */
    padding: 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
}
/* V18.67: Style for the withdrawal request button */
.tta-withdrawal-form .tta-submit-button {
    flex-grow: 1; /* Take remaining space */
    font-weight: bold;
    background-color: #22c55e;
    color: white;
    border-radius: 8px;
    border: none;
    transition: background-color 0.2s, transform 0.2s;
}
/* V18.68: Style for the disabled withdrawal button */
.tta-withdrawal-form .tta-submit-button:disabled {
    background-color: #9ca3af;
    cursor: not-allowed;
    transform: none;
    opacity: 0.7;
}

/* V18.33: Style for the new select dropdown on withdrawal page */
.tta-withdrawal-select {
    width: 100%;
    padding: 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    margin-bottom: 20px;
}

/* V18.65: Specific styles for the withdrawal method grid */
.tta-withdrawal-methods-grid {
    margin-bottom: 25px;
}

/* V18.66: Styles for withdrawal payment details display */
.tta-withdrawal-payment-details-box {
    /* V19.64: Match the style of the other details box */
    display: none;
    padding: 20px;
    background-color: #f9fafb;
    border: 1px solid #f3f4f6;
    border-radius: 12px;
    margin-top: 15px;
    color: #4b5563;
    line-height: 1.6;
}

/* Status Labels for History Table */
.status-label {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 16px;
    font-weight: 500;
    font-size: 0.85em;
    text-transform: capitalize;
}
.status-pending { background-color: #fef3c7; color: #92400e; }
.status-processing { background-color: #dbeafe; color: #1e40af; }
.status-completed { background-color: #dcfce7; color: #166534; }
.status-rejected { background-color: #fee2e2; color: #991b1b; }

/* V18.34: Payment Settings Page Styles */
/* V18.35: Grid layout for payment method selection */
.tta-payment-methods-grid {
    display: grid;
    grid-template-columns: 1fr; /* V19.11: Change to single column layout */
    gap: 15px;
    margin-bottom: 25px;
}
.tta-payment-method-box {
    display: flex;
    flex-direction: row; /* V19.11: Align items horizontally */
    align-items: center;
    justify-content: flex-start;
    padding: 20px;
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    background: #fff;
    position: relative;
    min-height: 80px;
}
/* V18.85: Styles for saved payment methods */
.tta-payment-method-box.method-saved {
    border-color: #22c55e; /* Green border for saved methods */
}
.tta-checkmark-icon {
    position: absolute;
    top: 5px;
    right: 8px;
    background-color: #22c55e;
    color: white;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}
.tta-payment-method-box:hover {
    border-color: #9ca3af;
    transform: translateY(-3px);
}
.tta-payment-method-box.active {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
    transform: translateY(-3px);
    background-color: #f3f8ff;
}
.tta-payment-method-box img {
    height: 40px;
    max-width: 100px;
    object-fit: contain;
    margin-right: 15px; /* V19.11: Add space between logo and name */
}
.tta-payment-detail-fields {
    display: none; /* Hidden by default, shown by JS */
    padding: 20px;
    background-color: #f9fafb;
    border: 1px solid #f3f4f6;
    border-radius: 12px;
    margin-top: 15px;
}
/* V19.62: New wrapper for each method and its fields */
.tta-payment-method-wrapper {
    display: flex;
    flex-direction: column;
    /* V19.63: Add transition and default border */
    border: 2px solid transparent;
    border-radius: 14px; /* Match inner radius + padding */
    padding: 10px;
    transition: border-color 0.3s ease-in-out;
}
.tta-payment-method-wrapper.wrapper-active {
    border-color: #3b82f6; /* Highlight border when active */
}
.tta-form-field {
    margin-bottom: 20px;
}
.tta-form-field label {
    display: block;
    font-weight: bold;
    margin-bottom: 8px;
    color: #374151;
}
.tta-form-field input[type="text"],
.tta-form-field input[type="email"],
.tta-form-field textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
}
/* V19.60: Add margin between fields in the payment settings form */
.tta-payment-detail-fields .tta-form-field + .tta-form-field {
    margin-top: 15px;
}


/* V18.77: Style for the Save Settings button */
.tta-save-settings-btn {
    font-weight: bold;
    width: 100%; /* V19.9: Match width of delete button */
    background: linear-gradient(135deg, #3b82f6, #2563eb) !important;
    color: #fff !important;
    border-radius: 8px;
    border: none !important;
    padding: 12px !important;
    font-size: 1.1em !important;}

/* V19.8: Style for the delete payment method button */
.tta-delete-button {
    width: 100%;
    padding: 8px 15px;
    background-color: #ef4444; /* Red color */
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-weight: bold;
    text-align: center;
}

/* --- Mobile Responsive Styles --- */
@media screen and (max-width: 768px) {
    .tta-dashboard-container { padding: 15px; }
    .tta-stats-grid { grid-template-columns: 1fr; }
    
    /* Responsive Table */
    .tta-table thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }
    .tta-table tr { display: block; margin-bottom: .625em; border: 1px solid #ddd; border-radius: 5px; }
    .tta-table td { display: block; text-align: right; border-bottom: 1px dotted #ccc; }
    .tta-table td::before { content: attr(data-label); float: left; font-weight: bold; text-transform: uppercase; }
}

/* V26.0: Styles for Dashboard Welcome Header with Avatar */
.tta-dashboard-welcome-header {
    display: flex;
    position: relative; /* V27.0: Set relative positioning for the container */
    align-items: center;
    justify-content: center; /* V27.0: Center the content (the text block) */
    margin-bottom: 20px;
    padding: 15px;
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    min-height: 100px; /* V27.0: Ensure the container has enough height */
}

/* V55.0: Notification Center Styles */
.tta-notification-wrapper {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 100;
}
.tta-notification-icon-container {
    position: relative;
    cursor: pointer;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border-radius: 50%;
    transition: background 0.2s;
}
.tta-notification-icon-container:hover {
    background: #e5e7eb;
}
.tta-notification-icon {
    font-size: 20px;
    color: #4b5563;
    width: 20px;
    height: 20px;
}
.tta-notification-badge {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 8px;
    height: 8px;
    background-color: #ef4444;
    border-radius: 50%;
    border: 1px solid #fff;
}
.tta-notification-dropdown {
    display: none;
    position: absolute;
    top: 50px;
    right: 0;
    width: 300px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    overflow: hidden;
}
.tta-notification-dropdown.active {
    display: block;
}
.tta-notification-header {
    padding: 12px 15px;
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
    font-weight: bold;
    color: #374151;
}
.tta-notification-body {
    max-height: 300px;
    overflow-y: auto;
}
.tta-notification-item {
    padding: 15px;
    border-bottom: 1px solid #f3f4f6;
    display: flex;
    gap: 10px;
    align-items: flex-start;
}
.tta-notification-item:last-child {
    border-bottom: none;
}
.tta-notification-item-icon .dashicons {
    color: #0073aa;
    font-size: 20px;
}
.tta-notification-item-details { /* V60.0: Wrapper for content and date */
    flex: 1;
    display: flex;
    flex-direction: column;
}
.tta-notification-item-content {
    font-size: 0.95em;
    color: #4b5563;
    line-height: 1.4;
}
.tta-notification-item-date { /* V60.0: Date style in dropdown */
    font-size: 0.8em;
    color: #9ca3af;
    margin-top: 5px;
}
.tta-notification-empty {
    padding: 20px;
    text-align: center;
    color: #9ca3af;
    font-style: italic;
}

.tta-dashboard-avatar {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    background: linear-gradient(145deg, #4f46e5, #7c3aed);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    box-shadow: 0 2px 8px rgba(92, 58, 237, 0.3);
    position: absolute; /* V27.0: Position the avatar absolutely */
    left: 15px; /* V27.0: Align to the left padding */
    top: 50%; /* V27.0: Center vertically */
    transform: translateY(-50%); /* V27.0: Adjust for perfect vertical centering */
}
.tta-dashboard-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.tta-dashboard-avatar .dashicons {
    font-size: 40px;
    width: auto;
    height: auto;
}
.tta-dashboard-welcome-text {
    text-align: center; /* V27.0: Center the text within its container */
}
.tta-dashboard-welcome-text h2 {
    font-size: 1.8em;
    text-align: center; /* V27.0: Ensure h2 text is centered */
    margin: 0; /* V27.0: Remove default margins */
}
/* V18.74: Styles for 30-Day Total Stats above the chart */
.tta-30-day-totals {
    display: flex;
    justify-content: space-around;
    text-align: center;
    padding: 15px 0;
    margin-bottom: 20px;
    border-top: 1px solid #f3f4f6;
    border-bottom: 1px solid #f3f4f6;
}

.tta-30-day-stat {
    display: inline-flex; /* Use inline-flex to keep items side-by-side */
    align-items: baseline; /* Align items vertically by their text baseline */
    gap: 8px; /* Add some space between the label and the value */
}

.tta-30-day-stat span {
    font-size: 0.9em;
    color: #6b7280;
    /* margin-bottom: 4px; */ /* Removed to allow side-by-side layout */
}

.tta-30-day-stat strong {
    font-size: 1.5em;
    color: #111827;
}

@media screen and (max-width: 768px) {
    .tta-30-day-totals { flex-direction: column; align-items: center; gap: 10px; }
}

/* V19.3: Styles for Collapsible Chart Section */
.tta-collapsible-header {
    cursor: pointer;
    position: relative;
    padding: 12px 25px; /* V63.0: Add padding for both states */
    border-radius: 10px; /* V63.0: Match container radius */
    transition: all 0.3s ease-in-out; /* V63.0: Smooth transition */
}

/* V63.0: Style for the collapsed state */
.tta-collapsible-section:not(.is-open) .tta-collapsible-header {
    background: var(--tta-accent-gradient);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);
}

/* V63.0: Style for the open state (revert to default) */
.tta-collapsible-section.is-open .tta-collapsible-header {
    background: transparent;
    color: var(--tta-text-dark);
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.tta-collapsible-header::after {
    content: '+';
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.2em;
    font-weight: bold;
    color: var(--tta-primary-color); /* Default color */
    transition: color 0.3s ease-in-out;
}

/* V63.0: Change icon color for collapsed state */
.tta-collapsible-section:not(.is-open) .tta-collapsible-header::after {
    color: #ffffff;
}

.tta-collapsible-section.is-open .tta-collapsible-header::after {
    content: '−'; /* Minus sign */
}

.tta-collapsible-content {
    display: none; /* Hidden by default */
    padding: 20px; /* V63.0: Add padding to the content area */
}
.tta-profile-page-wrapper .tta-form-container {
    max-width: 600px;
    box-shadow: none;
    border: none;
    background: transparent;
    padding: 0;
}
.tta-profile-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
    padding: 30px;
    max-width: 600px;
    width: 100%; /* Ensure it takes up available space up to max-width */
    min-width: 540px; /* Set a minimum width to prevent collapsing */
    margin: 20px auto;
    text-align: center;
    border: 1px solid #e5e7eb;
}
.tta-profile-header {
    margin-bottom: 30px;
}
.tta-profile-avatar {
    position: relative;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: linear-gradient(145deg, #4f46e5, #7c3aed);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
    box-shadow: 0 4px 15px rgba(92, 58, 237, 0.4);
    transition: transform 0.3s ease;
    overflow: hidden;
}
.tta-profile-avatar-inner {
    width: 100%;
    height: 90px;
    border-radius: 50%;
    background: linear-gradient(145deg, #4f46e5, #7c3aed);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
    box-shadow: 0 4px 15px rgba(92, 58, 237, 0.4);
    transition: transform 0.3s ease;
    overflow: hidden; /* V22.0: To keep image corners rounded */
}
.tta-profile-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.tta-profile-avatar .dashicons {
    font-size: 48px;
    width: auto;
    height: auto;
}
.tta-profile-name {
    font-size: 2em;
    font-weight: 700;
    color: #111827;
    margin: 0;
}
/* V22.0: Styles for Profile Picture Upload */
.tta-change-pic-button {
    background: linear-gradient(135deg, #6b7280, #4b5563);
    border: none;
    color: #fff;
    padding: 8px 16px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    margin-top: 15px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.tta-change-pic-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(75, 85, 99, 0.3);
}
.tta-upload-form {
    margin-top: 20px;
    padding: 20px;
    background-color: #f9fafb;
    border: 1px dashed #d1d5db;
    border-radius: 8px;
}
.tta-upload-form form {
    display: flex;
    align-items: center;
    gap: 15px;
}
.tta-upload-form input[type="file"] {
    flex-grow: 1;
}
.tta-upload-form .tta-submit-button {
    background: linear-gradient(135deg, #22c55e, #16a34a);
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-weight: bold;
    border-radius: 8px;
    border: none;
    padding: 8px 16px;
}
.tta-upload-form .tta-submit-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.3);
}

.tta-profile-notice {
    margin-bottom: 20px;
}

/* V25.0: Styles for Profile Info Form */
.tta-profile-info-form {
    text-align: left;
}
.tta-profile-info-form .tta-form-field {
    margin-bottom: 20px;
}
.tta-profile-info-form .tta-form-field label {
    display: block;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
}
.tta-profile-info-form .tta-form-field input,
.tta-profile-info-form .tta-form-field select {
    width: 100%;
    padding: 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    box-sizing: border-box;
}
.tta-profile-info-form .tta-form-field input:disabled {
    background-color: #f3f4f6;
    cursor: not-allowed;
}
/* V25.1: Styles for Edit/Cancel buttons and display view */
.tta-form-button-group {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}

/* V27.1: Enhanced styles for Profile Page buttons */
#tta-edit-profile-btn,
.tta-save-profile-btn,
.tta-cancel-button {
    width: 100%;
    padding: 12px;
    border: none;
    border-radius: 8px;
    font-weight: bold;
    cursor: pointer;
    font-size: 1em;
    transition: transform 0.2s, box-shadow 0.2s;
}

#tta-edit-profile-btn:hover,
.tta-save-profile-btn:hover,
.tta-cancel-button:hover {
    transform: translateY(-2px);
}

#tta-edit-profile-btn {
    margin-top: 20px;
    background: linear-gradient(135deg, #3b82f6, #2563eb); /* Blue gradient */
    color: #fff;
}
#tta-edit-profile-btn:hover {
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

.tta-save-profile-btn {
    background: linear-gradient(135deg, #22c55e, #16a34a); /* Green gradient */
    color: #fff;
}
.tta-save-profile-btn:hover {
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.3);
}

.tta-cancel-button {
    background: #6b7280; /* Gray */
    color: #fff;
}

.tta-profile-section {
    text-align: left;
    margin-bottom: 25px;
}
.tta-profile-section-title {
    font-size: 1.2em;
    font-weight: 600;
    color: #4b5563;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e5e7eb;
}
.tta-profile-details {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.tta-profile-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 15px;
    background-color: #f9fafb;
    border-radius: 8px;
    border: 1px solid #f3f4f6;
    transition: all 0.2s ease-in-out;
}
.tta-profile-label {
    font-weight: 600;
    color: #374151;
}
.tta-profile-value {
    color: #6b7280;
    text-align: right;
    word-break: break-all;
}
.tta-profile-footer {
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #e5e7eb;
    padding-top: 20px;
}
.tta-profile-link {
    color: #0073aa;
    text-decoration: none;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-radius: 8px;
    transition: background-color 0.2s, color 0.2s;
}
.tta-profile-link:hover {
    text-decoration: none;
    background-color: #f3f4f6;
}
.tta-profile-link-logout {
    color: #ef4444; /* Red color for logout */
}
.tta-profile-link-logout:hover {
    color: #991b1b; /* Darker red on hover */
    background-color: #fee2e2; /* Light red background on hover */
}
.tta-profile-item:hover {
    transform: translateY(-2px) scale(1.01);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    border-color: #e5e7eb;
}

/* V35.0: Styles for Commission Info Group in dashboard header */
.tta-commission-info-group {
    display: flex;
    align-items: center;
    gap: 8px;
    /* V37.0: Add border and padding to group the commission info */
    padding: 8px 15px;
    border: 1px solid var(--tta-border-color);
    border-radius: 25px;
    background-color: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

/* V36.0: Add shimmer animation for the "Commission:" label */
@keyframes tta-shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

.tta-commission-label {
    font-weight: bold; /* V41.0: Make the label bold */
    /* Shimmer/Glow Effect */
    background: linear-gradient(
        90deg,
        var(--tta-text-medium) 20%,
        #FFD700 40%, /* V39.0: Use a bright gold color for a more vibrant shimmer */
        #ffffff 50%,
        #FFD700 60%,
        var(--tta-text-medium) 80%
    );
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: tta-shimmer 3s linear infinite; /* V38.0: Make animation faster */
}

.tta-commission-levels-container { /* This class is no longer used, but keeping for reference */
    display: flex;
    gap: 10px;
    align-items: center;
}

.tta-commission-level-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.9em;
    font-weight: 500;
    border: 1px solid transparent;
    cursor: help; /* Indicates that it's hoverable for more info */
    transition: all 0.2s ease-in-out;
}

.tta-commission-level-badge .dashicons {
    font-size: 16px;
}

.tta-commission-level-badge.tta-level-1 {
    background-color: #e0f2fe; /* Light Blue */
    color: #0c4a6e; /* Dark Blue */
    border-color: #bae6fd;
}

.tta-commission-level-badge.tta-level-2 {
    background-color: #dcfce7; /* Light Green */
    color: #166534; /* Dark Green */
    border-color: #bbf7d0;
}

/* V52.0: Scrollable Commission History Table */
.tta-scrollable-table-wrapper {
    height: 245px; /* V63.x: Reduced height by ~30%. Shows approx 3-4 rows */
    max-height: 80vh; /* Limit max height to viewport */
    overflow-y: auto;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    margin-top: 20px;
    resize: vertical; /* V52.2: Allow user to resize the table height */
}

.tta-scrollable-table-wrapper .tta-table {
    margin-top: 0;
    box-shadow: none;
    border-radius: 0;
    border: none;
    overflow: visible; /* V52.1: Fix sticky header by removing overflow hidden */
}

/* Sticky Header for Commission History */
.tta-details-section .tta-scrollable-table-wrapper .tta-table thead th {
    position: sticky;
    top: 0;
    z-index: 10;
    /* Apply gradient to cells for sticky support */
    background: linear-gradient(135deg, #4CAF50, #2E7D32);
    color: #ffffff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

/* Reset TR background inside the scrollable wrapper to avoid conflict */
.tta-details-section .tta-scrollable-table-wrapper .tta-table thead tr {
    background: none;
}

/* Sticky Header for Sub-Affiliates */
.tta-sub-affiliates-section .tta-scrollable-table-wrapper .tta-table thead th {
    position: sticky;
    top: 0;
    z-index: 10;
    background: linear-gradient(135deg, #008ac5, #005a8e);
    color: #ffffff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.tta-sub-affiliates-section .tta-scrollable-table-wrapper .tta-table thead tr {
    background: none;
}

/* V53.0: Dashboard Notice Styles */
.tta-dashboard-notice-box {
    background-color: #fff3cd;
    border: 1px solid #ffecb5;
    color: #856404;
    padding: 15px 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    display: flex;
    align-items: flex-start;
    gap: 15px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    position: relative; /* V54.0: For positioning close button if needed */
}
.tta-dashboard-notice-box .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
    color: #856404;
    margin-top: 2px; /* Align with text line-height */
    flex-shrink: 0;
}
.tta-notice-content-wrapper { /* V60.0: Wrapper for notice content and date */
    flex: 1;
    display: flex;
    flex-direction: column;
}
.tta-notice-content {
    font-size: 1em;
    line-height: 1.5;
}
.tta-notice-content p:first-child { margin-top: 0; }
.tta-notice-content p:last-child { margin-bottom: 0; }
.tta-notice-content a { color: #533f03; text-decoration: underline; }

.tta-notice-date { /* V60.0: Date style in top notice box */
    font-size: 0.8em;
    color: #6c757d;
    margin-top: 8px;
    text-align: right;
    font-style: italic;
}

/* V54.0: Close button for dashboard notice */
.tta-notice-close-btn {
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.2s;
}
.tta-notice-close-btn:hover { opacity: 1; }