/*
 * adva-theme.css
 * Adva Softtech Solution — Site-wide colour theme
 * Palette sourced from the approved reference design (adva-softtech-about-fixed.html)
 *
 * Primary   : #0a6ebd
 * Primary dk: #084f8a
 * Secondary : #f4a100  (amber accent — buttons, icons, badges)
 * Dark navy : #0d1b2a  (header, footer, hero backgrounds)
 * Light bg  : #f5f8fd  (alternate section backgrounds)
 * Border    : #e0e8f0
 * Body text : #444444
 *
 * HOW IT WORKS
 * This file is loaded LAST in header.php (after main.css) so every rule here
 * overrides the existing theme without touching content or images.
 */

/* ═══════════════════════════════════════════════════════════════
   1. CSS CUSTOM PROPERTIES — propagate to all inherited colours
═══════════════════════════════════════════════════════════════ */
:root {
    --color-primary      : #0a6ebd;
    --color-primary-dark : #084f8a;
    --color-primary-rgb  : 10, 110, 189;
    --color-secondary    : #f4a100;
    --color-dark         : #0d1b2a;
    --color-text         : #444444;
    --color-light-bg     : #f5f8fd;
    --color-border       : #e0e8f0;
    --color-white        : #ffffff;
    --color-white-70     : rgba(255,255,255,0.70);
    --color-white-85     : rgba(255,255,255,0.85);
}

/* ═══════════════════════════════════════════════════════════════
   2. BASE ELEMENTS
═══════════════════════════════════════════════════════════════ */
body {
    color: var(--color-text);
    font-family: 'Open Sans', 'Figtree', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--color-dark);
}

a {
    color: var(--color-primary);
}
a:hover {
    color: var(--color-primary-dark);
}

/* ═══════════════════════════════════════════════════════════════
   3. HEADER & NAVIGATION
═══════════════════════════════════════════════════════════════ */
.header-area,
.header-area8,
.header-area-all {
    background: var(--color-white) !important;
    box-shadow: 0 2px 16px rgba(0,0,0,0.07) !important;
}

.header-area .main-menu-ex ul li a,
.header-area .main-menu-ex1 ul li a {
    color: var(--color-dark) !important;
    font-weight: 600;
    transition: color 0.2s;
}

.header-area .main-menu-ex ul li a:hover,
.header-area .main-menu-ex ul li.active > a {
    color: var(--color-primary) !important;
}

/* Consultation button in nav */
.header-buttons .theme-btn11,
a.theme-btn11 {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
    border: none !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    transition: background 0.2s !important;
}
.header-buttons .theme-btn11:hover,
a.theme-btn11:hover {
    background: var(--color-primary-dark) !important;
}

/* Mobile header */
.mobile-header,
.mobile-header3 {
    background: var(--color-white) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.07) !important;
}

/* Mobile sidebar */
.mobile-sidebar,
.mobile-sidebar4 {
    background: var(--color-dark) !important;
}
.mobile-sidebar .mobile-nav ul li a {
    color: var(--color-white-85) !important;
}
.mobile-sidebar .mobile-nav ul li a:hover {
    color: var(--color-secondary) !important;
}
.mobile-sidebar .contact-infos h3 {
    color: var(--color-secondary) !important;
}
.mobile-sidebar .contact-infos a,
.mobile-sidebar .contact-infos .pera a {
    color: var(--color-white-70) !important;
}
.mobile-sidebar .icon-list a {
    background: rgba(255,255,255,0.08) !important;
    color: var(--color-white-70) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
}
.mobile-sidebar .icon-list a:hover {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
}
.sidebar1-btn {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
}
.sidebar1-btn:hover {
    background: var(--color-primary-dark) !important;
}

/* ═══════════════════════════════════════════════════════════════
   4. HERO SECTIONS — all page heroes use the dark→primary gradient
═══════════════════════════════════════════════════════════════ */
.pages-hero,
.hero-area3,
.hero-area6,
.common-hero,
[class*="hero-area"] {
    background: linear-gradient(120deg, var(--color-dark) 0%, var(--color-primary) 100%) !important;
}

.pages-hero h1,
.hero-area3 h1,
.hero-area6 h1,
.main-headding h1,
.main-heading h1,
[class*="hero-area"] h1 {
    color: var(--color-white) !important;
}

.pages-hero p,
.hero-area3 p,
.hero-area6 p,
.main-headding p,
.main-heading p,
[class*="hero-area"] p {
    color: var(--color-white-85) !important;
}

/* Section eyebrow / span labels */
.headding4 .span,
.headding2 .span,
.heading6 .span3,
.pbmit-heading-subheading .span,
span.span {
    color: var(--color-primary) !important;
    background: rgba(var(--color-primary-rgb), 0.08) !important;
    border-radius: 100px !important;
    padding: 4px 14px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    display: inline-block !important;
}

/* ═══════════════════════════════════════════════════════════════
   5. BUTTONS
═══════════════════════════════════════════════════════════════ */

/* Primary filled button */
.theme-btn2,
a.theme-btn2,
button.theme-btn2 {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    transition: background 0.2s, transform 0.15s !important;
    display: inline-block !important;
}
.theme-btn2:hover,
a.theme-btn2:hover,
button.theme-btn2:hover {
    background: var(--color-primary-dark) !important;
    color: var(--color-white) !important;
    transform: translateY(-1px) !important;
}

/* Outline / ghost button */
.theme-btn3,
a.theme-btn3 {
    background: transparent !important;
    color: var(--color-white) !important;
    border: 2px solid rgba(255,255,255,0.5) !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    transition: border-color 0.2s, background 0.2s !important;
}
.theme-btn3:hover,
a.theme-btn3:hover {
    border-color: var(--color-white) !important;
    background: rgba(255,255,255,0.08) !important;
}

/* Service / explore buttons */
.theme-btn8,
.theme-btn9,
a.theme-btn8,
a.theme-btn9 {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    transition: background 0.2s !important;
}
.theme-btn8:hover,
.theme-btn9:hover,
a.theme-btn8:hover,
a.theme-btn9:hover {
    background: var(--color-primary-dark) !important;
    color: var(--color-white) !important;
}

/* "Contact Us" text link button */
a.others {
    color: var(--color-secondary) !important;
    font-weight: 700 !important;
    border-bottom: 2px solid var(--color-secondary) !important;
    transition: color 0.2s !important;
}
a.others:hover {
    color: var(--color-white) !important;
}

/* Form submit buttons */
button[type="submit"],
input[type="submit"] {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: background 0.2s !important;
}
button[type="submit"]:hover,
input[type="submit"]:hover {
    background: var(--color-primary-dark) !important;
}

/* ═══════════════════════════════════════════════════════════════
   6. ABOUT PAGE SECTIONS
═══════════════════════════════════════════════════════════════ */

/* Alternating section background */
.about-page-area2,
.brand-area3,
.work5,
.features6,
.faq-section {
    background: var(--color-white);
}

.about-page-area1 {
    background: var(--color-white);
}

/* Philosophy / icon boxes */
.about-page-boxs .single-box {
    background: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-left: 4px solid var(--color-primary) !important;
    border-radius: 10px !important;
    padding: 1.5rem !important;
    margin-bottom: 1.25rem !important;
    transition: box-shadow 0.2s !important;
}
.about-page-boxs .single-box:hover {
    box-shadow: 0 4px 20px rgba(var(--color-primary-rgb), 0.10) !important;
}

.about-page-boxs .single-box .icon i {
    color: var(--color-primary) !important;
    font-size: 1.75rem !important;
}

.about-page-boxs .single-box h4 a {
    color: var(--color-primary) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* ═══════════════════════════════════════════════════════════════
   7. SERVICE PAGE
═══════════════════════════════════════════════════════════════ */
.service-box {
    border: 1px solid var(--color-border) !important;
    border-radius: 12px !important;
    padding: 1.75rem !important;
    background: var(--color-white) !important;
    transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s !important;
}
.service-box:hover {
    border-color: var(--color-primary) !important;
    box-shadow: 0 6px 24px rgba(var(--color-primary-rgb), 0.12) !important;
    transform: translateY(-3px) !important;
}

.heading6 .span3 {
    color: var(--color-primary) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 0.8rem !important;
    letter-spacing: 0.08em !important;
}

/* Apps / technology section (dark bg strip in services) */
.apps {
    background-color: var(--color-dark) !important;
}

/* ═══════════════════════════════════════════════════════════════
   8. INTERNSHIP PAGE
═══════════════════════════════════════════════════════════════ */

/* Track tab pills */
.work5-tabs-all .nav-pills .nav-link {
    background: rgba(var(--color-primary-rgb), 0.06) !important;
    color: var(--color-dark) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    padding: 0.5rem 1.25rem !important;
    margin: 0 4px 4px !important;
    transition: all 0.2s !important;
}
.work5-tabs-all .nav-pills .nav-link:hover {
    background: rgba(var(--color-primary-rgb), 0.12) !important;
    color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}
.work5-tabs-all .nav-pills .nav-link.active {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
    border-color: var(--color-primary) !important;
}

/* Work tab content area */
.work-tab-body {
    background: var(--color-light-bg) !important;
    border-radius: 12px !important;
    padding: 2rem !important;
    border: 1px solid var(--color-border) !important;
}

/* Testimonial slider */
.testimonial4-slider .single-slider {
    background: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 12px !important;
    padding: 2rem !important;
}

.stars li i.fa-star {
    color: var(--color-secondary) !important;
}

.testimonial-prev-arrow,
.testimonial-next-arrow {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
    border: none !important;
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
    transition: background 0.2s !important;
}
.testimonial-prev-arrow:hover,
.testimonial-next-arrow:hover {
    background: var(--color-primary-dark) !important;
}

/* ═══════════════════════════════════════════════════════════════
   9. CONTACT PAGE
═══════════════════════════════════════════════════════════════ */
.contact-page-boxs .single-box {
    background: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 10px !important;
    padding: 1.5rem !important;
    margin-bottom: 1rem !important;
    transition: box-shadow 0.2s !important;
}
.contact-page-boxs .single-box:hover {
    box-shadow: 0 4px 20px rgba(var(--color-primary-rgb), 0.10) !important;
}
.contact-page-boxs .single-box .icon i {
    color: var(--color-primary) !important;
    font-size: 1.5rem !important;
}
.contact-page-boxs .single-box .headding h5 {
    color: var(--color-dark) !important;
    font-weight: 700 !important;
}
.contact-page-boxs .single-box .headding a {
    color: var(--color-primary) !important;
}

/* Form inputs focus ring */
.input input:focus,
.input textarea:focus,
.single-inputs input:focus,
.single-inputs textarea:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-primary-rgb), 0.12) !important;
    outline: none !important;
}

/* ═══════════════════════════════════════════════════════════════
   10. FAQ PAGE
═══════════════════════════════════════════════════════════════ */
.accordion-item {
    border: 1px solid var(--color-border) !important;
    border-radius: 10px !important;
    margin-bottom: 0.75rem !important;
    overflow: hidden !important;
}

.accordion-button {
    background: var(--color-white) !important;
    color: var(--color-dark) !important;
    font-weight: 600 !important;
    font-size: 0.9375rem !important;
}
.accordion-button:not(.collapsed) {
    background: rgba(var(--color-primary-rgb), 0.05) !important;
    color: var(--color-primary) !important;
    box-shadow: none !important;
}
.accordion-button::after {
    filter: none !important;
}
.accordion-button:not(.collapsed)::after {
    filter: none !important;
}
.accordion-body {
    background: var(--color-white) !important;
    color: var(--color-text) !important;
    line-height: 1.75 !important;
    font-size: 0.9375rem !important;
}

/* ═══════════════════════════════════════════════════════════════
   11. POS PAGE
═══════════════════════════════════════════════════════════════ */
.pos-feature-box,
[class*="pos-box"],
[class*="pos-card"] {
    border: 1px solid var(--color-border) !important;
    border-radius: 12px !important;
    background: var(--color-white) !important;
}
[class*="pos-box"]:hover,
[class*="pos-card"]:hover {
    border-color: var(--color-primary) !important;
    box-shadow: 0 4px 20px rgba(var(--color-primary-rgb), 0.10) !important;
}

/* ═══════════════════════════════════════════════════════════════
   12. FORMS (login / enquiry / apply)
═══════════════════════════════════════════════════════════════ */
.login-form,
.form-inputs {
    background: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 16px !important;
    padding: 2rem !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.06) !important;
}

.login-form .headding h2,
.form-inputs h5 {
    color: var(--color-dark) !important;
    font-weight: 800 !important;
}

.single-inputs label,
.input label {
    color: var(--color-dark) !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
}

.single-inputs input,
.single-inputs textarea,
.input input,
.input textarea {
    border: 1px solid var(--color-border) !important;
    border-radius: 8px !important;
    color: var(--color-text) !important;
    background: var(--color-white) !important;
    transition: border-color 0.2s !important;
}

/* ═══════════════════════════════════════════════════════════════
   13. FOOTER HIGHLIGHTS STRIP (icon strip above footer)
═══════════════════════════════════════════════════════════════ */
.footer-icon-box-all {
    background: var(--color-primary) !important;
    padding: 28px 0 !important;
    border-radius: 0 !important;
}

.footer-icon-box {
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
}

.footer-icon-box .headding p {
    color: var(--color-white) !important;
    font-weight: 600 !important;
    font-size: 0.9375rem !important;
    margin: 0 !important;
}

.footer-icon-box .icon img {
    filter: brightness(0) invert(1) !important;
}

/* ═══════════════════════════════════════════════════════════════
   14. FOOTER
═══════════════════════════════════════════════════════════════ */
.footer8 {
    background: var(--color-dark) !important;
    color: rgba(255,255,255,0.65) !important;
}

.footer8 h2,
.footer8 h3 {
    color: var(--color-white) !important;
}

.footer8 p {
    color: rgba(255,255,255,0.65) !important;
    font-size: 0.875rem !important;
    line-height: 1.8 !important;
}

.footer8 .menu-list li a,
.footer8 .footer-address li a {
    color: rgba(255,255,255,0.60) !important;
    font-size: 0.875rem !important;
    transition: color 0.2s !important;
}

.footer8 .menu-list li a:hover,
.footer8 .footer-address li a:hover {
    color: var(--color-white) !important;
}

/* Footer address icon */
.footer8 .footer-address li span i {
    color: var(--color-secondary) !important;
}

/* Social icons */
.footer8 .social-icons li a {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    color: rgba(255,255,255,0.60) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    font-size: 0.8125rem !important;
    transition: all 0.2s !important;
}
.footer8 .social-icons li a:hover {
    background: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: var(--color-white) !important;
}

/* Footer copyright bar */
.copyright-area {
    border-top: 1px solid rgba(255,255,255,0.08) !important;
    padding: 1.25rem 0 !important;
    margin-top: 2rem !important;
}

.copyright-area .coppyright a,
.copyright-area .coppyright {
    color: rgba(255,255,255,0.45) !important;
    font-size: 0.8125rem !important;
}

.copyright-area .coppyright a:hover {
    color: var(--color-white) !important;
}

/* ═══════════════════════════════════════════════════════════════
   15. HIGHLIGHT SPANS in body copy
═══════════════════════════════════════════════════════════════ */
.highlight {
    color: var(--color-primary) !important;
    font-weight: 600 !important;
}

/* ═══════════════════════════════════════════════════════════════
   16. SECTION ALTERNATING BACKGROUNDS
═══════════════════════════════════════════════════════════════ */
.section-alt,
.about-page-area2,
.brand-area3.sp,
.tech-strip {
    background: var(--color-light-bg) !important;
}

/* ═══════════════════════════════════════════════════════════════
   17. BREADCRUMBS
═══════════════════════════════════════════════════════════════ */
.breadcrumb-item a {
    color: rgba(255,255,255,0.60) !important;
}
.breadcrumb-item.active {
    color: var(--color-white) !important;
}
.breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255,255,255,0.40) !important;
}

/* ═══════════════════════════════════════════════════════════════
   18. ANIMATIONS & MISC
═══════════════════════════════════════════════════════════════ */

/* Alert success */
.alert-success {
    background: rgba(var(--color-primary-rgb), 0.08) !important;
    border-color: var(--color-primary) !important;
    color: var(--color-primary-dark) !important;
    border-radius: 8px !important;
}

/* Scrollbar (Webkit) */
::-webkit-scrollbar-thumb {
    background: var(--color-primary) !important;
    border-radius: 4px !important;
}
::-webkit-scrollbar {
    width: 6px !important;
}
::-webkit-scrollbar-track {
    background: var(--color-light-bg) !important;
}

/* Selection highlight */
::selection {
    background: rgba(var(--color-primary-rgb), 0.18) !important;
    color: var(--color-dark) !important;
}