/*
Theme Name: Lugos Twenty Twenty-Five Child
Theme URI: https://wordpress.org/themes/twentytwentyfive/
Description: A child theme of Twenty Twenty-Five with light blue accents inspired by the Lugos brand colors
Author: Lugos
Template: twentytwentyfive
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lugos-twentytwentyfive
*/

/* ===========================
   Custom Light Blue Color Scheme
   Based on Lugos Logo
   =========================== */

:root {
    --lugos-light-blue: #5BA3D0;
    --lugos-sky-blue: #87CEEB;
    --lugos-pale-blue: #B0D4E8;
    --lugos-accent-blue: #4A90C0;
    --lugos-dark-blue: #2C5F7E;
}

/* Primary Accent Colors */
a {
    color: var(--lugos-light-blue);
    transition: color 0.3s ease;
}

a:hover,
a:focus {
    color: var(--lugos-accent-blue);
}

/* Buttons */
.wp-block-button__link,
button,
input[type="submit"],
input[type="button"],
.button {
    background-color: var(--lugos-light-blue);
    border-color: var(--lugos-light-blue);
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus,
button:hover,
button:focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="button"]:hover,
input[type="button"]:focus,
.button:hover,
.button:focus {
    background-color: var(--lugos-accent-blue);
    border-color: var(--lugos-accent-blue);
}

/* Navigation */
.wp-block-navigation a:hover,
.wp-block-navigation a:focus,
.site-header a:hover,
.site-header a:focus {
    color: var(--lugos-light-blue);
}

/* Highlights and Selections */
::selection {
    background-color: var(--lugos-pale-blue);
    color: var(--lugos-dark-blue);
}

::-moz-selection {
    background-color: var(--lugos-pale-blue);
    color: var(--lugos-dark-blue);
}

/* Headings with Accent */
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: var(--lugos-dark-blue);
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
    color: var(--lugos-light-blue);
}

/* Block Accent Borders */
.wp-block-quote,
blockquote {
    border-left-color: var(--lugos-light-blue);
}

.wp-block-pullquote {
    border-color: var(--lugos-light-blue);
}

/* Input Focus States */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus,
select:focus {
    border-color: var(--lugos-light-blue);
    outline-color: var(--lugos-light-blue);
}

/* Post Meta and Dates */
.entry-meta,
.entry-footer,
.post-date,
.cat-links,
.tags-links {
    color: var(--lugos-accent-blue);
}

.entry-meta a,
.entry-footer a {
    color: var(--lugos-accent-blue);
}

.entry-meta a:hover,
.entry-footer a:hover {
    color: var(--lugos-light-blue);
}

/* Pagination */
.pagination .current,
.page-numbers.current {
    background-color: var(--lugos-light-blue);
    border-color: var(--lugos-light-blue);
}

.pagination a:hover,
.page-numbers:hover {
    background-color: var(--lugos-pale-blue);
    border-color: var(--lugos-light-blue);
    color: var(--lugos-dark-blue);
}

/* Widget Titles */
.widget-title,
.wp-block-heading {
    border-bottom: 2px solid var(--lugos-pale-blue);
    padding-bottom: 0.5em;
}

/* Tables */
table th {
    background-color: var(--lugos-pale-blue);
    color: var(--lugos-dark-blue);
}

table tr:hover {
    background-color: rgba(91, 163, 208, 0.1);
}

/* Site Branding */
.site-title a {
    color: var(--lugos-dark-blue);
}

.site-title a:hover {
    color: var(--lugos-light-blue);
}

.site-description {
    color: var(--lugos-accent-blue);
}

/* Comment Form */
.comment-reply-link,
.comment-respond input[type="submit"] {
    background-color: var(--lugos-light-blue);
    border-color: var(--lugos-light-blue);
}

.comment-reply-link:hover,
.comment-respond input[type="submit"]:hover {
    background-color: var(--lugos-accent-blue);
    border-color: var(--lugos-accent-blue);
}

/* Search Form */
.search-form .search-submit {
    background-color: var(--lugos-light-blue);
    border-color: var(--lugos-light-blue);
}

.search-form .search-submit:hover {
    background-color: var(--lugos-accent-blue);
    border-color: var(--lugos-accent-blue);
}

/* Footer */
.site-footer a {
    color: var(--lugos-light-blue);
}

.site-footer a:hover {
    color: var(--lugos-sky-blue);
}

/* Lugos Logo - Replaces Site Title in Header */
.lugos-site-logo {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.lugos-logo-link {
    display: inline-block;
    line-height: 0;
    transition: opacity 0.3s ease;
}

.lugos-logo-link:hover {
    opacity: 0.85;
}

.lugos-logo-image {
    width: auto;
    height: 60px;
    max-width: 250px;
    display: block;
}

/* Hide the original site title when logo is present */
.wp-block-site-title {
    display: none;
}

.site-title {
    display: none;
}

/* Custom Logo Support */
.custom-logo-link {
    display: inline-block;
}

.custom-logo {
    max-width: 200px;
    height: auto;
}

/* Accessibility - Focus Visible */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 2px solid var(--lugos-light-blue);
    outline-offset: 2px;
}

/* Block Editor - Accent Colors */
.has-lugos-light-blue-color {
    color: var(--lugos-light-blue) !important;
}

.has-lugos-light-blue-background-color {
    background-color: var(--lugos-light-blue) !important;
}

.has-lugos-sky-blue-color {
    color: var(--lugos-sky-blue) !important;
}

.has-lugos-sky-blue-background-color {
    background-color: var(--lugos-sky-blue) !important;
}

/* Responsive adjustments */
@media screen and (max-width: 768px) {
    .custom-logo {
        max-width: 150px;
    }
    
    .lugos-logo-image {
        height: 50px;
        max-width: 200px;
    }
}

@media screen and (max-width: 480px) {
    .lugos-logo-image {
        height: 40px;
        max-width: 160px;
    }
}