:root {
    --uplianda-widget-bg: #fff;
    --uplianda-border-color: #ddd;
    --uplianda-border-radius: 8px;
    --uplianda-padding: 24px;
    --uplianda-gap-xs: 4px;
    --uplianda-gap-sm: 8px;
    --uplianda-gap-md: 16px;
    --uplianda-gap-lg: 24px;
    --uplianda-text-primary: #1e1e1e;
    --uplianda-text-secondary: #555;
    --uplianda-text-tertiary: #666;
    --uplianda-bg-hover: #f5f5f5;
    --uplianda-bg-secondary: #f9f9f9;
    --uplianda-primary: #2271b1;
    --uplianda-primary-dark: #135e96;
    --uplianda-chart-line: #72aee6;
    --uplianda-chart-bar: #2271b1;
    --uplianda-error-bg: #fcf0f1;
    --uplianda-error-border: #e74c3c;
    --uplianda-error-text: #c0392b;
    --uplianda-grid-line: #e0e0e0;
    --uplianda-tooltip-bg: #1e1e1e;
    --uplianda-tooltip-text: #fff;
    --uplianda-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);
    --uplianda-shadow-md: 0 4px 6px rgba(0, 0, 0, .2);
    --uplianda-transition: all 0.2s ease;
    --uplianda-font-family: -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir, "Segoe UI", "Helvetica Neue", "Adwaita Sans", Cantarell, Ubuntu, Roboto, Noto, Helvetica, Arial, sans-serif;
    --uplianda-font-size-xs: 11px;
    --uplianda-font-size-sm: 12px;
    --uplianda-font-size-base: 14px;
    --uplianda-font-size-lg: 24px;
    --uplianda-font-size-xl: 32px;
    --uplianda-font-weight-normal: 400;
    --uplianda-font-weight-medium: 500;
    --uplianda-font-weight-semibold: 600;
    --uplianda-font-weight-bold: 700;
    --uplianda-border-radius-sm: 6px;
    --uplianda-spacing-sm: 12px;
    --uplianda-outline-width: 2px;
    --uplianda-outline-offset: -2px;
    --uplianda-outline-offset-external: 2px;
    --uplianda-icon-size: 16px;
    --uplianda-chart-height: 300px;
    --uplianda-chart-height-mobile: 250px;
    --uplianda-chart-min-height: 200px;
    --uplianda-stat-padding: 16px;
    --uplianda-tooltip-padding: 12px;
    --uplianda-tooltip-margin: 10px;
    --uplianda-button-padding-v: 8px;
    --uplianda-button-padding-h: 12px;
    --uplianda-color-indicator-size: 12px;
    --uplianda-letter-spacing: 0.5px;
    --uplianda-z-index-tooltip: 1000;
    --uplianda-button-active-bg: #2271b1;
    --uplianda-button-active-text: #fff
}

.wp-block-uplianda-site-traffic {
    margin: var(--uplianda-gap-lg) 0
}

.uplianda-analytics-widget {
    background: var(--uplianda-widget-bg);
    border: 1px solid var(--uplianda-border-color);
    border-radius: var(--uplianda-border-radius);
    font-family: var(--uplianda-font-family);
    padding: var(--uplianda-padding)
}

.uplianda-analytics-header {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--uplianda-gap-md);
    justify-content: space-between;
    margin-bottom: var(--uplianda-gap-lg)
}

.uplianda-analytics-title-wrapper {
    display: flex;
    flex-direction: column;
    gap: var(--uplianda-gap-xs)
}

.uplianda-analytics-title {
    color: var(--uplianda-text-primary);
    font-size: var(--uplianda-font-size-lg);
    font-weight: var(--uplianda-font-weight-semibold);
    margin: 0
}

.uplianda-analytics-domain {
    color: var(--uplianda-text-tertiary);
    font-size: var(--uplianda-font-size-sm);
    letter-spacing: var(--uplianda-letter-spacing);
    text-transform: uppercase
}

.uplianda-analytics-controls {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--uplianda-gap-sm);
    justify-content: space-between;
    width: 100%
}

.uplianda-analytics-button-group {
    border: 1px solid var(--uplianda-border-color);
    border-radius: var(--uplianda-border-radius-sm);
    display: flex;
    gap: 0;
    overflow: hidden
}

.uplianda-analytics-button {
    background: var(--uplianda-widget-bg);
    border: none;
    border-right: 1px solid var(--uplianda-border-color);
    color: var(--uplianda-text-secondary);
    cursor: pointer;
    font-size: var(--uplianda-font-size-base);
    font-weight: var(--uplianda-font-weight-medium);
    padding: var(--uplianda-button-padding-v) var(--uplianda-gap-md);
    transition: var(--uplianda-transition)
}

.uplianda-analytics-button:last-child {
    border-right: none
}

.uplianda-analytics-button:hover:not(.active) {
    background: var(--uplianda-bg-hover)
}

.uplianda-analytics-button:focus-visible {
    outline: var(--uplianda-outline-width) solid var(--uplianda-primary);
    outline-offset: var(--uplianda-outline-offset);
    z-index: 1
}

.uplianda-analytics-button.active {
    background: var(--uplianda-button-active-bg);
    color: var(--uplianda-button-active-text)
}

.uplianda-analytics-chart-toggle {
    background: var(--uplianda-widget-bg);
    border: 1px solid var(--uplianda-border-color);
    border-radius: var(--uplianda-border-radius-sm);
    display: flex;
    gap: 0;
    overflow: hidden
}

.uplianda-analytics-chart-button {
    align-items: center;
    background: var(--uplianda-widget-bg);
    border: none;
    border-right: 1px solid var(--uplianda-border-color);
    color: var(--uplianda-text-secondary);
    cursor: pointer;
    display: flex;
    justify-content: center;
    padding: var(--uplianda-button-padding-v) var(--uplianda-button-padding-h);
    transition: var(--uplianda-transition)
}

.uplianda-analytics-chart-button:last-child {
    border-right: none
}

.uplianda-analytics-chart-button:hover:not(.active) {
    background: var(--uplianda-bg-hover)
}

.uplianda-analytics-chart-button:focus-visible {
    outline: var(--uplianda-outline-width) solid var(--uplianda-primary);
    outline-offset: var(--uplianda-outline-offset);
    z-index: 1
}

.uplianda-analytics-chart-button.active {
    background: var(--uplianda-button-active-bg);
    color: var(--uplianda-button-active-text)
}

.uplianda-analytics-chart-button svg {
    display: block
}

.uplianda-analytics-stats {
    display: grid;
    gap: var(--uplianda-gap-md);
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    margin-bottom: var(--uplianda-gap-lg)
}

.uplianda-analytics-stat {
    background: var(--uplianda-bg-secondary);
    border-radius: var(--uplianda-border-radius-sm);
    padding: var(--uplianda-stat-padding)
}

.uplianda-analytics-stat-label {
    color: var(--uplianda-text-tertiary);
    font-size: var(--uplianda-font-size-sm);
    letter-spacing: var(--uplianda-letter-spacing);
    margin-bottom: var(--uplianda-gap-sm);
    text-transform: uppercase
}

.uplianda-analytics-stat-value {
    color: var(--uplianda-text-primary);
    font-size: var(--uplianda-font-size-xl);
    font-weight: var(--uplianda-font-weight-bold);
    margin: 0
}

.uplianda-analytics-chart-container {
    height: var(--uplianda-chart-height);
    margin-top: var(--uplianda-gap-lg);
    position: relative
}

.uplianda-analytics-chart {
    height: 100%;
    width: 100%
}

.uplianda-analytics-footer {
    align-items: center;
    border-top: 1px solid var(--uplianda-grid-line);
    display: flex;
    flex-wrap: wrap;
    gap: var(--uplianda-spacing-sm);
    justify-content: space-between;
    margin-top: var(--uplianda-gap-lg);
    padding-top: var(--uplianda-gap-lg)
}

.uplianda-analytics-date-range {
    color: var(--uplianda-text-tertiary);
    font-size: var(--uplianda-font-size-sm);
    letter-spacing: var(--uplianda-letter-spacing);
    text-transform: uppercase
}

.uplianda-link {
    color: var(--uplianda-primary);
    font-size: var(--uplianda-font-size-base);
    font-weight: var(--uplianda-font-weight-medium);
    text-decoration: none;
    transition: var(--uplianda-transition)
}

.uplianda-link:hover {
    color: var(--uplianda-primary-dark);
    text-decoration: underline
}

.uplianda-link:focus-visible {
    border-radius: var(--uplianda-outline-offset-external);
    outline: var(--uplianda-outline-width) solid var(--uplianda-primary);
    outline-offset: var(--uplianda-outline-offset-external)
}

.uplianda-analytics-loading {
    align-items: center;
    color: var(--uplianda-text-tertiary);
    display: flex;
    font-size: var(--uplianda-font-size-base);
    height: var(--uplianda-chart-min-height);
    justify-content: center
}

.uplianda-analytics-error {
    background: var(--uplianda-error-bg);
    border: 1px solid var(--uplianda-error-border);
    border-radius: var(--uplianda-border-radius-sm);
    color: var(--uplianda-error-text);
    margin-top: var(--uplianda-gap-md);
    padding: var(--uplianda-gap-md);
    role: alert
}

.uplianda-analytics-tooltip {
    background: var(--uplianda-tooltip-bg);
    border-radius: var(--uplianda-border-radius-sm);
    box-shadow: var(--uplianda-shadow-md);
    color: var(--uplianda-tooltip-text);
    font-size: 13px;
    padding: var(--uplianda-tooltip-padding);
    pointer-events: none;
    position: absolute;
    z-index: var(--uplianda-z-index-tooltip)
}

.uplianda-analytics-tooltip strong {
    display: block;
    font-size: var(--uplianda-font-size-base);
    font-weight: var(--uplianda-font-weight-semibold);
    margin-bottom: var(--uplianda-gap-sm)
}

.uplianda-analytics-tooltip div {
    align-items: center;
    display: flex;
    gap: var(--uplianda-gap-sm);
    margin: var(--uplianda-gap-xs) 0
}

.uplianda-analytics-tooltip .tooltip-color {
    border-radius: var(--uplianda-outline-offset-external);
    display: inline-block;
    height: var(--uplianda-color-indicator-size);
    width: var(--uplianda-color-indicator-size)
}

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

@media(max-width:768px) {
    .uplianda-analytics-header {
        align-items: flex-start;
        flex-direction: column
    }

    .uplianda-analytics-controls {
        align-items: stretch;
        flex-direction: column;
        justify-content: flex-start;
        width: 100%
    }

    .uplianda-analytics-button-group, .uplianda-analytics-chart-toggle {
        width: 100%
    }

    .uplianda-analytics-button, .uplianda-analytics-chart-button {
        flex: 1;
        justify-content: center
    }

    .uplianda-analytics-chart-container {
        height: var(--uplianda-chart-height-mobile)
    }

    .uplianda-analytics-footer {
        align-items: flex-start;
        flex-direction: column
    }

    .uplianda-analytics-stats {
        grid-template-columns: 1fr
    }
}

@media(prefers-reduced-motion:reduce) {
    * {
        animation: none !important;
        transition: none !important
    }
}

.uplianda-popular-content {
    background: var(--uplianda-widget-bg);
    border: 1px solid var(--uplianda-border-color);
    border-radius: var(--uplianda-border-radius);
    font-family: var(--uplianda-font-family);
    padding: var(--uplianda-padding)
}

.uplianda-popular-content ul, .uplianda-popular-content ol {
    font-size: 1rem
}

.uplianda-popular-content-dashboard {
    background: var(--uplianda-widget-bg, #fff);
    border: 1px solid var(--uplianda-border-color, #dcdcde);
    border-radius: var(--uplianda-border-radius, 8px);
    color: var(--uplianda-text-primary, #1e1e1e);
    font-family: var(--uplianda-font-family, inherit);
    padding: var(--uplianda-padding, 24px)
}

.uplianda-popular-content-dashboard__header {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    gap: var(--uplianda-gap-lg, 24px);
    justify-content: space-between;
    margin-bottom: var(--uplianda-gap-lg, 24px)
}

.uplianda-popular-content-dashboard__title-wrapper {
    display: flex;
    flex-direction: column;
    gap: var(--uplianda-gap-xs, 4px)
}

.uplianda-popular-content-dashboard__title {
    color: var(--uplianda-text-primary, #1e1e1e);
    font-size: 1.25rem;
    font-weight: var(--uplianda-font-weight-semibold, 600);
    line-height: 1.2;
    margin: 0
}

.uplianda-popular-content-dashboard__domain {
    color: var(--uplianda-text-tertiary, #666);
    font-size: var(--uplianda-font-size-sm, 12px);
    font-weight: var(--uplianda-font-weight-semibold, 600);
    letter-spacing: var(--uplianda-letter-spacing, .5px);
    text-transform: uppercase
}

.uplianda-popular-content-dashboard__controls {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--uplianda-gap-lg, 24px);
    justify-content: space-between;
    width: 100%
}

.uplianda-popular-content-dashboard .uplianda-dashboard-control {
    display: flex;
    flex-direction: column;
    gap: var(--uplianda-gap-xs, 4px)
}

.uplianda-popular-content-dashboard .uplianda-dashboard-control__label {
    color: var(--uplianda-text-tertiary, #666);
    font-size: 10px;
    font-weight: var(--uplianda-font-weight-medium, 500);
    letter-spacing: var(--uplianda-letter-spacing, .5px);
    line-height: 1.2;
    text-transform: uppercase
}

.uplianda-popular-content-dashboard .uplianda-dashboard-control__button-group {
    border: 1px solid var(--uplianda-border-color, #dcdcde);
    border-radius: var(--uplianda-border-radius-sm, 6px);
    display: flex;
    overflow: hidden
}

.uplianda-popular-content-dashboard .uplianda-dashboard-control__button {
    background: var(--uplianda-widget-bg, #fff);
    border: 0;
    border-right: 1px solid var(--uplianda-border-color, #dcdcde);
    color: var(--uplianda-text-secondary, #555);
    cursor: pointer;
    font-size: var(--uplianda-font-size-base, 14px);
    font-weight: var(--uplianda-font-weight-medium, 500);
    padding: var(--uplianda-button-padding-v, 8px) var(--uplianda-gap-md, 16px);
    transition: var(--uplianda-transition, all .2s ease)
}

.uplianda-popular-content-dashboard .uplianda-dashboard-control__button:last-child {
    border-right: 0
}

.uplianda-popular-content-dashboard .uplianda-dashboard-control__button:hover:not(.active) {
    background: var(--uplianda-bg-hover, #f5f5f5)
}

.uplianda-popular-content-dashboard .uplianda-dashboard-control__button:focus-visible {
    outline: var(--uplianda-outline-width, 2px) solid var(--uplianda-primary, #2271b1);
    outline-offset: var(--uplianda-outline-offset, -2px);
    z-index: 1
}

.uplianda-popular-content-dashboard .uplianda-dashboard-control__button.active {
    background: var(--uplianda-button-active-bg, #2271b1);
    color: var(--uplianda-button-active-text, #fff)
}

.uplianda-popular-content__summary-list {
    display: grid;
    gap: var(--uplianda-gap-sm, 8px);
    list-style: none;
    margin: 0;
    padding: 0
}

.uplianda-popular-content__summary-item {
    margin: 0
}

.uplianda-popular-content__details {
    border-bottom: 1px solid var(--uplianda-grid-line, #e0e0e0);
    padding: var(--uplianda-gap-sm, 8px) 0
}

.uplianda-popular-content__summary {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: var(--uplianda-gap-md, 16px);
    justify-content: space-between;
    list-style: none
}

.uplianda-popular-content__summary::-webkit-details-marker {
    display: none
}

.uplianda-popular-content__summary-title {
    align-items: baseline;
    display: flex;
    gap: var(--uplianda-gap-sm, 8px);
    min-width: 0
}

.uplianda-popular-content__summary-number,
.uplianda-popular-content__summary-name {
    font-size: 1rem;
    font-weight: var(--uplianda-font-weight-semibold, 600);
    line-height: 1.2
}

.uplianda-popular-content__summary-name {
    color: var(--uplianda-text-primary, #1e1e1e)
}

.uplianda-popular-content__summary-actions {
    align-items: center;
    display: flex;
    gap: var(--uplianda-gap-sm, 8px);
    white-space: nowrap
}

.uplianda-popular-content__summary-content-link {
    color: var(--uplianda-primary, #2271b1);
    font-size: var(--uplianda-font-size-base, 14px);
    text-decoration: none
}

.uplianda-popular-content__summary-content-link:hover,
.uplianda-popular-content__summary-content-link:focus-visible {
    text-decoration: underline
}

.uplianda-popular-content__summary-action {
    color: var(--uplianda-text-primary, #1e1e1e);
    font-size: var(--uplianda-font-size-base, 14px)
}

.uplianda-popular-content__metrics {
    display: grid;
    gap: var(--uplianda-gap-sm, 8px);
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    margin: var(--uplianda-gap-md, 16px) 0 0
}

.uplianda-popular-content__metric {
    background: var(--uplianda-bg-secondary, #f9f9f9);
    border-radius: var(--uplianda-border-radius-sm, 6px);
    padding: var(--uplianda-spacing-sm, 12px)
}

.uplianda-popular-content__metric-label {
    color: var(--uplianda-text-tertiary, #666);
    font-size: 10px;
    letter-spacing: var(--uplianda-letter-spacing, .5px);
    line-height: 1.2;
    margin: 0 0 var(--uplianda-gap-xs, 4px);
    text-transform: uppercase
}

.uplianda-popular-content__metric-value {
    color: var(--uplianda-text-primary, #1e1e1e);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.2;
    margin: 0
}

.uplianda-popular-content__message {
    color: var(--uplianda-text-tertiary, #666);
    font-size: var(--uplianda-font-size-base, 14px);
    margin: 0
}

@media(max-width:782px) {
    .uplianda-popular-content-dashboard__header,
    .uplianda-popular-content-dashboard__controls {
        align-items: stretch;
        flex-direction: column
    }

    .uplianda-popular-content-dashboard .uplianda-dashboard-control__button-group {
        width: 100%
    }

    .uplianda-popular-content-dashboard .uplianda-dashboard-control__button {
        flex: 1
    }

    .uplianda-popular-content__summary {
        align-items: flex-start;
        flex-direction: column
    }

    .uplianda-popular-content__metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
}

#uplianda_widget .inside {
    margin: 0;
    padding: 0
}

#uplianda_widget .uplianda-analytics-title, #uplianda_popular_content_widget .uplianda-popular-content-dashboard__title {
    font-size: 1.25rem;
    line-height: 1.2
}

#uplianda_widget .uplianda-analytics-domain {
    font-weight: var(--uplianda-font-weight-semibold, 600)
}

#uplianda_widget .uplianda-analytics-controls {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: var(--uplianda-gap-lg, 24px);
    justify-content: space-between
}

#uplianda_widget .uplianda-dashboard-control {
    display: flex;
    flex-direction: column;
    gap: var(--uplianda-gap-xs, 4px)
}

#uplianda_widget .uplianda-dashboard-control__label {
    color: var(--uplianda-text-tertiary, #666);
    font-size: 10px;
    font-weight: var(--uplianda-font-weight-medium, 500);
    letter-spacing: var(--uplianda-letter-spacing, .5px);
    line-height: 1.2;
    text-transform: uppercase
}

#uplianda_widget .uplianda-dashboard-control__button-group {
    border: 1px solid var(--uplianda-border-color, #dcdcde);
    border-radius: var(--uplianda-border-radius-sm, 6px);
    display: flex;
    overflow: hidden
}

#uplianda_widget .uplianda-dashboard-control__button {
    background: var(--uplianda-widget-bg, #fff);
    border: 0;
    border-right: 1px solid var(--uplianda-border-color, #dcdcde);
    color: var(--uplianda-text-secondary, #555);
    cursor: pointer;
    font-size: var(--uplianda-font-size-base, 14px);
    font-weight: var(--uplianda-font-weight-medium, 500);
    padding: var(--uplianda-button-padding-v, 8px) var(--uplianda-gap-md, 16px);
    transition: var(--uplianda-transition, all .2s ease)
}

#uplianda_widget .uplianda-dashboard-control__button:last-child {
    border-right: 0
}

#uplianda_widget .uplianda-dashboard-control__button:hover:not(.active) {
    background: var(--uplianda-bg-hover, #f5f5f5)
}

#uplianda_widget .uplianda-dashboard-control__button:focus-visible {
    outline: var(--uplianda-outline-width, 2px) solid var(--uplianda-primary, #2271b1);
    outline-offset: var(--uplianda-outline-offset, -2px);
    z-index: 1
}

#uplianda_widget .uplianda-dashboard-control__button.active {
    background: var(--uplianda-button-active-bg, #2271b1);
    color: var(--uplianda-button-active-text, #fff)
}