@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

/*
 * Wspólny wygląd SWD według Dokumentów i Doodle.
 * Ładowany przez navbar_new.php i swd-modern.css. Tylko ekran: wydruki
 * i PDF zachowują własny układ. Doodle w WebView używa doodle/mobile.css.
 * Warstwa ma pierwszeństwo przed lokalnymi dekoracjami !important;
 * nie zmienia siatek, widoczności elementów ani kolorów statusów.
 */
@layer swd-theme {
  @media screen {
    body:not(.doodle-mobile) {
      --swd-blue: #1766b0 !important;
      --swd-blue-strong: #125593 !important;
      --swd-ink: #243247 !important;
      --swd-muted: #65758b !important;
      --swd-line: #dce4ed !important;
      --swd-soft: #f6f8fb !important;
      --swd-radius: 12px !important;
      --swd-shadow-sm: 0 1px 3px rgba(15, 23, 42, .05) !important;
      --swd-shadow-md: 0 1px 3px rgba(15, 23, 42, .05) !important;
      --swd-shadow-lg: 0 8px 24px rgba(15, 23, 42, .1) !important;
      color: var(--swd-ink) !important;
      background: var(--swd-soft) !important;
      font-family: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif !important;
      font-size: .88rem;
      line-height: 1.6;
    }

    /* Nagłówki robocze bez osobnej karty; grafiki pulpitu zostają grafikami. */
    body:not(.doodle-mobile) :is(.swd-page-head, .swd-module-header, .events-page-head, .security-hero) {
      padding: 0 !important;
      margin-bottom: 22px !important;
      border: 0 !important;
      border-radius: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
    }
    body:not(.doodle-mobile) :is(.swd-page-head, .events-page-head, .security-hero)::before {
      display: none !important;
    }
    body:not(.doodle-mobile) h1:not(.dashboard-hero-title, .login-visual *, .auth-visual *, .hero-section *, .note-editable *, .description-content *, .document-preview *) {
      color: var(--swd-ink) !important;
      font-size: clamp(1.35rem, 2.2vw, 2rem) !important;
      font-weight: 700 !important;
      line-height: 1.35 !important;
      letter-spacing: -.015em !important;
      overflow-wrap: anywhere;
    }
    body:not(.doodle-mobile) :is(.swd-title, .events-title) {
      font-size: clamp(1.35rem, 2.2vw, 2rem) !important;
      font-weight: 700 !important;
      line-height: 1.35 !important;
    }
    body:not(.doodle-mobile) :is(.swd-lead, .events-lead, .swd-module-header p, .security-header p) {
      color: var(--swd-muted) !important;
      font-size: .88rem !important;
      font-weight: 400 !important;
      line-height: 1.6 !important;
    }
    body:not(.doodle-mobile) :is(.swd-heading-icon, .events-heading-icon, .swd-section-icon, .swd-icon-box) {
      width: 38px !important;
      height: 38px !important;
      border-radius: 8px !important;
      color: var(--swd-blue) !important;
      background: #edf5fc !important;
      box-shadow: none !important;
      font-size: 1.1rem !important;
    }

    /* Jeden poziom paneli, delikatna linia i cień zamiast gradientów. */
    body:not(.doodle-mobile) :is(.card, .swd-panel, .swd-card, .swd-module-panel, .files-panel, .security-panel, .events-filter-panel, .events-action-strip, .events-registration-panel, .events-empty, .swd-filter-panel, .swd-action-strip, .dashboard-hero-panel, .login-card, .auth-card, .tile, .file-folder-card):not(.note-editor, .note-editor *, .swd-topnav *) {
      border-color: var(--swd-line);
      border-radius: var(--swd-radius) !important;
      box-shadow: var(--swd-shadow-sm) !important;
    }
    body:not(.doodle-mobile) :is(.swd-panel, .swd-card, .swd-module-panel, .files-panel, .security-panel, .events-filter-panel, .events-action-strip, .events-registration-panel, .events-empty, .swd-filter-panel, .swd-action-strip, .dashboard-hero-panel, .login-card, .auth-card, .file-folder-card) {
      background: #fff !important;
    }
    body:not(.doodle-mobile) :is(.card, .swd-card, .tile, .file-folder-card):not([draggable="true"], .is-dragging, .sortable-chosen, .sortable-ghost, .ui-sortable-helper, .note-editor, .note-editor *):hover {
      transform: none !important;
      box-shadow: 0 0 0 1px var(--swd-line) !important;
    }
    body:not(.doodle-mobile) :is(.card-title, .swd-card-title, .swd-section-title, .swd-module-panel-title):not(.note-editor *, .swd-topnav *) {
      font-size: 1.03rem !important;
      font-weight: 600 !important;
      line-height: 1.45 !important;
    }
    body:not(.doodle-mobile) .card-header {
      padding: 14px 20px !important;
      border-bottom-color: var(--swd-line) !important;
      border-radius: 11px 11px 0 0 !important;
      font-size: .88rem !important;
      font-weight: 600 !important;
    }
    /* Nagłówki Bootstrap zachowują znaczenie koloru z czytelnym tekstem. */
    body:not(.doodle-mobile) .card-header:not(.bg-primary, .bg-success, .bg-warning, .bg-danger, .bg-info, .bg-dark, .bg-secondary) {
      color: var(--swd-ink) !important;
      background: var(--swd-soft) !important;
    }
    body:not(.doodle-mobile) .card-header.bg-primary { background: var(--swd-blue) !important; }
    body:not(.doodle-mobile) .card-header.bg-success { background: #198754 !important; }
    body:not(.doodle-mobile) .card-header.bg-warning { background: #fff3cd !important; color: #664d03 !important; }
    body:not(.doodle-mobile) .card-header.bg-danger { background: #b02a37 !important; }
    body:not(.doodle-mobile) .card-header.bg-info { background: #cff4fc !important; color: #055160 !important; }
    body:not(.doodle-mobile) .card-header.bg-dark { background: #243247 !important; }
    body:not(.doodle-mobile) .card-header.bg-secondary { background: #65758b !important; }
    body:not(.doodle-mobile) .card-header :is(.card-title, h2, h3, h4, h5, h6) { color: inherit !important; }
    body:not(.doodle-mobile) .card-header:is(.bg-primary, .bg-success, .bg-danger, .bg-dark, .bg-secondary) { color: #fff !important; }
    body:not(.doodle-mobile) .card-footer {
      border-top-color: var(--swd-line) !important;
      background: var(--swd-soft) !important;
      box-shadow: none !important;
    }
    body:not(.doodle-mobile) .tab-content {
      border-color: var(--swd-line) !important;
      border-radius: 0 0 var(--swd-radius) var(--swd-radius) !important;
      box-shadow: none !important;
    }

    /* Sekcje pulpitu grupują przyciski bez dodatkowego panelu pod spodem.
       Jawny reset nadpisuje też poprzedni motyw z pamięci podręcznej. */
    body.swd-dashboard-page .dashboard-section {
      background: transparent !important;
      box-shadow: none !important;
      border-radius: 0 !important;
    }

    /* Przyciski aplikacji; pasek główny i edytory mają własne sterowanie. */
    body:not(.doodle-mobile) .btn:not(.swd-topnav *, .note-editor *, .btn-link) {
      min-height: 38px !important;
      padding: .5rem .82rem !important;
      border-radius: 7px !important;
      font-family: inherit !important;
      font-size: .82rem !important;
      font-weight: 500 !important;
      line-height: 1.5 !important;
      letter-spacing: normal !important;
      box-shadow: none !important;
      transform: none !important;
    }
    body:not(.doodle-mobile) .btn-sm:not(.swd-topnav *, .note-editor *) {
      min-height: 32px !important;
      padding: .35rem .6rem !important;
      font-size: .76rem !important;
    }
    body:not(.doodle-mobile) .btn-primary:not(.swd-topnav *, .note-editor *, .dashboard-tool-card, .swd-navigation-preview) {
      background: var(--swd-blue) !important;
      border-color: var(--swd-blue) !important;
      color: #fff !important;
    }
    body:not(.doodle-mobile) .btn-primary:not(.swd-topnav *, .note-editor *, .dashboard-tool-card, .swd-navigation-preview):is(:hover, :active, .active) {
      background: var(--swd-blue-strong) !important;
      border-color: var(--swd-blue-strong) !important;
    }
    body:not(.doodle-mobile) .btn-outline-primary:not(.swd-topnav *, .note-editor *) {
      --bs-btn-color: var(--swd-blue);
      --bs-btn-border-color: var(--swd-blue);
      --bs-btn-hover-bg: var(--swd-blue);
      --bs-btn-hover-border-color: var(--swd-blue);
      --bs-btn-active-bg: var(--swd-blue-strong);
    }
    body:not(.doodle-mobile) .btn:not(.swd-topnav *, .note-editor *):focus-visible {
      outline: 3px solid #1766b0 !important;
      outline-offset: 3px !important;
    }

    body:not(.doodle-mobile) .input-group > :is(.btn, .form-control, .form-select, .input-group-text):not(:first-child) {
      border-top-left-radius: 0 !important;
      border-bottom-left-radius: 0 !important;
    }
    body:not(.doodle-mobile) .input-group > :is(.btn, .form-control, .form-select, .input-group-text):not(:last-child):not(.dropdown-toggle) {
      border-top-right-radius: 0 !important;
      border-bottom-right-radius: 0 !important;
    }

    /* Wariant z konfiguracji nawigacji jest akcentem kafelka i jego podglądu. */
    body:not(.doodle-mobile) :is(.dashboard-tool-card, .swd-navigation-preview).btn-primary {
      background: #fff !important;
      border-color: var(--swd-line) !important;
      color: var(--swd-ink) !important;
    }
    body:not(.doodle-mobile) :is(.dashboard-tool-card, .swd-navigation-preview).btn-primary:is(:hover, :active, .active) {
      background: #edf5fc !important;
      border-color: #bfd5e9 !important;
      color: var(--swd-ink) !important;
    }
    body:not(.doodle-mobile) .swd-navigation-preview.btn-primary > .bi {
      color: var(--swd-blue) !important;
    }

    /* Pola: zachowane wysokości textarea, stany walidacji i grupy wejściowe. */
    body:not(.doodle-mobile) :is(.form-control, .form-select):not(.note-editor *, .is-valid, .is-invalid) {
      border-color: #cfd9e6 !important;
    }
    body:not(.doodle-mobile) :is(.form-control, .form-select, .input-group-text):not(.note-editor *) {
      font-family: inherit !important;
      font-size: .88rem !important;
      font-weight: 400 !important;
      border-radius: 7px !important;
    }
    body:not(.doodle-mobile) :is(.form-control, .form-select):not(.note-editor *, .is-valid, .is-invalid):focus {
      border-color: #1766b0 !important;
      box-shadow: 0 0 0 .2rem rgba(23, 102, 176, .12) !important;
    }
    body:not(.doodle-mobile) :is(.form-label, .col-form-label):not(.note-editor *) {
      font-size: .82rem !important;
      font-weight: 500 !important;
    }
    body:not(.doodle-mobile) :is(.swd-actions, .swd-module-actions, .events-actions) { gap: 8px !important; }

    body:not(.doodle-mobile) :is(.form-control, .form-select).is-invalid,
    body:not(.doodle-mobile) .was-validated :is(.form-control, .form-select):invalid {
      border-color: #dc3545 !important;
    }
    body:not(.doodle-mobile) :is(.form-control, .form-select).is-valid,
    body:not(.doodle-mobile) .was-validated :is(.form-control, .form-select):valid {
      border-color: #198754 !important;
    }
    body:not(.doodle-mobile) :is(.form-control, .form-select).is-invalid:focus,
    body:not(.doodle-mobile) .was-validated :is(.form-control, .form-select):invalid:focus {
      box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .15) !important;
    }
    body:not(.doodle-mobile) :is(.form-control, .form-select).is-valid:focus,
    body:not(.doodle-mobile) .was-validated :is(.form-control, .form-select):valid:focus {
      box-shadow: 0 0 0 .2rem rgba(25, 135, 84, .15) !important;
    }

    /* Tabele zachowują sticky, kolory statusów, sortowanie i przewijanie. */
    body:not(.doodle-mobile) .table:not(.note-editor *, .document-preview *) {
      --bs-table-border-color: var(--swd-line);
      --bs-table-striped-bg: #f8fafc;
      --bs-table-hover-bg: #edf5fc;
      font-size: .84rem !important;
      vertical-align: middle;
    }
    body:not(.doodle-mobile) .table:not(.note-editor *, .document-preview *) thead:not(.table-dark) th:not(.bg-primary, .bg-success, .bg-danger, .bg-warning, .bg-info, .bg-dark) {
      color: var(--swd-muted) !important;
      background-color: var(--swd-soft) !important;
      font-size: .76rem !important;
      font-weight: 500 !important;
    }
    body:not(.doodle-mobile) .badge:not(.swd-topnav *) {
      font-weight: 600 !important;
      box-shadow: none !important;
    }
    body:not(.doodle-mobile) .badge.bg-light {
      padding: .35em .65em !important;
      border-radius: 6px !important;
      background: var(--swd-soft) !important;
      color: var(--swd-muted) !important;
    }
    body:not(.doodle-mobile) .alert:not(.swd-topnav *) {
      border-radius: 8px !important;
      font-size: .88rem !important;
      box-shadow: none !important;
    }
    body:not(.doodle-mobile) .text-muted:not(.swd-topnav *, .dashboard-hero-visual *, .note-editor *) { color: var(--swd-muted) !important; }
    body:not(.doodle-mobile) :is(.modal-content, .swal2-popup) {
      border-radius: var(--swd-radius) !important;
      box-shadow: var(--swd-shadow-lg) !important;
      font-family: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif !important;
    }
    /* Przewijanie modali: także gdy formularz otacza nagłówek, treść i stopkę.
       overflow:auto na opakowaniach jest zabezpieczeniem dla bardzo niskich
       okien, w których sam nagłówek i stopka nie mieszczą się w widoku. */
    body:not(.doodle-mobile) .modal-dialog-scrollable .modal-content {
      overflow-y: auto !important;
    }
    body:not(.doodle-mobile) .modal-dialog-scrollable .modal-content > form {
      display: flex !important;
      flex-direction: column !important;
      min-height: 0 !important;
      max-height: inherit;
      overflow-y: auto !important;
    }
    /* Minimalny obszar na treść: przy niskim widoku przewinie się też
       opakowanie, zamiast ścisnąć treść do zera pomiędzy przyciskami. */
    body:not(.doodle-mobile) .modal-dialog-scrollable .modal-body {
      min-height: 6rem !important;
      overflow-y: auto !important;
    }
    body:not(.doodle-mobile) .swal2-title { font-size: 1.35rem !important; font-weight: 600 !important; }
    body:not(.doodle-mobile) .swal2-html-container { font-size: .88rem !important; }
    body:not(.doodle-mobile) .swal2-styled { border-radius: 7px !important; font-size: .88rem !important; font-weight: 500 !important; }
    body:not(.doodle-mobile) .footer {
      color: var(--swd-muted) !important;
      background: #fff !important;
      border-radius: 0 !important;
      box-shadow: none !important;
      font-size: .78rem !important;
    }

    @media (max-width: 767.98px) {
      body:not(.doodle-mobile) :is(.swd-heading, .events-heading, .security-header) { flex-wrap: wrap; }
      body:not(.doodle-mobile) .btn:not(.swd-topnav *, .note-editor *, .btn-link) { min-height: 44px !important; }
      body:not(.doodle-mobile) :is(.form-control, .form-select):not(.note-editor *) { font-size: 1rem !important; }
    }
    @media (prefers-reduced-motion: reduce) {
      body:not(.doodle-mobile) :is(.card, .swd-card, .tile, .btn):not(.swd-topnav *, .note-editor *) { transition: none !important; }
    }
  }
}