/**
 * LevelNetwork WRT Reading Tools - Frontend Stylesheet
 * Styles for the reading tools bar displayed on posts and pages.
 * Uses CSS Custom Properties (--lnwrt-*) for theming via Color Palettes.
 * Version: 1.1.2
 */

/* --- Screen Reader Text (Common WordPress Class for Accessibility) --- */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important; /* Ensure it's always visually hidden */
	width: 1px;
	word-wrap: normal !important;
    color: var(--lnwrt-screen-reader-text-color, #1d2327); /* Default dark color, variable for contrast mode */
}

/* --- Main Bar Container --- */
.lnwrt-reading-tools-bar {
    /* Layout & Box Model */
    display: flex;
    flex-wrap: wrap; /* Allow items to wrap on smaller screens */
    justify-content: space-between; /* Default: push info left, actions right */
    align-items: center; /* Vertically center items */
    padding: 6px 8px; /* Inner spacing */
    margin: 15px 0 25px 0; /* Spacing around the bar (adjust as needed) */
    border-radius: 4px; /* Slightly rounded corners */
    border: 1px solid var(--lnwrt-bar-border, #e0e5e3); /* Use calculated border or fallback */
    gap: 15px; /* Gap between left info and right actions when wrapping */

    /* Appearance */
    background-color: var(--lnwrt-bar-bg, #f6f9f8); /* Use CSS variable for background, with fallback */
    color: var(--lnwrt-bar-text, #435960); /* Default text color */
    font-size: 0.9rem; /* Slightly smaller font size for the bar */
    line-height: 1.4; /* Consistent line height */
    transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease; /* Smooth transition for contrast mode */
}

/* --- Alignment Variations --- */
/* When only right-side actions are visible */
.lnwrt-reading-tools-bar.lnwrt-right-only {
    justify-content: flex-end; /* Align everything to the right */
}
/* When only left-side info is visible */
.lnwrt-reading-tools-bar.lnwrt-left-only {
    justify-content: flex-start; /* Align everything to the left */
}
/* When only resizer group (+/- or reset) is visible among actions */
.lnwrt-reading-tools-bar.lnwrt-resizer-only .lnwrt-reading-actions {
     justify-content: flex-start; /* Align resizer left if it's the only thing */
     width: 100%;
}


/* --- Left Side: Reading Info Area --- */
.lnwrt-reading-info {
    display: flex;  /* Align items horizontally */
    align-items: center; /* Align items vertically */
    flex-wrap: wrap;     /* Allow info items to wrap if space is limited */
    gap: 5px;       /* Vertical gap, Horizontal gap between items */
}

/* Individual Info Items (Word Count, Read Time, View Count) */
.lnwrt-word-count,
.lnwrt-reading-time,
.lnwrt-view-count {
   display: inline-flex; /* Align icon and text within the span */
   align-items: center;
   gap: 3px;             /* Space between icon and text */
   white-space: nowrap;  /* Prevent text like "Read Time:" from wrapping */
}

/* Info Icons */
.lnwrt-reading-info .dashicons {
    font-size: 1.1em; /* Make icons slightly larger than text */
    line-height: 1;   /* Ensure consistent vertical alignment */
    color: var(--lnwrt-icon-info, #516a88); /* Use CSS variable for icon color */
    /* Custom positioning adjustments */
    align-content: center;
}
/* Specific icon adjustment if needed */
.lnwrt-reading-info .dashicons-book-alt {
    top: 2px;
}

/* Separator between Info Items */
.lnwrt-separator {
    font-weight: normal;
    margin: 0 1px; /* Slightly reduced horizontal margin */
    align-self: center; /* Align with the center of the flex line */
    color: var(--lnwrt-separator-color, #aab5b8); /* Use CSS variable */
}

 /* Text for counts/time/views */
.lnwrt-count,
.lnwrt-time,
.lnwrt-views {
    font-weight: bold;
    color: var(--lnwrt-placeholder-text, #3a5274); /* Use CSS variable */
}

/* --- Right Side: Actions Wrapper --- */
.lnwrt-reading-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;     /* Allow button groups to wrap */
    gap: 5px;
    justify-content: flex-end; /* Align button groups to the right by default */
}
/* Alignment overrides when only left/right items exist */
.lnwrt-reading-tools-bar.lnwrt-right-only .lnwrt-reading-actions {
    width: 100%;
    justify-content: flex-start;
}
.lnwrt-reading-tools-bar.lnwrt-left-only .lnwrt-reading-info {
    width: 100%;
    justify-content: flex-start;
}

/* --- Base Styles for ALL Buttons in the Actions Area --- */
.lnwrt-reading-actions button {
    background-color: var(--lnwrt-button-bg, #ffffff); /* Use Variable for BG */
    padding: 5px 9px; /* Slightly increased padding */
    cursor: pointer;
    border-radius: 3px;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
    display: inline-flex; /* Align icon inside button */
    align-items: center;
    justify-content: center;
    line-height: 1; /* Prevent extra height from line */
    vertical-align: middle; /* Ensure vertical alignment with adjacent elements */
    color: var(--lnwrt-icon-button, #3a5274); /* Use CSS variable for icon/text color */
    border: 1px solid var(--lnwrt-button-border, #ced6d8); /* Use CSS variable for border */
}
.lnwrt-reading-actions button .dashicons {
    font-size: 16px; /* Consistent icon size */
    vertical-align: middle;
    display: block; /* Ensure icon takes space correctly */
	position: relative; 
    top: 3px;
}
.lnwrt-reading-actions button:hover,
.lnwrt-reading-actions button:focus {
    border-color: var(--lnwrt-icon-info, #516a88); /* Use a consistent hover border color */
    background-color: var(--lnwrt-button-hover-bg, #eef2f5); /* Use CSS variable for hover bg */
    outline: none; /* Remove default browser outline */
}
.lnwrt-reading-actions button:focus-visible { /* Style for keyboard focus */
   outline: 2px solid var(--lnwrt-icon-info, #516a88);
   outline-offset: 1px;
}
.lnwrt-reading-actions button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    background-color: #f0f0f0 !important; /* Grey out disabled buttons, !important if needed */
    border-color: #dcdcdc !important;
    color: #a0a5aa !important;
}

/* --- Right Side: Actions Wrapper --- */
.lnwrt-reading-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px; /* Vertical, Horizontal gap */
    justify-content: flex-end; /* Default: Align button groups to the right */
}

/* --- NUOVA REGOLA per Shortcode [lnwrt_only_tools] --- */
/* Sovrascrivi l'allineamento per il contenitore generato dallo shortcode tools */
.lnwrt-shortcode-tools-only {
    justify-content: flex-start !important; /* Forza allineamento a sinistra */
    /* Aggiungi eventuali altri stili se necessario, es. margin: 0; */
    width: auto; /* Lascia che prenda la larghezza necessaria, non 100% */
    border: none; /* Rimuovi eventuali bordi ereditati dalla barra principale? */
    background-color: transparent; /* Rimuovi eventuali sfondi ereditati */
    padding: 0; /* Rimuovi padding se non desiderato */
    margin: 0; /* Rimuovi margini ereditati */
}
/* Assicurati che anche i figli (gruppi di bottoni) si comportino bene */
.lnwrt-shortcode-tools-only .lnwrt-font-resizer,
.lnwrt-shortcode-tools-only .lnwrt-toolbar-tools {
     /* Eventuali aggiustamenti specifici per i gruppi dentro lo shortcode */
}


/* Alignment variations for the main bar (remain unchanged) */
.lnwrt-reading-tools-bar.lnwrt-right-only { justify-content: flex-end; }
.lnwrt-reading-tools-bar.lnwrt-left-only { justify-content: flex-start; }


/* --- Font Resizer Group (+/-/Reset) --- */
.lnwrt-font-resizer {
    display: flex;
    align-items: center;
    gap: 5px;       /* Space between label and buttons in this group */
    flex-shrink: 0; /* Prevent shrinking */
}
.lnwrt-resize-label {
   font-size: 0.95em;
   margin-right: 5px;
   white-space: nowrap;
   color: inherit; /* Inherit text color from bar */
   vertical-align: middle; /* Align with buttons */
}
/* Specific icon adjustments */
.lnwrt-font-reset .dashicons-image-rotate {
    font-size: 15px;
}


/* --- Toolbar Tools Group (Contrast/Print) --- */
.lnwrt-toolbar-tools {
    display: flex;
    align-items: center;
    gap: 5px;       /* Space between buttons in this group */
    flex-shrink: 0; /* Prevent shrinking */
}
/* Specific icon adjustments if needed */
.lnwrt-contrast-toggle .dashicons-admin-appearance {
    font-size: 17px;
}
.lnwrt-print-button .dashicons-printer {
    font-size: 16px;
}

/* Contrast Button Active State */
.lnwrt-contrast-toggle.active {
    background-color: var(--lnwrt-icon-button, #3a5274); /* Use main button color as active BG */
    color: var(--lnwrt-button-bg, #ffffff); /* Use button BG color for icon (inverted) */
    border-color: var(--lnwrt-icon-button, #3a5274);
}
.lnwrt-contrast-toggle.active:hover {
     background-color: var(--lnwrt-icon-info, #516a88); /* Different hover for active state */
     border-color: var(--lnwrt-icon-info, #516a88);
}


/* --- Styles for the Article Content Target (affected by Resizer) --- */
/* This selector is dynamically set via lnwrt_data.content_selector. */
/* Add common selectors as fallbacks/examples. */
.entry-content,
#post-content-area,
.article-body {
   transition: font-size 0.3s ease; /* Smooth font size transition */
}
/* Ensure direct children inherit font size if using inline styles on them */
.entry-content > *,
#post-content-area > *,
.article-body > * {
    /* Optional: add transition here if JS modifies these directly */
    /* transition: font-size 0.3s ease; */
}


/* --- Contrast Mode Styles --- */
/* Applied to <body> when contrast mode is active */
body.lnwrt-contrast-mode {
    background-color: #1c1c1c !important;
    color: #e0e0e0 !important;
}
/* Reset background for most elements, prevents overriding text color inadvertently */
body.lnwrt-contrast-mode *:not(.dashicons):not(button):not(input):not(select):not(textarea):not([style*="background-color"]) {
    background-color: transparent !important;
}
body.lnwrt-contrast-mode a {
    color: #90caf9 !important; /* Light blue for links */
}
body.lnwrt-contrast-mode a:visited {
    color: #ce93d8 !important; /* Light purple for visited links */
}
/* Target common content containers - Add more selectors for theme compatibility if needed */
body.lnwrt-contrast-mode #page,
body.lnwrt-contrast-mode .content-area,
body.lnwrt-contrast-mode article,
body.lnwrt-contrast-mode .entry-content,
body.lnwrt-contrast-mode .widget,
body.lnwrt-contrast-mode header,
body.lnwrt-contrast-mode footer,
body.lnwrt-contrast-mode #sidebar,
body.lnwrt-contrast-mode #secondary,
body.lnwrt-contrast-mode .site-header,
body.lnwrt-contrast-mode .site-footer,
body.lnwrt-contrast-mode main,
body.lnwrt-contrast-mode #main,
body.lnwrt-contrast-mode #primary {
    background-color: #212121 !important; /* Slightly lighter dark for containers */
    border-color: #444 !important;
    color: #e0e0e0 !important;
    box-shadow: none !important;
}
/* Ensure headings are bright */
body.lnwrt-contrast-mode h1,
body.lnwrt-contrast-mode h2,
body.lnwrt-contrast-mode h3,
body.lnwrt-contrast-mode h4,
body.lnwrt-contrast-mode h5,
body.lnwrt-contrast-mode h6 {
     color: #ffffff !important;
     border-color: #555 !important;
}
/* Contrast mode for the reading tools bar itself */
body.lnwrt-contrast-mode .lnwrt-reading-tools-bar {
    background-color: #333 !important;
    border-color: #555 !important;
    color: #e0e0e0 !important;
}
body.lnwrt-contrast-mode .lnwrt-reading-info .dashicons {
    color: #bbdefb !important; /* Lighter blue icons */
}
body.lnwrt-contrast-mode .lnwrt-count,
body.lnwrt-contrast-mode .lnwrt-time,
body.lnwrt-contrast-mode .lnwrt-views {
    color: #f5f5f5 !important; /* Brighter text for numbers */
}
body.lnwrt-contrast-mode .lnwrt-separator {
    color: #777 !important;
}
/* Style buttons within the bar in contrast mode */
body.lnwrt-contrast-mode .lnwrt-reading-actions button {
    background-color: var(--lnwrt-button-hover-bg, #424242) !important; /* Use hover bg as base */
    border-color: #616161 !important;
    color: var(--lnwrt-bar-text, #eeeeee) !important; /* Use bar text for icon */
}
body.lnwrt-contrast-mode .lnwrt-reading-actions button:hover {
    background-color: #555 !important; /* Slightly lighter hover */
}
body.lnwrt-contrast-mode .lnwrt-contrast-toggle.active { /* Invert active contrast button */
    background-color: var(--lnwrt-bar-text, #eeeeee) !important;
    color: var(--lnwrt-bar-bg, #1c1c1c) !important;
    border-color: var(--lnwrt-bar-text, #eeeeee) !important;
}

/* --- Toolbar Tools Group (Contrast/Print) --- */
/* ... */
.lnwrt-contrast-toggle .dashicons { /* Stile base per l'icona contrasto */
    font-size: 17px; /* Potrebbe servire aggiustare questo per uniformità */
    /* vertical-align: middle; // Già coperto da button? */
}
/* Aggiustamenti specifici se necessario per icone alternative */
.lnwrt-contrast-toggle .dashicons-moon { font-size: 16px; /* Esempio */ }
.lnwrt-contrast-toggle .dashicons-lightbulb { font-size: 18px; position: relative; top: -1px; /* Esempio */ }
.lnwrt-contrast-toggle .dashicons-visibility { font-size: 16px; }
/* ... */

/* --- Print Styles (@media print) --- */
/* These are general print styles. The targeted printing via IFrame uses its own embedded styles. */
/* These might apply if user uses browser's native print function. */
@media print {
    /* Hide common non-essential elements */
    header, footer, #sidebar, .sidebar, .widget, .comments-area, .comment-respond,
    .nav-links, .post-navigation, #secondary, .site-header, .site-footer,
    .lnwrt-reading-tools-bar, /* Hide the plugin bar */
    .no-print, /* Generic class for elements to hide */
    nav, aside {
        display: none !important;
        visibility: hidden !important;
    }
    /* Ensure main content area attempts to take full width */
    body, #page, #content, #primary, main, .site-content, .entry-content, .article-body {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        box-shadow: none !important;
        float: none !important;
        background-color: #fff !important; /* Ensure white background */
        color: #000 !important; /* Ensure black text */
    }
    /* Basic print typography defaults */
    body {
        font-family: Georgia, 'Times New Roman', Times, serif !important;
        font-size: 12pt !important;
        line-height: 1.5 !important;
    }
    a { color: #000 !important; text-decoration: underline !important; }
    /* Optionally show full URLs for links */
    /* a[href^="http"]:after, a[href^="https"]:after { content: " (" attr(href) ")"; font-size: 9pt; } */
    /* a[href^="#"]:after { content: ""; } */ /* Hide for internal links */
    h1, h2, h3, h4, h5, h6 { color: #000 !important; page-break-after: avoid !important; page-break-inside: avoid !important; }
    p, blockquote, li { orphans: 3 !important; widows: 3 !important; }
    img, figure { max-width: 100% !important; height: auto !important; page-break-inside: avoid !important; }
    pre, code { background: #f5f5f5; border: 1px solid #ccc; padding: 2px 4px; font-size: 10pt; white-space: pre-wrap; word-wrap: break-word; }
    blockquote { border-left: 3px solid #ccc; padding-left: 1em; margin-left: 0; font-style: italic; }
}

/* --- Mobile Hiding & Stacking --- */
/* Hide bar completely on mobile if lnwrt-hide-on-mobile class is present */
@media (max-width: 767px) { /* Common breakpoint for tablets/phones */
    .lnwrt-reading-tools-bar.lnwrt-hide-on-mobile {
        display: none !important;
    }
}

/* Stack elements vertically on smaller screens if the bar is NOT hidden */
@media (max-width: 620px) { /* Adjust breakpoint as needed */
     .lnwrt-reading-tools-bar:not(.lnwrt-hide-on-mobile) {
         flex-direction: column; /* Stack items vertically */
         align-items: flex-start; /* Align items to the start (left) */
         gap: 10px; /* Reduce gap when stacked */
     }
     /* Ensure actions take full width and align left when stacked */
     .lnwrt-reading-tools-bar:not(.lnwrt-hide-on-mobile) .lnwrt-reading-actions {
          width: 100%;
          justify-content: flex-start; /* Align button groups left */
          margin-top: 5px; /* Space above actions when stacked */
          gap: 10px 10px; /* Reduce gap between button groups */
      }
     /* Reduce gap within button groups on mobile */
     .lnwrt-reading-tools-bar:not(.lnwrt-hide-on-mobile) .lnwrt-font-resizer,
     .lnwrt-reading-tools-bar:not(.lnwrt-hide-on-mobile) .lnwrt-toolbar-tools {
          gap: 5px;
      }
	
	.lnwrt-reading-tools-bar {
        font-size:0.85em;
        padding: 5px 10px;
      }

    .lnwrt-word-count, .lnwrt-reading-time, .lnwrt-view-count {
        gap:0px;
      }
}

/* Optional: Even smaller screens, maybe wrap info items */
@media (max-width: 400px) {
    .lnwrt-reading-tools-bar:not(.lnwrt-hide-on-mobile) .lnwrt-reading-info {
       gap: 3px 8px; /* Adjust gaps for tighter wrapping */
    }
     .lnwrt-reading-tools-bar:not(.lnwrt-hide-on-mobile) .lnwrt-separator {
        margin: 0 2px; /* Reduce separator margin */
     }
}