/*
 * VL Brand Overrides — virtuelleslernen.com
 * Wendet das VL Design System auf das MasterStudy Theme an
 * Farbpalette: Navy #1B2A4A | Amber #A8740A | Warm-White #F8F6F2
 */

/* ============================================================
   1. FONT — Inter statt Montserrat / Open Sans / Noto Sans
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

body,
.normal_font,
p,
li,
td,
input,
textarea,
select,
.form-control,
.widget,
.sidebar-area,
.stm_lms_sidebar {
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #2D3A52;
}

.h1, .h2, .h3, .h4, .h5, .h6,
h1, h2, h3, h4, h5, h6,
.heading_font,
.logo-unit .logo,
.btn,
.header-menu,
nav,
.nav-tabs > li > a,
blockquote,
table,
.select2-chosen,
.select2-selection__rendered,
.sidebar-area .widget ul li a,
.widget_categories ul li a,
.widget_nav_menu ul li a,
.widget_pages ul li a {
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1B2A4A;
}

/* ============================================================
   2. BODY BACKGROUND — Warm Off-White
   ============================================================ */
body,
#page,
.site {
  background-color: #F8F6F2 !important;
}

.stm_lms_sidebar,
.sidebar-area,
.widget-area {
  background-color: transparent !important;
}

/* ============================================================
   3. HEADER / NAVIGATION
   ============================================================ */
#header,
#header-mobile,
.header_default,
.header_main_menu_wrapper,
.header_2 {
  background-color: #0F1B30 !important;
  border-bottom: none !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.06) !important;
}

/* Nav-Links */
.header-menu > li > a,
.header_main_menu_wrapper .header-menu > li > a {
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: rgba(255,255,255,.82) !important;
}

.header-menu > li > a:hover,
.header-menu > li.current-menu-item > a,
.header-menu > li.current-menu-ancestor > a {
  color: #D4960D !important;
}

/* Dropdown */
.header-menu > li > ul.sub-menu,
.header_main_menu_wrapper .header-menu > li > ul.sub-menu {
  background-color: #0F1B30 !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-top: 2px solid #A8740A !important;
  border-radius: 0 0 4px 4px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.3) !important;
}

.header-menu > li > ul.sub-menu > li > a {
  color: rgba(255,255,255,.75) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

.header-menu > li > ul.sub-menu > li > a:hover {
  color: #D4960D !important;
  background-color: rgba(255,255,255,.04) !important;
}

/* Logo-Text */
.logo-unit .logo {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
}

/* Mobile Header */
#header-mobile {
  background-color: #0F1B30 !important;
}

.stm_mobile_nav_button span,
.stm_mobile_nav_button span:before,
.stm_mobile_nav_button span:after {
  background-color: rgba(255,255,255,.85) !important;
}

/* Top Bar */
.header_top_bar,
.header_top_bar a {
  background-color: #0A1422 !important;
  color: rgba(255,255,255,.5) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
}

/* Sticky Header */
#header.sticky_header_fixed,
#header.sticky_header_fixed .header_default {
  background-color: #0F1B30 !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

/* ============================================================
   4. BUTTONS
   ============================================================ */
.btn-default,
.button,
.form-submit .submit,
.post-password-form input[type=submit],
input[type=submit],
a.btn,
.stm-btn,
.stm_lms_course__top_info .btn {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  background-color: #1B2A4A !important;
  border-color: #1B2A4A !important;
  color: #fff !important;
  border-radius: 4px !important;
  padding: 11px 22px !important;
}

.btn-default:hover,
.button:hover,
.form-submit .submit:hover,
input[type=submit]:hover {
  background-color: #253D6B !important;
  border-color: #253D6B !important;
  color: #fff !important;
}

/* Amber CTA Buttons */
.btn-primary,
.stm_lms__buy_button,
.stm_lms_course__top_info .btn-primary,
.see_more a,
a.stm-btn-enroll {
  background-color: #A8740A !important;
  border-color: #A8740A !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 4px !important;
  text-transform: none !important;
}

.btn-primary:hover,
.stm_lms__buy_button:hover,
.see_more a:hover {
  background-color: #8A5F08 !important;
  border-color: #8A5F08 !important;
  color: #fff !important;
}

/* ============================================================
   5. LINKS
   ============================================================ */
a {
  color: #1B2A4A;
}

a:hover {
  color: #A8740A;
}

/* ============================================================
   6. HEADINGS
   ============================================================ */
h1, .h1 { color: #1B2A4A !important; font-size: clamp(28px, 4vw, 46px) !important; font-weight: 700 !important; line-height: 1.15 !important; }
h2, .h2 { color: #1B2A4A !important; font-size: clamp(22px, 3vw, 30px) !important; font-weight: 700 !important; }
h3, .h3 { color: #1B2A4A !important; font-size: clamp(17px, 2vw, 20px) !important; font-weight: 600 !important; }
h4, .h4 { color: #1B2A4A !important; font-weight: 600 !important; }
h5, .h5 { color: #1B2A4A !important; font-weight: 600 !important; }
h6, .h6 { color: #1B2A4A !important; font-weight: 500 !important; }

/* ============================================================
   7. PAGE TITLE AREA / BREADCRUMBS
   ============================================================ */
.stm_page_title_area,
.stm-page-title-area,
.page_title_area,
.breadcrumbs_area,
.page-header {
  background-color: #1B2A4A !important;
  background-image: none !important;
}

.stm_page_title_area h1,
.stm_page_title_area h2,
.stm_page_title_area .page-title,
.page_title_area h1 {
  color: #fff !important;
}

.stm_page_title_area .breadcrumbs,
.stm_page_title_area .breadcrumbs a,
.stm_page_title_area .breadcrumbs span,
.breadcrumbs_area .breadcrumbs,
.breadcrumbs_area .breadcrumbs a {
  color: rgba(255,255,255,.65) !important;
}

.breadcrumbs a:hover {
  color: #D4960D !important;
}

/* ============================================================
   8. CARDS / POSTS
   ============================================================ */
.stm-post,
.stm_post,
.post-item,
article.post,
.blog-list article,
.stm_lms_courses__single,
.stm-course-card {
  background-color: #FDFCF9 !important;
  border: 1px solid #E5E0D8 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  transition: box-shadow .2s ease, transform .2s ease !important;
}

.stm-post:hover,
.stm_post:hover,
.stm_lms_courses__single:hover,
.stm-course-card:hover {
  box-shadow: 0 4px 20px rgba(27,42,74,.08) !important;
  transform: translateY(-2px) !important;
}

/* Post-Kategorien Badge */
.stm-post .stm-category-color,
.stm_post .stm-category-color,
.category-badge,
.course-category {
  background-color: rgba(27,42,74,.08) !important;
  color: #1B2A4A !important;
  border-radius: 3px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
}

/* Post-Titel */
.entry-title,
.entry-title a,
.stm-post .post-title,
.stm-post .post-title a,
h2.entry-title a {
  color: #1B2A4A !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
}

.entry-title a:hover,
.stm-post .post-title a:hover {
  color: #A8740A !important;
}

/* Post-Meta */
.entry-meta,
.stm-post .post-meta,
.post-meta span,
.post-meta a {
  color: #6B7280 !important;
  font-size: 12px !important;
}

/* ============================================================
   9. CONTENT AREA — Artikel-Inhalt
   ============================================================ */
.entry-content,
.post-content,
.page-content,
.stm_lms__content {
  background-color: #FDFCF9 !important;
  color: #2D3A52 !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
}

.entry-content h2,
.entry-content h3,
.entry-content h4,
.post-content h2,
.post-content h3 {
  color: #1B2A4A !important;
  margin-top: 2em !important;
}

/* Blockquote */
.entry-content blockquote,
.post-content blockquote,
blockquote {
  border-left: 3px solid #A8740A !important;
  background-color: rgba(168,116,10,.05) !important;
  color: #1B2A4A !important;
  padding: 16px 20px !important;
  border-radius: 0 4px 4px 0 !important;
}

/* Code */
.entry-content code,
.entry-content pre {
  background-color: #F0EDE7 !important;
  color: #1B2A4A !important;
  border: 1px solid #E5E0D8 !important;
  border-radius: 4px !important;
}

/* ============================================================
   10. SIDEBAR
   ============================================================ */
.sidebar-area,
.widget-area {
  font-family: 'Inter', sans-serif !important;
}

.sidebar-area .widget-title,
.widget-area .widget-title,
.widget h3 {
  color: #1B2A4A !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  border-bottom: 2px solid #A8740A !important;
  padding-bottom: 8px !important;
}

.sidebar-area .widget ul li a,
.widget_categories ul li a,
.widget_nav_menu ul li a,
.widget_pages ul li a,
.widget ul li a {
  color: #2D3A52 !important;
  font-size: 13px !important;
}

.sidebar-area .widget ul li a:hover,
.widget_categories ul li a:hover,
.widget_nav_menu ul li a:hover {
  color: #A8740A !important;
}

/* ============================================================
   11. FORMS / SEARCH
   ============================================================ */
.form-control,
.select2-search__field,
input[type=email],
input[type=number],
input[type=password],
input[type=tel],
input[type=text],
textarea {
  background-color: #F0EDE7 !important;
  border: 1.5px solid #D5CDBF !important;
  border-radius: 4px !important;
  color: #1B2A4A !important;
  font-family: 'Inter', sans-serif !important;
  box-shadow: none !important;
}

.form-control:focus,
input[type=text]:focus,
input[type=email]:focus,
textarea:focus {
  border-color: #1B2A4A !important;
  background-color: #FDFCF9 !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(27,42,74,.1) !important;
}

/* ============================================================
   12. PAGINATION
   ============================================================ */
.pagination .page-numbers,
.stm-pagination .page-numbers,
.nav-links .page-numbers {
  border: 1.5px solid #D5CDBF !important;
  color: #1B2A4A !important;
  background-color: #FDFCF9 !important;
  border-radius: 4px !important;
  font-family: 'Inter', sans-serif !important;
}

.pagination .page-numbers.current,
.pagination .page-numbers:hover,
.nav-links .page-numbers.current,
.nav-links .page-numbers:hover {
  background-color: #1B2A4A !important;
  border-color: #1B2A4A !important;
  color: #fff !important;
}

/* ============================================================
   13. FOOTER
   ============================================================ */
#footer,
#footer_top,
#footer_bottom,
.footer_widgets_wrapper,
.site-footer {
  background-color: #0F1B30 !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
}

#footer_copyright,
.footer-copyright {
  background-color: #0A1422 !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
}

#footer .widget-title,
#footer_top .widget-title,
.footer_widgets_wrapper .widget-title {
  color: rgba(255,255,255,.9) !important;
  border-bottom-color: #A8740A !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
}

#footer p,
#footer li,
#footer span,
#footer_top p,
#footer_top li,
.footer_widgets_wrapper p,
.footer_widgets_wrapper li {
  color: rgba(255,255,255,.6) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
}

.footer_widgets_wrapper .widget ul li a,
#footer .widget ul li a,
#footer a {
  color: rgba(255,255,255,.6) !important;
}

.footer_widgets_wrapper .widget ul li a:hover,
#footer a:hover {
  color: #D4960D !important;
}

#footer_copyright .copyright_text,
#footer_copyright .copyright_text a {
  color: rgba(255,255,255,.4) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
}

/* ============================================================
   14. ACCENT-FARBE (eab830 → A8740A) — Globale Ersetzung
   ============================================================ */
/* Alle Elemente die das alte Gelb nutzen */
.btn-carousel-control,
#frontend_customizer_button,
.see_more a,
.stm_featured_post .post-meta .date,
.stm_post_tags a,
.stm_course_categories,
.stm_lms_course_categories a,
.icon-btn:hover,
rs-mask-wrap .icon-btn:hover,
sr7-mask .icon-btn:hover {
  border-color: #A8740A !important;
  color: #A8740A !important;
}

/* Hover-Fills */
.see_more a:after,
.btn-carousel-control:after {
  background-color: #A8740A !important;
}

/* Blaue Buttons → Navy */
.btn.btn-default:hover,
.button:hover,
.textwidget .btn:hover {
  background-color: #1B2A4A !important;
  border-color: #1B2A4A !important;
}

/* ============================================================
   15. TABLES
   ============================================================ */
table {
  font-family: 'Inter', sans-serif !important;
  border-collapse: collapse !important;
}

table th {
  background-color: #1B2A4A !important;
  color: #fff !important;
  font-weight: 600 !important;
  padding: 10px 14px !important;
  font-size: 13px !important;
}

table td {
  border-bottom: 1px solid #E5E0D8 !important;
  padding: 10px 14px !important;
  color: #2D3A52 !important;
}

table tr:nth-child(even) td {
  background-color: rgba(27,42,74,.03) !important;
}

/* ============================================================
   16. WOOCOMMERCE (Kurse / Shop falls aktiv)
   ============================================================ */
.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button {
  background-color: #1B2A4A !important;
  color: #fff !important;
  border-radius: 4px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  text-transform: none !important;
}

.woocommerce .button:hover,
.woocommerce button.button:hover {
  background-color: #253D6B !important;
  color: #fff !important;
}

.woocommerce .button.alt,
.woocommerce input.button.alt,
.woocommerce a.button.alt {
  background-color: #A8740A !important;
}

.woocommerce .button.alt:hover {
  background-color: #8A5F08 !important;
}

.woocommerce-Price-amount,
.price .amount {
  color: #A8740A !important;
  font-weight: 700 !important;
}

/* ============================================================
   17. COURSE CARDS (LMS)
   ============================================================ */
.stm_lms_courses__single {
  background-color: #FDFCF9 !important;
  border: 1px solid #E5E0D8 !important;
  border-radius: 6px !important;
}

.stm_lms_courses__single .title a,
.stm-course-card .title a {
  color: #1B2A4A !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
}

.stm_lms_courses__single .title a:hover {
  color: #A8740A !important;
}

.stm_lms_courses__single .stm_lms_course_rating .stm_lms_course_rating__icon,
.course-rating .star {
  color: #A8740A !important;
}

/* ============================================================
   18. TABS & ACCORDIONS
   ============================================================ */
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover,
.vc_tta-tab.vc_active > a {
  color: #1B2A4A !important;
  border-bottom-color: #A8740A !important;
  border-bottom-width: 2px !important;
}

.nav-tabs > li > a:hover {
  color: #A8740A !important;
}

.vc_tta-panel-heading .vc_tta-panel-title > a {
  background-color: #F0EDE7 !important;
  color: #1B2A4A !important;
}

.vc_tta-panel.vc_active .vc_tta-panel-heading .vc_tta-panel-title > a {
  background-color: #1B2A4A !important;
  color: #fff !important;
}

/* ============================================================
   19. NOTIFICATIONS / ALERTS
   ============================================================ */
.alert-info,
.notice-info {
  background-color: rgba(27,42,74,.06) !important;
  border-color: #1B2A4A !important;
  color: #1B2A4A !important;
}

.alert-warning {
  background-color: rgba(168,116,10,.08) !important;
  border-color: #A8740A !important;
  color: #6B4A05 !important;
}

/* ============================================================
   20. MOBILE
   ============================================================ */
@media (max-width: 768px) {
  body {
    font-size: 15px !important;
  }

  h1, .h1 { font-size: 26px !important; }
  h2, .h2 { font-size: 20px !important; }
  h3, .h3 { font-size: 17px !important; }

  .stm_lms_courses__single,
  .stm-post,
  article.post {
    border-radius: 4px !important;
  }
}