/* ==========================================================
 * App UI — shared page components (Paripoorna brand)
 * Prefix pk- (not ui-): jquery-ui.css is loaded globally and owns .ui-*
 * Tokens (--pd-*) come from shell.css. Loaded on every page.
 *
 *  1. Generic restyle of template components (cards, tables,
 *     forms, buttons, modals, offcanvas, select2, pagination)
 *  2. ui-* building blocks used by list pages
 *     (page head, tabs, toolbar, table cells, actions, dialogs)
 * ========================================================== */

/* ==========================================================
 * 1. GENERIC TEMPLATE COMPONENTS
 * ========================================================== */

/* Page content fades in */
.layout-page .content-wrapper > .container-p-y > * {
    /* backwards, not both: a retained transform would trap position:fixed modals */
    animation: pk-rise .55s var(--pd-ease) backwards;
}

@keyframes pk-rise {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: none; }
}

/* Cards */
.layout-page .content-wrapper .card {
    border: 1px solid var(--pd-line);
    border-radius: 18px;
    box-shadow: 0 1px 2px rgba(23, 35, 27, .04), 0 8px 24px -12px rgba(23, 35, 27, .12);
}

.layout-page .content-wrapper .card > .card-header,
.layout-page .content-wrapper .custom-card-title {
    border-bottom: 1px solid var(--pd-line) !important;
}

/* Tables */
.layout-page .content-wrapper :is(.card, .pk-card) .table { margin-bottom: 0; }

.layout-page .content-wrapper :is(.card, .pk-card) .table > thead th {
    padding: 12px 16px;
    border-top: 0;
    border-bottom: 1px solid var(--pd-line);
    background: #fcfaf5;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--pd-ink-3);
}

.layout-page .content-wrapper :is(.card, .pk-card) .table > tbody > tr > td {
    padding: 12px 16px;
    border-bottom: 1px solid var(--pd-line);
    vertical-align: middle;
    color: var(--pd-ink-2);
    font-size: .86rem;
}

.layout-page .content-wrapper :is(.card, .pk-card) .table > tbody > tr { transition: background .2s; }
.layout-page .content-wrapper :is(.card, .pk-card) .table > tbody > tr:hover { background: #fbf9f4; }
.layout-page .table-row-1 { border-top: 0 !important; }

/* Buttons */
body:not(.pl-body) .btn {
    border-radius: 12px;
    font-weight: 600;
    transition: transform .2s var(--pd-ease), box-shadow .2s, background .2s, border-color .2s, color .2s;
}

body:not(.pl-body) .btn-primary {
    border-color: transparent;
    background: linear-gradient(135deg, var(--pd-leaf-900), var(--pd-leaf) 55%, #2e8b4a);
    box-shadow: 0 10px 20px -12px rgba(22, 101, 52, .75);
}

body:not(.pl-body) .btn-primary:hover,
body:not(.pl-body) .btn-primary:focus {
    border-color: transparent;
    background: linear-gradient(135deg, var(--pd-leaf-900), var(--pd-leaf) 40%, #2e8b4a);
    transform: translateY(-1px);
}

body:not(.pl-body) .btn-success {
    border-color: transparent;
    background: linear-gradient(135deg, #157a3c, var(--pd-green));
    box-shadow: 0 10px 20px -12px rgba(31, 154, 78, .7);
}

body:not(.pl-body) .btn-success:hover { border-color: transparent; transform: translateY(-1px); }

body:not(.pl-body) .btn-danger {
    border-color: transparent;
    background: linear-gradient(135deg, #a8380a, var(--pd-red));
    box-shadow: 0 10px 20px -12px rgba(219, 74, 14, .6);
}

body:not(.pl-body) .btn-danger:hover { border-color: transparent; transform: translateY(-1px); }

body:not(.pl-body) .btn-secondary,
body:not(.pl-body) .btn-label-secondary {
    border-color: transparent;
    background: var(--pd-soft);
    color: var(--pd-ink-2);
    box-shadow: none;
}

body:not(.pl-body) .btn-secondary:hover,
body:not(.pl-body) .btn-label-secondary:hover { background: #ece6da; color: var(--pd-ink); border-color: transparent; }

/* Form controls */
body:not(.pl-body) .form-control,
body:not(.pl-body) .form-select,
body:not(.pl-body) .select2-container--default .select2-selection {
    border: 1.5px solid var(--pd-line);
    border-radius: 12px;
    background-color: #fdfbf7;
    transition: border-color .2s, box-shadow .2s, background-color .2s;
}

body:not(.pl-body) .form-control:hover,
body:not(.pl-body) .form-select:hover,
body:not(.pl-body) .select2-container--default .select2-selection:hover { border-color: #d8cfbd; }

body:not(.pl-body) .form-control:focus,
body:not(.pl-body) .form-select:focus,
body:not(.pl-body) .select2-container--default.select2-container--focus .select2-selection,
body:not(.pl-body) .select2-container--default.select2-container--open .select2-selection {
    border-color: var(--pd-leaf) !important;
    background-color: #fff;
    box-shadow: 0 0 0 4px rgba(22, 101, 52, .1) !important;
}

body:not(.pl-body) .form-label {
    font-size: .8rem;
    font-weight: 600;
    color: var(--pd-ink-2);
    text-transform: none;
    letter-spacing: 0;
}

body:not(.pl-body) .select2-dropdown {
    border: 1px solid var(--pd-line);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 18px 40px -18px rgba(23, 35, 27, .35);
}

body:not(.pl-body) .select2-container--default .select2-results__option--highlighted:not([aria-selected=true]) {
    background: rgba(22, 101, 52, .08) !important;
    color: var(--pd-leaf) !important;
}

body:not(.pl-body) .select2-container--default .select2-selection--multiple .select2-selection__choice {
    border-radius: 8px;
    background: rgba(22, 101, 52, .08) !important;
    color: var(--pd-leaf) !important;
}

/* Badges */
.layout-page .badge.rounded-pill.dpr-status-label {
    padding: 5px 10px;
    font-weight: 600;
    font-size: .72rem;
    letter-spacing: .01em;
}

/* Modals (template dialogs) */
body:not(.pl-body) .modal-content {
    border: 0;
    border-radius: 20px;
    box-shadow: 0 40px 80px -30px rgba(10, 53, 25, .45);
}

body:not(.pl-body) .modal:not(.pd-remind-modal) .modal-header {
    padding: 20px 22px 14px;
    border-bottom: 1px solid var(--pd-line);
}

body:not(.pl-body) .modal:not(.pd-remind-modal) .modal-title { font-weight: 700; color: var(--pd-ink); }

body:not(.pl-body) .modal:not(.pd-remind-modal) .modal-footer {
    padding: 14px 22px 20px;
    border-top: 1px solid var(--pd-line);
}

/* The template floats a white close button outside the dialog; keep it inside */
body:not(.pl-body) .modal:not(.pd-remind-modal) .modal-header .btn-close {
    position: static;
    transform: none !important;
    margin: -4px -6px -4px auto;
    padding: .55rem;
    border-radius: 10px;
    background-color: transparent;
    box-shadow: none !important;
    opacity: .6;
    transition: opacity .2s, background-color .2s;
}

/* Header with an action button (e.g. Activity Log → Add Notes) */
body:not(.pl-body) .modal .modal-header .modal-title + .btn { margin-left: auto; }
body:not(.pl-body) .modal .modal-header .btn + .btn-close { margin-left: 8px; }

body:not(.pl-body) .modal:not(.pd-remind-modal) .modal-header .btn-close:hover {
    opacity: 1;
    background-color: var(--pd-soft);
}

body:not(.pl-body) .modal.fade:not(.pd-remind-modal) .modal-dialog {
    transform: translateY(18px) scale(.97);
    transition: transform .35s var(--pd-ease);
}

body:not(.pl-body) .modal.show:not(.pd-remind-modal) .modal-dialog { transform: none; }

/* Offcanvas forms (add / edit lead, employee) */
body:not(.pl-body) .offcanvas {
    border: 0 !important;
    box-shadow: -30px 0 60px -30px rgba(10, 53, 25, .45);
}

body:not(.pl-body) .offcanvas-end { border-radius: 22px 0 0 22px; }

body:not(.pl-body) .offcanvas-header {
    position: relative;
    padding: 22px 24px 18px;
    border-bottom: 1px solid var(--pd-line);
}

body:not(.pl-body) .offcanvas-header::before {
    content: "";
    position: absolute;
    left: 24px;
    top: 0;
    width: 44px;
    height: 4px;
    border-radius: 0 0 4px 4px;
    background: linear-gradient(90deg, var(--pd-leaf), var(--pd-red));
}

body:not(.pl-body) .offcanvas-title { font-size: 1.15rem; font-weight: 700; color: var(--pd-ink); }

body:not(.pl-body) .offcanvas-header .btn-close {
    padding: .55rem;
    border-radius: 10px;
    opacity: .6;
    transition: opacity .2s, background-color .2s;
}

body:not(.pl-body) .offcanvas-header .btn-close:hover { opacity: 1; background-color: var(--pd-soft); }

body:not(.pl-body) .offcanvas-body { padding-top: 18px !important; }

body:not(.pl-body) .offcanvas-body h5 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--pd-leaf);
}

body:not(.pl-body) .offcanvas-body h5::before {
    content: "";
    width: 4px;
    height: 14px;
    border-radius: 2px;
    background: var(--pd-red);
}

body:not(.pl-body) .border-card,
body:not(.pl-body) .inventory-border-card {
    border: 1px solid var(--pd-line) !important;
    border-radius: 16px !important;
    background: #fff;
    padding: 18px !important;
    margin-bottom: 18px;
}

/* Pagination */
.layout-page .custom-pagination .page-link,
.layout-page .pagination .page-link {
    min-width: 34px;
    height: 34px;
    margin: 0 2px;
    border: 1px solid var(--pd-line);
    border-radius: 10px !important;
    background: #fff;
    color: var(--pd-ink-2);
    font-weight: 600;
    font-size: .82rem;
    transition: background .2s, color .2s, border-color .2s;
}

.layout-page .pagination .page-link:hover { border-color: rgba(22, 101, 52, .3); color: var(--pd-leaf); }

.layout-page .pagination .page-item.active .page-link {
    border-color: var(--pd-leaf);
    background: var(--pd-leaf);
    color: #fff;
    box-shadow: 0 8px 16px -10px rgba(22, 101, 52, .8);
}

.layout-page .pagination-text { color: var(--pd-ink-3); font-size: .8rem; }

/* Tooltips */
body:not(.pl-body) .tooltip-inner {
    padding: 6px 10px;
    border-radius: 8px;
    background: var(--pd-ink);
    font-size: .74rem;
    font-weight: 600;
}

/* Footer */
.layout-page .content-footer { color: var(--pd-ink-3); font-size: .78rem; }

/* custom.css gives every .nav .nav-item a white card + shadow; pk-tabs replace that look */
.layout-page .pk-tabs .nav-item,
.layout-page .pk-tabs > li { background: transparent; box-shadow: none; margin-right: 0; }

/* ==========================================================
 * 2. UI BUILDING BLOCKS
 * ========================================================== */

/* ---------- Page head: tabs left, actions right ---------- */
.pk-page-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 20px;
}

.pk-page-head__actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* ---------- Tabs ---------- */
.pk-tabs {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
    padding: 0;
}

.pk-tab {
    --tone: var(--pd-leaf);
    --tone-soft: rgba(22, 101, 52, .08);

    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 7px 10px 7px 7px;
    border-radius: 14px;
    border: 1px solid var(--pd-line);
    background: #fff;
    color: var(--pd-ink-2);
    font-weight: 600;
    font-size: .86rem;
    box-shadow: 0 1px 2px rgba(23, 35, 27, .04);
    animation: pk-rise .5s var(--pd-ease) backwards;
    transition: transform .25s var(--pd-ease), box-shadow .25s, border-color .25s, background .25s, color .25s;
}

.pk-tab--plain { padding: 9px 16px; }

.pk-tabs > li:nth-child(2) .pk-tab { animation-delay: .04s; }
.pk-tabs > li:nth-child(3) .pk-tab { animation-delay: .08s; }
.pk-tabs > li:nth-child(4) .pk-tab { animation-delay: .12s; }
.pk-tabs > li:nth-child(5) .pk-tab { animation-delay: .16s; }

.pk-tab--blue  { --tone: #00569c;          --tone-soft: rgba(0, 86, 156, .1); }
.pk-tab--amber { --tone: var(--pd-amber); --tone-soft: rgba(242, 169, 0, .12); }
.pk-tab--red   { --tone: var(--pd-red);   --tone-soft: rgba(219, 74, 14, .08); }
.pk-tab--green { --tone: var(--pd-green); --tone-soft: rgba(31, 154, 78, .09); }
.pk-tab--slate { --tone: #6b7568;          --tone-soft: rgba(107, 117, 104, .1); }

.pk-tab__icon {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background: var(--tone-soft);
    color: var(--tone);
    font-size: 1rem;
    transition: background .25s, color .25s;
}

.pk-tab__count {
    min-width: 28px;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--tone-soft);
    color: var(--tone);
    font-size: .74rem;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.pk-tab:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px -14px rgba(23, 35, 27, .35);
    color: var(--pd-ink);
}

.pk-tab.active {
    background: var(--tone);
    border-color: var(--tone);
    color: #fff;
    box-shadow: 0 14px 26px -14px var(--tone);
}

.pk-tab.active .pk-tab__icon,
.pk-tab.active .pk-tab__count { background: rgba(255, 255, 255, .18); color: #fff; }

/* ---------- Card wrapper ---------- */
.pk-card {
    background: #fff;
    border: 1px solid var(--pd-line);
    border-radius: 18px;
    box-shadow: 0 1px 2px rgba(23, 35, 27, .04), 0 8px 24px -12px rgba(23, 35, 27, .12);
    overflow: hidden;
}

.pk-card__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--pd-line);
}

.pk-card__head h5 { margin: 0; font-size: 1rem; font-weight: 700; color: var(--pd-ink); }
.pk-card__head p { margin: 2px 0 0; font-size: .78rem; color: var(--pd-ink-3); }

/* ---------- Toolbar ---------- */
.pk-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--pd-line);
}

.pk-toolbar__end { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }

.pk-search { position: relative; flex: 1 1 260px; max-width: 360px; }

.pk-search > i {
    position: absolute;
    left: 13px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--pd-ink-3);
    font-size: 1.05rem;
    pointer-events: none;
    z-index: 1;
}

.pk-search > input,
.pk-search > input.form-control {
    width: 100%;
    height: 42px;
    padding: 0 14px 0 38px;
    border: 1.5px solid var(--pd-line);
    border-radius: 12px;
    background: #fdfbf7;
    font-size: .88rem;
    color: var(--pd-ink);
    outline: 0;
    transition: border-color .2s, box-shadow .2s, background .2s;
}

.pk-search > input:focus {
    border-color: var(--pd-leaf);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(22, 101, 52, .1);
}

.pk-select { flex: 0 1 220px; min-width: 180px; }
.pk-select .select2-container .select2-selection--single { height: 42px; }
.pk-select .select2-container .select2-selection__rendered { line-height: 39px !important; }

.pk-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 42px;
    padding: 0 16px;
    border-radius: 12px;
    border: 1.5px solid transparent;
    background: transparent;
    font-size: .86rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: transform .2s var(--pd-ease), background .2s, border-color .2s, color .2s, box-shadow .2s;
}

.pk-btn i { font-size: 1.05rem; }

.pk-btn--primary {
    color: #fff;
    background: linear-gradient(135deg, var(--pd-leaf-900), var(--pd-leaf) 55%, #2e8b4a);
    box-shadow: 0 10px 20px -12px rgba(22, 101, 52, .75);
}

.pk-btn--primary:hover { color: #fff; transform: translateY(-1px); }

.pk-btn--success {
    color: #fff;
    background: linear-gradient(135deg, #157a3c, var(--pd-green));
    box-shadow: 0 10px 20px -12px rgba(31, 154, 78, .7);
}

.pk-btn--success:hover { color: #fff; transform: translateY(-1px); }

.pk-btn--danger {
    color: #fff;
    background: linear-gradient(135deg, #a8380a, var(--pd-red));
    box-shadow: 0 10px 20px -12px rgba(219, 74, 14, .6);
}

.pk-btn--danger:hover { color: #fff; transform: translateY(-1px); }

.pk-btn--outline { border-color: var(--pd-line); color: var(--pd-ink-2); background: #fff; }
.pk-btn--outline:hover { border-color: rgba(22, 101, 52, .35); color: var(--pd-leaf); }

.pk-btn--ghost { color: var(--pd-ink-2); background: var(--pd-soft); }
.pk-btn--ghost:hover { color: var(--pd-ink); background: #ece6da; }

.pk-btn--reset:hover { color: var(--pd-red); background: rgba(219, 74, 14, .07); }

.pk-btn.disabled,
.pk-btn:disabled,
.pk-btn.report-btn-disabled { opacity: .5; pointer-events: none; }

.pk-btn__badge {
    display: grid;
    place-items: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--pd-leaf);
    color: #fff;
    font-size: .68rem;
}

/* ---------- Table rows ---------- */
.pk-row {
    animation: pk-row-in .45s var(--pd-ease) backwards;
    animation-delay: calc(var(--i, 0) * 25ms + 120ms);
}

@keyframes pk-row-in {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: none; }
}

.pk-col-action { width: 1%; white-space: nowrap; }

/* Keep row actions reachable when a wide table scrolls sideways */
.pk-table .pk-col-action {
    position: sticky;
    right: 0;
    z-index: 1;
    background: #fff;
    box-shadow: -12px 0 12px -12px rgba(23, 35, 27, .18);
}

.pk-table > thead .pk-col-action { background: #fcfaf5; }
.pk-table > tbody > tr:hover .pk-col-action { background: #fbf9f4; }

/* Person cell: avatar + name + sub line */
.pk-person { display: flex; align-items: center; gap: 12px; min-width: 0; }

.pk-avatar {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--pd-leaf), #2e8b4a);
    color: #fff;
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .02em;
}

.pk-avatar--soft { background: rgba(22, 101, 52, .08); color: var(--pd-leaf); }

.pk-person__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.pk-person__name { font-weight: 600; color: var(--pd-ink); transition: color .2s; }
a.pk-person__name:hover, button.pk-person__name:hover { color: var(--pd-leaf); }
.pk-person__sub { color: var(--pd-ink-3); font-size: .76rem; }

button.pk-person__name { padding: 0; border: 0; background: none; text-align: left; }

/* Phone with quick actions */
.pk-phone { display: flex; align-items: center; gap: 6px; }
.pk-phone > span { margin-right: 4px; font-variant-numeric: tabular-nums; }

.pk-icon {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    font-size: .9rem;
    opacity: .75;
    transition: opacity .2s, transform .2s var(--pd-ease), background .2s;
}

tr:hover .pk-icon { opacity: 1; }
.pk-icon:hover { transform: scale(1.1); }
.pk-icon--call { color: var(--pd-green); background: rgba(31, 154, 78, .1); }
.pk-icon--call:hover { color: var(--pd-green); }
.pk-icon--wa { color: #1fae57; background: rgba(37, 211, 102, .12); }
.pk-icon--wa:hover { color: #1fae57; }

/* Row actions */
.pk-actions { display: inline-flex; align-items: center; gap: 6px; }

.pk-action {
    --tone: var(--pd-leaf);
    --tone-soft: rgba(22, 101, 52, .08);

    display: inline-grid;
    place-items: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid var(--pd-line);
    border-radius: 10px;
    background: #fff;
    color: var(--pd-ink-3);
    font-size: 1.02rem;
    cursor: pointer;
    transition: transform .2s var(--pd-ease), background .2s, color .2s, border-color .2s, box-shadow .2s;
}

.pk-action > span { display: contents; }

.pk-action:hover,
.pk-action:focus-visible {
    transform: translateY(-2px);
    border-color: transparent;
    background: var(--tone-soft);
    color: var(--tone);
    box-shadow: 0 8px 16px -12px var(--tone);
    outline: 0;
}

.pk-action--amber { --tone: var(--pd-amber); --tone-soft: rgba(242, 169, 0, .13); }
.pk-action--teal  { --tone: #0e8a9c;          --tone-soft: rgba(14, 138, 156, .11); }
.pk-action--slate { --tone: #4b5a50;          --tone-soft: rgba(107, 117, 104, .12); }
.pk-action--green { --tone: var(--pd-green); --tone-soft: rgba(31, 154, 78, .1); }
.pk-action--red   { --tone: var(--pd-red);   --tone-soft: rgba(219, 74, 14, .08); }

/* Status chip */
.pk-chip {
    --tone: var(--pd-leaf);
    --tone-soft: rgba(22, 101, 52, .08);

    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--tone-soft);
    color: var(--tone);
    font-size: .74rem;
    font-weight: 600;
}

.pk-chip::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.pk-chip--blue  { --tone: #00569c;          --tone-soft: rgba(0, 86, 156, .1); }
.pk-chip--amber { --tone: #b97a06;          --tone-soft: rgba(242, 169, 0, .13); }
.pk-chip--green { --tone: var(--pd-green); --tone-soft: rgba(31, 154, 78, .1); }
.pk-chip--red   { --tone: var(--pd-red);   --tone-soft: rgba(219, 74, 14, .08); }
.pk-chip--slate { --tone: #6b7568;          --tone-soft: rgba(107, 117, 104, .12); }

/* Date / time pill */
.pk-when {
    --tone: var(--pd-leaf);
    --tone-soft: rgba(22, 101, 52, .07);

    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 10px;
    background: var(--tone-soft);
    color: var(--tone);
    font-weight: 600;
    font-size: .8rem;
}

.pk-when small { opacity: .75; font-weight: 600; }
.pk-when--red   { --tone: var(--pd-red);   --tone-soft: rgba(219, 74, 14, .08); }
.pk-when--green { --tone: var(--pd-green); --tone-soft: rgba(31, 154, 78, .09); }
.pk-when--slate { --tone: #6b7568;          --tone-soft: rgba(107, 117, 104, .1); }

.pk-muted { color: var(--pd-ink-3); }

/* Rank stars */
.pk-rank { display: inline-flex; gap: 1px; color: #e8e1d2; font-size: .9rem; }
.pk-rank .is-on { color: #f5b301; }

/* ---------- Empty state ---------- */
.pk-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 48px 16px;
    text-align: center;
    white-space: normal;
}

.pk-empty__icon {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    margin-bottom: 6px;
    border-radius: 18px;
    background: rgba(22, 101, 52, .07);
    color: var(--pd-leaf);
    font-size: 1.6rem;
}

.pk-empty strong { color: var(--pd-ink); font-size: .95rem; }
.pk-empty small { color: var(--pd-ink-3); }

/* ---------- Confirm dialog ---------- */
.pk-dialog .modal-dialog { max-width: 420px; }
/* No overflow clipping: Select2 dropdowns render inside the dialog body */
.pk-dialog .modal-content { overflow: visible; }

/* Short option lists in dialogs: no search box, no disabled placeholder row */
.pk-dialog .select2-search--dropdown,
.pk-dialog .select2-results__option[aria-disabled=true] { display: none; }

.pk-dialog .select2-container--open { z-index: 5; }

.pk-dialog .select2-dropdown {
    margin-top: 6px;
    border: 1px solid var(--pd-line) !important;
    border-radius: 14px !important;
    padding: 6px;
    box-shadow: 0 24px 48px -20px rgba(23, 35, 27, .4);
    animation: pk-drop .18s var(--pd-ease);
}

.pk-dialog .select2-results__option {
    margin: 2px 0;
    padding: 9px 12px;
    border-radius: 10px;
    font-size: .88rem;
    color: var(--pd-ink-2);
}

.pk-dialog .select2-results__option[aria-selected=true] {
    background: rgba(22, 101, 52, .08) !important;
    color: var(--pd-leaf) !important;
    font-weight: 600;
}

@keyframes pk-drop {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: none; }
}

.pk-dialog__body {
    position: relative;
    padding: 30px 28px 8px;
    text-align: center;
}

.pk-dialog .pk-dialog__close {
    position: absolute !important;
    top: 14px;
    right: 14px;
    padding: .55rem;
    transform: none !important;
    border-radius: 10px;
    background-color: transparent;
    box-shadow: none !important;
    opacity: .55;
    transition: opacity .2s, background-color .2s;
}

.pk-dialog .pk-dialog__close:hover { opacity: 1; background-color: var(--pd-soft); }

.pk-dialog__icon {
    --tone: var(--pd-leaf);
    --tone-soft: rgba(22, 101, 52, .1);

    position: relative;
    display: inline-grid;
    place-items: center;
    width: 64px;
    height: 64px;
    margin-bottom: 16px;
    border-radius: 50%;
    background: var(--tone-soft);
    color: var(--tone);
    font-size: 1.8rem;
}

.pk-dialog__icon::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid var(--tone-soft);
}

.modal.show .pk-dialog__icon { animation: pk-pop .5s var(--pd-ease) both .1s; }

@keyframes pk-pop {
    from { transform: scale(.6); opacity: 0; }
    to { transform: none; opacity: 1; }
}

.pk-dialog__icon--green { --tone: var(--pd-green); --tone-soft: rgba(31, 154, 78, .12); }
.pk-dialog__icon--red   { --tone: var(--pd-red);   --tone-soft: rgba(219, 74, 14, .1); }
.pk-dialog__icon--amber { --tone: var(--pd-amber); --tone-soft: rgba(242, 169, 0, .14); }

.pk-dialog__title { margin: 0 0 6px; font-size: 1.15rem; font-weight: 700; color: var(--pd-ink); }
.pk-dialog__text { margin: 0 auto; max-width: 320px; font-size: .88rem; color: var(--pd-ink-2); }

.pk-dialog__detail {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 18px 0 0;
    padding: 12px 14px;
    border-radius: 14px;
    background: var(--pd-soft);
    text-align: left;
}

.pk-dialog__field { margin-top: 18px; text-align: left; }
.pk-dialog__detail .pk-person__text { flex: 1; min-width: 0; }

.pk-dialog__detail .pk-person__name,
.pk-dialog__detail .pk-person__sub {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pk-dialog__detail .pk-when { flex-shrink: 0; flex-direction: column; gap: 0; padding: 6px 10px; line-height: 1.2; }
.pk-dialog__detail .pk-when > i { display: none; }


.pk-dialog__foot {
    display: flex;
    gap: 10px;
    padding: 20px 28px 26px;
}

.pk-dialog__foot .pk-btn { flex: 1; height: 46px; }

/* ---------- Calendar ---------- */
.pk-filter-chips { display: flex; flex-wrap: wrap; gap: 8px; }

.pk-filter-chip {
    --tone: var(--pd-leaf);

    position: relative;
    display: inline-flex !important; /* template .form-check forces block */
    align-items: center;
    gap: 8px;
    margin: 0 !important;
    padding: 6px 12px 6px 10px !important;
    border: 1.5px solid var(--pd-line);
    border-radius: 999px;
    background: #fff;
    font-size: .8rem;
    font-weight: 600;
    color: var(--pd-ink-2);
    cursor: pointer;
    transition: border-color .2s, background .2s, color .2s;
}

.pk-filter-chip .form-check-input {
    float: none !important;
    width: 14px;
    height: 14px;
    margin: 0 !important;
    border-radius: 4px;
    cursor: pointer;
}

.pk-filter-chip .form-check-label { margin: 0 !important; cursor: pointer; }

.pk-filter-chip:has(.form-check-input:checked) {
    border-color: color-mix(in srgb, var(--tone) 35%, transparent);
    background: color-mix(in srgb, var(--tone) 8%, #fff);
    color: var(--pd-ink);
}

.pk-filter-chip--primary   { --tone: var(--pd-leaf); }
.pk-filter-chip--success   { --tone: var(--pd-green); }
.pk-filter-chip--danger    { --tone: var(--pd-red); }
.pk-filter-chip--warning   { --tone: var(--pd-amber); }
.pk-filter-chip--info      { --tone: #0e8a9c; }
.pk-filter-chip--secondary { --tone: #6b7568; }

/* FullCalendar polish */
.layout-page .fc .fc-toolbar-title { font-size: 1.15rem; font-weight: 700; color: var(--pd-ink); }

.layout-page .fc .fc-button {
    border-radius: 10px !important;
    font-weight: 600;
    text-transform: capitalize;
    box-shadow: none !important;
}

.layout-page .fc .fc-button-primary:not(.fc-prev-button):not(.fc-next-button) {
    border-color: var(--pd-line) !important;
    background: #fff !important;
    color: var(--pd-ink-2) !important;
}

.layout-page .fc .fc-button-primary.fc-button-active:not(.fc-prev-button):not(.fc-next-button) {
    border-color: var(--pd-leaf) !important;
    background: var(--pd-leaf) !important;
    color: #fff !important;
}

.layout-page .fc .fc-button-group { gap: 4px; }
.layout-page .fc .fc-prev-button,
.layout-page .fc .fc-next-button { border-radius: 50% !important; }

.layout-page .fc .fc-col-header-cell-cushion {
    padding: 10px 4px;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--pd-ink-3);
}

.layout-page .fc .fc-daygrid-day.fc-day-today { background: rgba(22, 101, 52, .04) !important; }

.layout-page .fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-number {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    margin: 4px;
    border-radius: 50%;
    background: var(--pd-leaf);
    color: #fff;
}

.layout-page .fc .fc-daygrid-day:hover { background: #fcfaf5; }

.layout-page .fc .fc-event {
    border: 0 !important;
    border-radius: 8px !important;
    padding: 2px 6px;
    font-weight: 600;
    transition: transform .2s var(--pd-ease), box-shadow .2s;
}

.layout-page .fc .fc-event:hover { transform: translateY(-1px); box-shadow: 0 6px 14px -8px rgba(23, 35, 27, .45); }

/* ---------- Responsive ---------- */
@media (max-width: 767.98px) {
    .pk-tab { flex: 1 1 calc(50% - 5px); }
    .pk-tab__count { margin-left: auto; }
    .pk-search { max-width: none; }
    .pk-toolbar__end { margin-left: 0; }
    .pk-page-head__actions { width: 100%; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
    .layout-page .content-wrapper > .container-p-y > *,
    .pk-tab,
    .pk-row,
    .modal.show .pk-dialog__icon { animation: none !important; }

    body:not(.pl-body) .modal.fade .modal-dialog { transition: none !important; transform: none !important; }
}

/* ==========================================================
 * Brand lotus (x-brand.lotus) — login + dashboard hero
 * Each petal outlines itself, then fills with the logo colour
 * back-to-front (--n), then the bloom breathes gently.
 * White strokes stay as the gaps between petals, like the logo.
 * ========================================================== */
.pk-lotus { overflow: visible; }

.pk-lotus__petal {
    stroke: #fff;
    stroke-width: 2.5;
    stroke-linejoin: round;
    stroke-dasharray: 100;
    stroke-dashoffset: 100;
    fill-opacity: 0;
    animation:
        pk-lotus-draw 1.1s cubic-bezier(.45, 0, .2, 1) forwards,
        pk-lotus-fill .8s ease forwards;
    animation-delay:
        calc(var(--n, 1) * .14s + .25s),
        calc(var(--n, 1) * .12s + 1.15s);
}

.pk-lotus__bloom,
.pk-lotus__hands {
    transform-box: view-box;
    transform-origin: 200px 200px;
}

.pk-lotus__bloom { animation: pk-lotus-breathe 7s ease-in-out 2.8s infinite; }

@keyframes pk-lotus-draw { to { stroke-dashoffset: 0; } }
@keyframes pk-lotus-fill { to { fill-opacity: 1; } }

@keyframes pk-lotus-breathe {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.035) translateY(-2px); }
}

@media (prefers-reduced-motion: reduce) {
    .pk-lotus__petal { animation: none; stroke-dashoffset: 0; fill-opacity: 1; }
    .pk-lotus__bloom { animation: none; }
}