/*
 * PANJI Global Color System
 * Visual balance: 60% neutral, 25% charcoal, 10% calm blue, 5% PANJI red.
 * Neutral colors own the reading surfaces, charcoal builds structure, blue drives
 * ordinary interaction, and red is reserved for brand accents, unread states,
 * destructive actions, and selected emphasis.
 */

:root {
    --panji-neutral-0: #ffffff;
    --panji-neutral-25: #fcfcfd;
    --panji-neutral-50: #f6f7f9;
    --panji-neutral-100: #eef1f4;
    --panji-neutral-200: #dfe4e9;
    --panji-neutral-300: #cdd4db;
    --panji-neutral-500: #77818a;
    --panji-neutral-700: #4e565d;

    --panji-charcoal: #202428;
    --panji-charcoal-soft: #2c3136;
    --panji-charcoal-muted: #3b4248;
    --panji-ink: #252a2f;

    --panji-blue: #2e6f95;
    --panji-blue-strong: #245a78;
    --panji-blue-deep: #1d4963;
    --panji-blue-soft: #e8f2f8;
    --panji-blue-pale: #f2f7fa;

    --panji-red: #b51e2a;
    --panji-red-strong: #901720;
    --panji-red-soft: #f8e8ea;

    --panji-border: rgba(32, 36, 40, 0.12);
    --panji-border-strong: rgba(32, 36, 40, 0.2);
    --panji-shadow-sm: 0 0.35rem 1rem rgba(32, 36, 40, 0.07);
    --panji-shadow: 0 1rem 2.7rem rgba(32, 36, 40, 0.1);
    --panji-shadow-lg: 0 1.6rem 4rem rgba(32, 36, 40, 0.14);

    --bs-primary: var(--panji-blue);
    --bs-primary-rgb: 46, 111, 149;
    --bs-secondary: var(--panji-neutral-700);
    --bs-secondary-rgb: 78, 86, 93;
    --bs-danger: var(--panji-red);
    --bs-danger-rgb: 181, 30, 42;
    --bs-info: #4e8eae;
    --bs-info-rgb: 78, 142, 174;
    --bs-dark: var(--panji-charcoal);
    --bs-dark-rgb: 32, 36, 40;
    --bs-light: var(--panji-neutral-50);
    --bs-light-rgb: 246, 247, 249;
    --bs-body-color: var(--panji-ink);
    --bs-body-color-rgb: 37, 42, 47;
    --bs-body-bg: var(--panji-neutral-50);
    --bs-body-bg-rgb: 246, 247, 249;
    --bs-border-color: var(--panji-neutral-200);
    --bs-link-color: var(--panji-blue);
    --bs-link-hover-color: var(--panji-red-strong);
    --bs-focus-ring-color: rgba(46, 111, 149, 0.23);
}

html {
    background: var(--panji-neutral-50);
}

body.panji-app {
    min-width: 320px;
    background:
        radial-gradient(circle at 7% 3%, rgba(46, 111, 149, 0.045), transparent 25rem),
        radial-gradient(circle at 94% 14%, rgba(181, 30, 42, 0.028), transparent 23rem),
        var(--panji-neutral-50);
    color: var(--panji-ink);
    accent-color: var(--panji-blue);
}

.panji-app main {
    min-width: 0;
    flex: 1 0 auto;
}

.panji-app ::selection {
    background: rgba(46, 111, 149, 0.22);
    color: var(--panji-charcoal);
}

.panji-app a {
    color: var(--panji-blue);
    text-underline-offset: 0.18em;
}

.panji-app a:hover,
.panji-app a:focus-visible {
    color: var(--panji-red-strong);
}

.panji-app :focus-visible {
    outline-color: var(--panji-blue);
}

.panji-app .text-primary,
.panji-app .link-primary {
    color: var(--panji-blue) !important;
}

.panji-app .text-danger,
.panji-app .link-danger {
    color: var(--panji-red) !important;
}

.panji-app .text-dark {
    color: var(--panji-charcoal) !important;
}

.panji-app .text-muted,
.panji-app .text-body-secondary {
    color: var(--panji-neutral-500) !important;
}

.panji-app .bg-body,
.panji-app .bg-white {
    background-color: var(--panji-neutral-0) !important;
}

.panji-app .bg-light,
.panji-app .bg-body-tertiary {
    background-color: var(--panji-neutral-50) !important;
}

.panji-app .bg-dark {
    background-color: var(--panji-charcoal) !important;
}

.panji-app .bg-primary {
    background-color: var(--panji-blue) !important;
}

.panji-app .bg-danger {
    background-color: var(--panji-red) !important;
}

/* Navigation: charcoal structure with neutral reading contrast. */
.panji-navbar {
    --bs-navbar-color: rgba(255, 255, 255, 0.78);
    --bs-navbar-hover-color: #ffffff;
    --bs-navbar-active-color: #ffffff;
    --bs-navbar-brand-color: #ffffff;
    --bs-navbar-brand-hover-color: #ffffff;
    z-index: 1030;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background:
        linear-gradient(100deg, #1d2125 0%, #252a2f 70%, #2d3033 100%) !important;
    box-shadow: 0 0.5rem 1.5rem rgba(22, 25, 28, 0.14);
}

.panji-navbar .navbar-brand {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.65rem;
    border-radius: 0.8rem;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 0.2rem 0.7rem rgba(0, 0, 0, 0.16);
}

.panji-navbar .navbar-brand img {
    display: block;
    max-width: 100%;
    object-fit: contain;
}

.panji-navbar .nav-link {
    position: relative;
    border-radius: 0.7rem;
    color: rgba(255, 255, 255, 0.8) !important;
    font-weight: 650;
    transition: color 150ms ease, background-color 150ms ease;
}

.panji-navbar .nav-link:hover,
.panji-navbar .nav-link:focus-visible,
.panji-navbar .nav-link.show {
    background: rgba(46, 111, 149, 0.32);
    color: #fff !important;
    outline: none;
}

.panji-navbar .navbar-nav > .nav-item > .nav-link::after {
    border-color: currentColor;
}

.panji-navbar .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}

.panji-navbar .navbar-toggler:focus {
    box-shadow: 0 0 0 0.2rem rgba(78, 142, 174, 0.24);
}

.panji-navbar .badge.bg-danger {
    border: 2px solid var(--panji-charcoal);
    background: var(--panji-red) !important;
    box-shadow: 0 0.2rem 0.55rem rgba(144, 23, 32, 0.28);
}

.panji-navbar .dropdown-menu {
    margin-top: 0.65rem;
}

/* Surfaces */
.panji-app .card,
.panji-app .modal-content,
.panji-app .offcanvas,
.panji-app .dropdown-menu,
.panji-app .list-group-item,
.panji-app .accordion-item {
    border-color: var(--panji-border);
    background-color: var(--panji-neutral-0);
}

.panji-app .card {
    box-shadow: var(--panji-shadow-sm);
}

.panji-app .card-header,
.panji-app .card-footer {
    border-color: var(--panji-border);
    background: var(--panji-neutral-50);
}

.panji-app .card-header.bg-primary,
.panji-app .card-header.text-bg-primary,
.panji-app .text-bg-primary {
    border-color: var(--panji-blue-strong);
    background: linear-gradient(115deg, var(--panji-charcoal), var(--panji-blue-deep)) !important;
    color: #fff !important;
}

.panji-app .border,
.panji-app .border-top,
.panji-app .border-bottom,
.panji-app .border-start,
.panji-app .border-end {
    border-color: var(--panji-border) !important;
}

.panji-app .shadow,
.panji-app .shadow-sm {
    box-shadow: var(--panji-shadow-sm) !important;
}

.panji-app .shadow-lg {
    box-shadow: var(--panji-shadow-lg) !important;
}

/* Buttons: blue for everyday actions, red only for brand/destructive emphasis. */
.panji-app .btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--panji-blue);
    --bs-btn-border-color: var(--panji-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--panji-blue-strong);
    --bs-btn-hover-border-color: var(--panji-blue-strong);
    --bs-btn-focus-shadow-rgb: 46, 111, 149;
    --bs-btn-active-bg: var(--panji-blue-deep);
    --bs-btn-active-border-color: var(--panji-blue-deep);
    box-shadow: 0 0.45rem 1rem rgba(46, 111, 149, 0.18);
}

.panji-app .btn-outline-primary {
    --bs-btn-color: var(--panji-blue);
    --bs-btn-border-color: rgba(46, 111, 149, 0.55);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--panji-blue);
    --bs-btn-hover-border-color: var(--panji-blue);
    --bs-btn-focus-shadow-rgb: 46, 111, 149;
    --bs-btn-active-bg: var(--panji-blue-strong);
    --bs-btn-active-border-color: var(--panji-blue-strong);
}

.panji-app .btn-danger {
    --bs-btn-bg: var(--panji-red);
    --bs-btn-border-color: var(--panji-red);
    --bs-btn-hover-bg: var(--panji-red-strong);
    --bs-btn-hover-border-color: var(--panji-red-strong);
    --bs-btn-focus-shadow-rgb: 181, 30, 42;
    --bs-btn-active-bg: #77131b;
    --bs-btn-active-border-color: #77131b;
}

.panji-app .btn-outline-danger {
    --bs-btn-color: var(--panji-red);
    --bs-btn-border-color: rgba(181, 30, 42, 0.58);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--panji-red);
    --bs-btn-hover-border-color: var(--panji-red);
    --bs-btn-focus-shadow-rgb: 181, 30, 42;
}

.panji-app .btn-secondary {
    --bs-btn-bg: var(--panji-charcoal-muted);
    --bs-btn-border-color: var(--panji-charcoal-muted);
    --bs-btn-hover-bg: var(--panji-charcoal);
    --bs-btn-hover-border-color: var(--panji-charcoal);
    --bs-btn-focus-shadow-rgb: 59, 66, 72;
}

.panji-app .btn-outline-secondary {
    --bs-btn-color: var(--panji-charcoal-muted);
    --bs-btn-border-color: var(--panji-neutral-300);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--panji-charcoal-muted);
    --bs-btn-hover-border-color: var(--panji-charcoal-muted);
}

.panji-app .btn-info,
.panji-app .btn-success {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--panji-blue);
    --bs-btn-border-color: var(--panji-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--panji-blue-strong);
    --bs-btn-hover-border-color: var(--panji-blue-strong);
}

/* Forms */
.panji-app .form-control,
.panji-app .form-select,
.panji-app .form-check-input,
.panji-app .input-group-text {
    border-color: var(--panji-neutral-300);
    background-color: var(--panji-neutral-0);
    color: var(--panji-ink);
}

.panji-app .form-control::placeholder {
    color: #929aa1;
}

.panji-app .form-control:focus,
.panji-app .form-select:focus,
.panji-app .form-check-input:focus {
    border-color: rgba(46, 111, 149, 0.68);
    box-shadow: 0 0 0 0.22rem rgba(46, 111, 149, 0.14);
}

.panji-app .form-check-input:checked {
    border-color: var(--panji-blue);
    background-color: var(--panji-blue);
}

.panji-app .form-control:disabled,
.panji-app .form-select:disabled,
.panji-app .form-control[readonly] {
    background-color: var(--panji-neutral-100);
    color: var(--panji-neutral-700);
}

/* Dropdowns, tabs, pills, accordions */
.panji-app .dropdown-menu {
    padding: 0.45rem;
    border-radius: 0.9rem;
    box-shadow: var(--panji-shadow);
}

.panji-app .dropdown-item {
    border-radius: 0.55rem;
    color: var(--panji-ink);
}

.panji-app .dropdown-item:hover,
.panji-app .dropdown-item:focus,
.panji-app .dropdown-item.active,
.panji-app .dropdown-item:active {
    background: var(--panji-blue-soft);
    color: var(--panji-blue-deep);
}

.panji-app .nav-tabs,
.panji-app .nav-pills {
    border-color: var(--panji-border);
}

.panji-app .nav-tabs .nav-link,
.panji-app .nav-pills .nav-link {
    color: var(--panji-neutral-700);
}

.panji-app .nav-tabs .nav-link:hover,
.panji-app .nav-tabs .nav-link:focus,
.panji-app .nav-pills .nav-link:hover,
.panji-app .nav-pills .nav-link:focus {
    color: var(--panji-blue);
}

.panji-app .nav-tabs .nav-link.active,
.panji-app .nav-pills .nav-link.active {
    border-color: var(--panji-neutral-200) var(--panji-neutral-200) var(--panji-neutral-0);
    background: var(--panji-neutral-0);
    color: var(--panji-blue-deep);
    box-shadow: inset 0 -3px 0 var(--panji-red);
}

.panji-app .accordion-button {
    color: var(--panji-ink);
    background: var(--panji-neutral-0);
}

.panji-app .accordion-button:not(.collapsed) {
    color: var(--panji-blue-deep);
    background: var(--panji-blue-pale);
    box-shadow: inset 0 -1px 0 var(--panji-border);
}

.panji-app .accordion-button:focus {
    border-color: rgba(46, 111, 149, 0.45);
    box-shadow: 0 0 0 0.2rem rgba(46, 111, 149, 0.13);
}

/* Tables and pagination */
.panji-app .table {
    --bs-table-color: var(--panji-ink);
    --bs-table-bg: var(--panji-neutral-0);
    --bs-table-border-color: var(--panji-neutral-200);
    --bs-table-striped-bg: var(--panji-neutral-50);
    --bs-table-hover-bg: var(--panji-blue-pale);
}

.panji-app .table thead th,
.panji-app .table-dark th,
.panji-app .table .table-dark {
    border-color: rgba(255, 255, 255, 0.08);
    background: var(--panji-charcoal) !important;
    color: #fff !important;
}

.panji-app .page-link {
    border-color: var(--panji-neutral-200);
    background: var(--panji-neutral-0);
    color: var(--panji-blue);
}

.panji-app .page-link:hover,
.panji-app .page-link:focus {
    background: var(--panji-blue-soft);
    color: var(--panji-blue-deep);
}

.panji-app .page-item.active .page-link {
    border-color: var(--panji-blue);
    background: var(--panji-blue);
    color: #fff;
}

/* Status components */
.panji-app .badge.bg-primary,
.panji-app .text-bg-primary {
    background: var(--panji-blue) !important;
    color: #fff !important;
}

.panji-app .badge.bg-secondary,
.panji-app .text-bg-secondary {
    background: var(--panji-charcoal-muted) !important;
    color: #fff !important;
}

.panji-app .badge.bg-danger,
.panji-app .text-bg-danger {
    background: var(--panji-red) !important;
    color: #fff !important;
}

.panji-app .bg-primary-subtle {
    background-color: var(--panji-blue-soft) !important;
}

.panji-app .text-primary-emphasis {
    color: var(--panji-blue-deep) !important;
}

.panji-app .border-primary,
.panji-app .border-primary-subtle {
    border-color: rgba(46, 111, 149, 0.28) !important;
}

.panji-app .alert-primary,
.panji-app .alert-info,
.panji-app .alert-success {
    --bs-alert-color: var(--panji-blue-deep);
    --bs-alert-bg: var(--panji-blue-soft);
    --bs-alert-border-color: rgba(46, 111, 149, 0.22);
}

.panji-app .alert-danger {
    --bs-alert-color: #741018;
    --bs-alert-bg: var(--panji-red-soft);
    --bs-alert-border-color: rgba(181, 30, 42, 0.24);
}

.panji-app .alert-secondary,
.panji-app .alert-light {
    --bs-alert-color: var(--panji-charcoal-muted);
    --bs-alert-bg: var(--panji-neutral-100);
    --bs-alert-border-color: var(--panji-neutral-200);
}

.panji-app .progress {
    background: var(--panji-neutral-100);
}

.panji-app .progress-bar {
    background: linear-gradient(90deg, var(--panji-blue), #4e8eae);
}

/* Modal and offcanvas structure */
.panji-app .modal-header,
.panji-app .offcanvas-header {
    border-color: var(--panji-border);
    background: var(--panji-neutral-50);
}

.panji-app .modal-footer {
    border-color: var(--panji-border);
    background: var(--panji-neutral-25);
}

.panji-app .modal-title,
.panji-app .offcanvas-title {
    color: var(--panji-charcoal);
}

/* Floating screening action: red brand accent used sparingly. */
.panji-floating-action > .btn {
    border-color: rgba(181, 30, 42, 0.62);
    background: var(--panji-neutral-0);
    color: var(--panji-red);
    box-shadow: 0 0.8rem 1.8rem rgba(32, 36, 40, 0.14);
}

.panji-floating-action > .btn:hover,
.panji-floating-action > .btn:focus-visible,
.panji-floating-action > .btn.show {
    border-color: var(--panji-red);
    background: var(--panji-red);
    color: #fff;
}

.panji-floating-action .dropdown-menu {
    border-color: rgba(32, 36, 40, 0.12);
    background: var(--panji-charcoal) !important;
}

.panji-floating-action .dropdown-item {
    color: rgba(255, 255, 255, 0.84) !important;
}

.panji-floating-action .dropdown-item:hover,
.panji-floating-action .dropdown-item:focus {
    background: rgba(46, 111, 149, 0.34);
    color: #fff !important;
}

/* Footer */
.panji-footer {
    margin-top: auto;
    padding: 1.6rem 1rem 1.15rem;
    border-radius: 1.4rem 1.4rem 0 0;
    background: var(--panji-charcoal);
    color: rgba(255, 255, 255, 0.68);
}

.panji-footer .nav {
    border-color: rgba(255, 255, 255, 0.12) !important;
}

.panji-footer .nav-link {
    border-radius: 0.55rem;
    color: rgba(255, 255, 255, 0.68) !important;
}

.panji-footer .nav-link:hover,
.panji-footer .nav-link:focus-visible {
    background: rgba(46, 111, 149, 0.25);
    color: #fff !important;
}

.panji-footer .panji-footer-mark {
    color: #fff;
    font-weight: 750;
}

.panji-footer .panji-footer-mark::before {
    display: inline-block;
    width: 0.55rem;
    height: 0.55rem;
    margin-right: 0.45rem;
    border-radius: 50%;
    background: var(--panji-red);
    content: "";
}

/* Homepage: keep the page calm and neutral, with blue interaction and red micro-accents. */
.panji-app .panji-home {
    --ink: var(--panji-charcoal);
    --muted: var(--panji-neutral-500);
    --blue: var(--panji-blue);
    --blue-deep: var(--panji-blue-deep);
    --sky: var(--panji-blue-soft);
    --teal: var(--panji-blue);
    --mint: var(--panji-blue-pale);
    --amber: var(--panji-charcoal-muted);
    --sand: var(--panji-neutral-100);
    --coral: var(--panji-red);
    --rose: var(--panji-red-soft);
}

.panji-app .panji-home .hero-stage {
    border: 1px solid var(--panji-border);
    background:
        linear-gradient(115deg, rgba(255,255,255,.985) 0 58%, rgba(232,242,248,.94) 58% 100%),
        var(--panji-neutral-25);
    box-shadow: var(--panji-shadow-lg);
}

.panji-app .panji-home .hero-title span,
.panji-app .panji-home .orbit-label i,
.panji-app .panji-home .section-label {
    color: var(--panji-blue);
}

.panji-app .panji-home .signal::before {
    background: var(--panji-red);
}

.panji-app .panji-home .btn-panji {
    border-color: var(--panji-blue);
    background: var(--panji-blue);
    box-shadow: 0 0.8rem 1.8rem rgba(46, 111, 149, 0.22);
}

.panji-app .panji-home .compass-core {
    background: linear-gradient(145deg, var(--panji-charcoal), var(--panji-blue));
}

.panji-app .panji-home .service-screening {
    background: linear-gradient(145deg, var(--panji-charcoal), var(--panji-blue-deep));
}

.panji-app .panji-home .service-monitoring,
.panji-app .panji-home .service-guide {
    background: var(--panji-blue-soft);
    color: var(--panji-blue-deep);
}

.panji-app .panji-home .service-blog {
    background: var(--panji-neutral-100);
    color: var(--panji-charcoal-muted);
}

.panji-app .panji-home .service-quotes {
    background: var(--panji-red-soft);
    color: var(--panji-red-strong);
}

.panji-app .panji-home .editorial-shell {
    background: var(--panji-neutral-100);
}

/* Blog */
.panji-app .blog-hero,
.panji-app .blog-topic-header {
    border-color: rgba(46, 111, 149, 0.14);
    background:
        radial-gradient(circle at top right, rgba(46, 111, 149, 0.15), transparent 42%),
        linear-gradient(135deg, var(--panji-neutral-25), var(--panji-blue-pale));
}

.panji-app .blog-filter-card {
    border-color: var(--panji-border);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--panji-shadow);
}

.panji-app .blog-avatar {
    background: linear-gradient(145deg, var(--panji-blue), var(--panji-charcoal-muted));
    box-shadow: 0 0 0 1px rgba(46, 111, 149, 0.2);
}

.panji-app .post-content blockquote {
    border-left-color: var(--panji-red);
    background: var(--panji-neutral-50);
}

.panji-app .blog-card:hover,
.panji-app .blog-card:focus-within {
    border-color: rgba(46, 111, 149, 0.22);
    box-shadow: var(--panji-shadow) !important;
}

/* Profile and user pages */
.panji-app .bingkai-profil,
.panji-app .profile-card,
.panji-app .user-profile-card {
    border-color: var(--panji-border) !important;
    background: var(--panji-neutral-0) !important;
}

.panji-app .back-profile {
    background:
        radial-gradient(circle at 82% 8%, rgba(181, 30, 42, 0.2), transparent 12rem),
        linear-gradient(130deg, var(--panji-charcoal), var(--panji-blue-deep)) !important;
}

.panji-app .profile-picture-container,
.panji-app .profile-pic-wrapper {
    border-color: rgba(46, 111, 149, 0.3) !important;
}

/* Monitoring and data-heavy pages */
.panji-app .monitoring-header,
.panji-app .dashboard-header,
.panji-app .page-hero {
    border-color: var(--panji-border);
    background:
        radial-gradient(circle at 92% 8%, rgba(181, 30, 42, 0.09), transparent 15rem),
        linear-gradient(120deg, var(--panji-charcoal), var(--panji-blue-deep));
    color: #fff;
}

.panji-app .leaflet-container,
.panji-app canvas,
.panji-app .chart-container {
    border-color: var(--panji-border) !important;
}

/* Account pages */
.panji-app .login-card,
.panji-app .signup-card,
.panji-app .account-card,
.panji-app .auth-card {
    border: 1px solid var(--panji-border);
    background: var(--panji-neutral-0);
    box-shadow: var(--panji-shadow);
}

/* Preserve recognizable social-network brand colors where context requires it. */
.panji-app a[href*="facebook.com"].btn,
.panji-app a[href*="wa.me"].btn,
.panji-app a[href*="twitter.com"].btn,
.panji-app a[href*="linkedin.com"].btn {
    color: #fff;
}

@media (max-width: 991.98px) {
    .panji-navbar .navbar-collapse {
        margin-top: 0.7rem;
        padding: 0.65rem;
        border: 1px solid rgba(255, 255, 255, 0.1);
        border-radius: 0.9rem;
        background: rgba(14, 17, 19, 0.6);
    }

    .panji-navbar .navbar-nav {
        gap: 0.2rem;
    }
}

@media (max-width: 575.98px) {
    .panji-footer {
        border-radius: 1rem 1rem 0 0;
    }

    .panji-footer .nav {
        gap: 0.15rem;
    }

    .panji-footer .nav-link {
        padding-inline: 0.55rem !important;
        font-size: 0.82rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .panji-app *,
    .panji-app *::before,
    .panji-app *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media print {
    body.panji-app {
        background: #fff !important;
    }

    .panji-navbar,
    .panji-footer,
    .panji-floating-action {
        display: none !important;
    }

    .panji-app .card {
        box-shadow: none !important;
    }
}