/* ==========================================================================
   SEO Temel | Project Manager — pm.css
   Renk Paleti: Lacivert #0A1628, Vurgu #2563EB, Açık #F8FAFC
========================================================================== */

:root {
    --pm-navy:      #0A1628;
    --pm-blue:      #2563EB;
    --pm-blue-lt:   #DBEAFE;
    --pm-white:     #FFFFFF;
    --pm-bg:        #F8FAFC;
    --pm-border:    #E2E8F0;
    --pm-text:      #1E293B;
    --pm-muted:     #64748B;
    --pm-success:   #10B981;
    --pm-danger:    #EF4444;
    --pm-warn:      #F59E0B;
    --pm-radius:    8px;
    --pm-shadow:    0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
}

/* ---- GENEL ---- */
.st-pm-wrap {
    max-width: 1100px;
    margin: 0 auto;
    padding: 24px 16px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: var(--pm-text);
    box-sizing: border-box;
}

.st-pm-wrap * { box-sizing: border-box; }

.st-pm-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 12px;
}

.st-pm-header h1 {
    font-size: 22px;
    font-weight: 700;
    color: var(--pm-navy);
    margin: 0;
    padding: 0;
    border: none;
}

.st-pm-breadcrumb {
    font-size: 13px;
    color: var(--pm-muted);
    margin-bottom: 16px;
}
.st-pm-breadcrumb a { color: var(--pm-blue); text-decoration: none; }
.st-pm-breadcrumb a:hover { text-decoration: underline; }

.st-pm-empty {
    color: var(--pm-muted);
    font-style: italic;
    padding: 16px 0;
}

/* ---- BUTTONS ---- */
.st-pm-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border: none;
    border-radius: var(--pm-radius);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: opacity .15s, box-shadow .15s;
    line-height: 1.4;
    background: var(--pm-border);
    color: var(--pm-text);
}
.st-pm-btn:hover { opacity: .85; }
.st-pm-btn-primary { background: var(--pm-navy); color: #fff; }
.st-pm-btn-blue    { background: var(--pm-blue);  color: #fff; }
.st-pm-btn-danger  { background: var(--pm-danger); color: #fff; }
.st-pm-btn-ghost   { background: transparent; color: var(--pm-blue); border: 1px solid var(--pm-blue); }
.st-pm-btn-sm      { padding: 5px 10px; font-size: 12px; }

/* ---- CARDS ---- */
.st-pm-card {
    background: var(--pm-white);
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    padding: 20px;
    margin-bottom: 16px;
    box-shadow: var(--pm-shadow);
}

.st-pm-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
}

.st-pm-card-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--pm-navy);
    margin: 0;
}

.st-pm-card-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.st-pm-card-desc {
    font-size: 13px;
    color: var(--pm-muted);
    margin: 0 0 12px 0;
}

.st-pm-card-footer {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--pm-border);
}

.st-pm-section {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--pm-border);
}
.st-pm-section strong {
    display: block;
    font-size: 12px;
    text-transform: uppercase;
    color: var(--pm-muted);
    letter-spacing: .05em;
    margin-bottom: 8px;
}

/* ---- TAGS / USER CHIPS ---- */
.st-pm-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--pm-blue-lt);
    color: var(--pm-blue);
    border-radius: 20px;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: 500;
    margin: 2px;
}
.st-pm-tag a {
    color: var(--pm-blue);
    text-decoration: none;
    font-weight: 700;
    margin-left: 2px;
}

.st-pm-tag-chip {
    display: inline-block;
    background: #640094;
    color: #FFFFFF;
    border-radius: 4px;
    padding: 1px 7px;
    font-size: 11px;
    font-weight: 500;
    margin-left: 4px;
}

/* ---- USER SELECT ROW ---- */
.st-pm-add-user-row {
    display: flex;
    gap: 8px;
    margin-top: 8px;
    flex-wrap: wrap;
}

.st-pm-user-list { margin-bottom: 8px; }

/* ---- FILTER ROW ---- */
.st-pm-filter-row {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.st-pm-filter-row label { font-size: 13px; font-weight: 600; }

.st-pm-select, select.st-pm-select {
    padding: 7px 10px;
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    font-size: 13px;
    background: var(--pm-white);
    color: var(--pm-text);
    max-width: 100%;
}

/* ---- TASK ROWS ---- */
.st-pm-task-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: var(--pm-white);
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    margin-bottom: 8px;
    gap: 12px;
    flex-wrap: wrap;
    transition: box-shadow .15s;
}
.st-pm-task-row:hover { box-shadow: 0 2px 8px rgba(0,0,0,.08); }

.st-pm-task-main {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    cursor: pointer;
    flex-wrap: wrap;
}

.st-pm-task-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--pm-navy);
}

.st-pm-task-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.st-pm-status-badge {
    color: #fff;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.st-pm-date {
    font-size: 12px;
    color: var(--pm-muted);
    white-space: nowrap;
}

.st-pm-completed-section { margin-top: 16px; }
#st-pm-completed-tasks   { margin-top: 12px; }

/* ---- SETTINGS TABLE ---- */
.st-pm-settings-table-wrap {
    overflow-x: auto;
}
.st-pm-settings-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--pm-white);
    border-radius: var(--pm-radius);
    overflow: hidden;
    box-shadow: var(--pm-shadow);
    font-size: 13px;
}
.st-pm-settings-table th,
.st-pm-settings-table td {
    padding: 12px 16px;
    border-bottom: 1px solid var(--pm-border);
    text-align: left;
}
.st-pm-settings-table th {
    background: var(--pm-navy);
    color: #fff;
    font-weight: 600;
}
.st-pm-settings-table td:not(:first-child) { text-align: center; }
.st-pm-settings-table tr:last-child td { border-bottom: none; }
.st-pm-settings-table tr:hover td { background: var(--pm-bg); }

/* ---- REPORTS ---- */
.st-pm-report-filters {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
    align-items: center;
}
.st-pm-report-filters select { min-width: 160px; }

.st-pm-report-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    background: var(--pm-white);
    border-radius: var(--pm-radius);
    overflow: hidden;
    box-shadow: var(--pm-shadow);
}
.st-pm-report-table th,
.st-pm-report-table td {
    padding: 10px 14px;
    border-bottom: 1px solid var(--pm-border);
    text-align: left;
}
.st-pm-report-table th { background: var(--pm-navy); color: #fff; }
.st-pm-report-table tr:hover td { background: var(--pm-bg); }

/* ---- MODAL / POPUP ---- */
.st-pm-overlay {
    position: fixed;
    inset: 0;
    background: rgba(10,22,40,.5);
    z-index: 99998;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 24px 16px;
    overflow-y: auto;
}

.st-pm-modal {
    background: var(--pm-white);
    border-radius: 12px;
    width: 100%;
    max-width: 700px;
    box-shadow: 0 20px 60px rgba(0,0,0,.2);
    position: relative;
    margin: auto;
}

.st-pm-modal-header {
    background: var(--pm-navy);
    color: #fff;
    padding: 20px 24px;
    border-radius: 12px 12px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.st-pm-modal-header h2 {
    margin: 0;
    font-size: 18px;
    color: #fff;
    line-height: 1.3;
    border: none;
    padding: 0;
}

.st-pm-modal-meta {
    font-size: 12px;
    color: rgba(255,255,255,.7);
    margin-top: 4px;
}

.st-pm-modal-close {
    background: none;
    border: none;
    color: #fff;
    font-size: 22px;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    opacity: .7;
    flex-shrink: 0;
}
.st-pm-modal-close:hover { opacity: 1; }

.st-pm-modal-body {
    padding: 24px;
}

.st-pm-modal-tabs {
    display: flex;
    border-bottom: 2px solid var(--pm-border);
    margin-bottom: 20px;
    gap: 0;
    flex-wrap: wrap;
}

.st-pm-tab {
    padding: 10px 18px;
    font-size: 13px;
    font-weight: 600;
    color: var(--pm-muted);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: color .15s, border-color .15s;
    background: none;
    border-top: none;
    border-left: none;
    border-right: none;
}
.st-pm-tab.active {
    color: var(--pm-blue);
    border-bottom-color: var(--pm-blue);
}
.st-pm-tab:hover { color: var(--pm-blue); }

.st-pm-tab-content { display: none; }
.st-pm-tab-content.active { display: block; }

/* ---- FORM ---- */
.st-pm-form-group {
    margin-bottom: 16px;
}
.st-pm-form-group label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--pm-muted);
    letter-spacing: .05em;
    margin-bottom: 6px;
}
.st-pm-input, .st-pm-textarea {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    font-size: 14px;
    color: var(--pm-text);
    background: var(--pm-white);
    transition: border-color .15s;
}
.st-pm-input:focus, .st-pm-textarea:focus {
    outline: none;
    border-color: var(--pm-blue);
    box-shadow: 0 0 0 3px rgba(37,99,235,.1);
}
.st-pm-textarea { min-height: 80px; resize: vertical; }

.st-pm-status-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}
.st-pm-status-option {
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    border: 2px solid transparent;
    color: #fff;
    transition: opacity .15s, border-color .15s;
    opacity: .55;
}
.st-pm-status-option.selected { opacity: 1; border-color: rgba(0,0,0,.2); }

/* ---- COMMENTS ---- */
.st-pm-comment {
    padding: 12px 0;
    border-bottom: 1px solid var(--pm-border);
}
.st-pm-comment:last-child { border-bottom: none; }
.st-pm-comment-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
    flex-wrap: wrap;
    gap: 8px;
}
.st-pm-comment-author {
    font-size: 13px;
    font-weight: 700;
    color: var(--pm-navy);
}
.st-pm-comment-date {
    font-size: 11px;
    color: var(--pm-muted);
}
.st-pm-comment-body {
    font-size: 13px;
    line-height: 1.6;
    color: var(--pm-text);
    word-break: break-word;
}
.st-pm-comment-body a { color: var(--pm-blue); }
.st-pm-comment-body div,
.st-pm-comment-body p { margin: 0; min-height: 1em; }
.st-pm-comment-body br { display: block; content: ''; }
.st-pm-comment-actions {
    margin-top: 6px;
    display: flex;
    gap: 8px;
}

.st-pm-comment-editor {
    margin-top: 16px;
}
.st-pm-editor-toolbar {
    display: flex;
    gap: 4px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}
.st-pm-editor-btn {
    padding: 4px 10px;
    border: 1px solid var(--pm-border);
    border-radius: 4px;
    background: var(--pm-white);
    font-size: 13px;
    cursor: pointer;
    font-weight: 600;
    color: var(--pm-text);
}
.st-pm-editor-btn:hover { background: var(--pm-bg); }
.st-pm-editor-area {
    min-height: 80px;
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    padding: 10px 12px;
    font-size: 13px;
    outline: none;
    background: var(--pm-white);
    line-height: 1.7;
    word-break: break-word;
}
.st-pm-editor-area:focus { border-color: var(--pm-blue); box-shadow: 0 0 0 3px rgba(37,99,235,.1); }
.st-pm-editor-area div,
.st-pm-editor-area p { margin: 0; min-height: 1em; }

/* ---- ACTIVITIES ---- */
.st-pm-activity {
    display: flex;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid var(--pm-border);
    font-size: 13px;
}
.st-pm-activity:last-child { border-bottom: none; }
.st-pm-activity-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--pm-blue);
    margin-top: 5px;
    flex-shrink: 0;
}
.st-pm-activity-text { color: var(--pm-text); flex: 1; }
.st-pm-activity-meta { font-size: 11px; color: var(--pm-muted); margin-top: 2px; }

.st-pm-shortcode-info {
    font-size: 12px;
    color: var(--pm-muted);
    margin: 4px 0 0 0;
}
.st-pm-shortcode-info code {
    background: var(--pm-bg);
    border: 1px solid var(--pm-border);
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 12px;
    color: var(--pm-blue);
    font-family: monospace;
}

/* ---- FRONT-END BLOCKS ---- */
.st-pm-project-block {
    margin-bottom: 32px;
    border: 1px solid var(--pm-border);
    border-radius: 10px;
    overflow: hidden;
}
.st-pm-project-header {
    background: var(--pm-navy);
    padding: 16px 20px;
    color: #fff;
}
.st-pm-project-title {
    margin: 0 0 4px 0;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
}
.st-pm-project-desc {
    margin: 0;
    font-size: 13px;
    color: rgba(255,255,255,.75);
}
.st-pm-tl-block {
    padding: 16px 20px;
    border-top: 1px solid var(--pm-border);
}
.st-pm-tl-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--pm-navy);
    margin: 0 0 4px 0;
}
.st-pm-tl-desc {
    font-size: 13px;
    color: var(--pm-muted);
    margin: 0 0 12px 0;
}
.st-pm-tasks-front { margin-top: 10px; }

.st-pm-notice {
    padding: 12px 16px;
    background: var(--pm-blue-lt);
    color: var(--pm-blue);
    border-radius: var(--pm-radius);
    font-size: 14px;
}

/* ---- RESPONSIVE ---- */
@media (max-width: 640px) {
    .st-pm-header { flex-direction: column; align-items: flex-start; }
    .st-pm-card   { padding: 14px; }
    .st-pm-modal  { max-width: 100%; margin: 0; border-radius: 0; min-height: 100vh; }
    .st-pm-overlay { padding: 0; align-items: flex-start; }
    .st-pm-modal-header { border-radius: 0; }
    .st-pm-task-row { flex-direction: column; align-items: flex-start; }
    .st-pm-report-filters { flex-direction: column; }
    .st-pm-report-filters select { width: 100%; }
    .st-pm-modal-tabs { overflow-x: auto; flex-wrap: nowrap; }
    .st-pm-tab { white-space: nowrap; }
}

/* ---- INLINE TASKLIST ---- */
.st-pm-tl-inline {
    background: var(--pm-bg);
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    margin-top: 10px;
    overflow: hidden;
}

.st-pm-tl-inline-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: #EFF6FF;
    border-bottom: 1px solid var(--pm-border);
    gap: 0;
}

/* Sürükle ve collapse ikonları sol grupta bitişik */
.st-pm-tl-drag {
    margin-right: 2px;
    flex-shrink: 0;
}

.st-pm-tl-inline-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--pm-navy);
    flex: 1;
    margin-left: 6px;
}

.st-pm-tl-tasks { padding: 6px 0; }

.st-pm-task-row-inline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    border-bottom: 1px solid var(--pm-border);
    gap: 10px;
    flex-wrap: wrap;
    transition: background .1s;
}
.st-pm-task-row-inline:last-child { border-bottom: none; }
.st-pm-task-row-inline:hover { background: var(--pm-blue-lt); }

.st-pm-task-main {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    cursor: pointer;
    flex-wrap: wrap;
    min-width: 0;
}

/* ---- SECTION HEADER ---- */
.st-pm-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    flex-wrap: wrap;
    gap: 8px;
}
.st-pm-section-header strong {
    font-size: 12px;
    text-transform: uppercase;
    color: var(--pm-muted);
    letter-spacing: .05em;
}

/* ---- KULLANICI ARAMA ---- */
.st-pm-user-search-wrap {
    position: relative;
    display: flex;
    gap: 8px;
    margin-top: 8px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.st-pm-user-search-input {
    flex: 1;
    min-width: 160px;
    max-width: 260px;
}

.st-pm-user-search-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    width: 260px;
    background: var(--pm-white);
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    box-shadow: 0 4px 16px rgba(0,0,0,.1);
    z-index: 1000;
    max-height: 220px;
    overflow-y: auto;
}

.st-pm-user-search-item {
    padding: 9px 14px;
    font-size: 13px;
    cursor: pointer;
    color: var(--pm-text);
    border-bottom: 1px solid var(--pm-border);
    transition: background .1s;
}
.st-pm-user-search-item:last-child { border-bottom: none; }
.st-pm-user-search-item:hover { background: var(--pm-blue-lt); color: var(--pm-blue); }
.st-pm-user-search-item.hidden { display: none; }

/* ---- SAYFALAMA ---- */
.st-pm-pagination {
    display: flex;
    gap: 6px;
    margin-top: 24px;
    flex-wrap: wrap;
}

.st-pm-page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--pm-radius);
    background: var(--pm-white);
    border: 1px solid var(--pm-border);
    font-size: 13px;
    font-weight: 600;
    color: var(--pm-text);
    text-decoration: none;
    transition: background .15s, color .15s;
}
.st-pm-page-btn:hover { background: var(--pm-blue-lt); color: var(--pm-blue); border-color: var(--pm-blue); }
.st-pm-page-btn.active { background: var(--pm-navy); color: #fff; border-color: var(--pm-navy); }

@media (max-width: 640px) {
    .st-pm-tl-inline-header { flex-direction: column; align-items: flex-start; }
    .st-pm-task-row-inline { flex-direction: column; align-items: flex-start; }
    .st-pm-user-search-dropdown { width: 100%; }
}

/* ---- HEADER RIGHT ---- */
.st-pm-header-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

@media (max-width: 640px) {
    .st-pm-header-right { width: 100%; }
    .st-pm-header-right .st-pm-input { width: 100%; max-width: 100% !important; }
}

/* ---- KATEGORİ BADGE ---- */
.st-pm-card-title-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    flex: 1;
}

.st-pm-cat-badge {
    display: inline-block;
    background: var(--pm-blue);
    color: #fff;
    border-radius: 20px;
    padding: 2px 12px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .03em;
    white-space: nowrap;
}

.st-pm-cat-badge-light {
    background: rgba(255,255,255,.18);
    color: #fff;
    border: 1px solid rgba(255,255,255,.35);
}

.st-pm-project-status-badge {
    display: inline-block;
    border-radius: 20px;
    padding: 2px 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .03em;
    white-space: nowrap;
    margin-left: 4px;
}

/* ---- PROJE DURUMU BANNER'I (Ön Yüz) — v1.7.0 ---- */
.st-pm-status-banner {
    border-radius: var(--pm-radius);
    padding: 18px 22px;
    margin-bottom: 16px;
}
.st-pm-status-banner-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 6px;
}
.st-pm-status-banner-body {
    font-size: 14px;
    line-height: 1.6;
    opacity: .92;
}

/* ---- AYARLAR SECTION ---- */
.st-pm-settings-section {
    background: var(--pm-white);
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    padding: 24px;
    box-shadow: var(--pm-shadow);
}

.st-pm-settings-section-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--pm-navy);
    margin: 0 0 16px 0;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--pm-border);
}

/* ---- KATEGORİ LİSTESİ ---- */
.st-pm-cat-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--pm-border);
    gap: 10px;
    flex-wrap: wrap;
}
.st-pm-cat-row:last-child { border-bottom: none; }

.st-pm-cat-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--pm-navy);
    flex: 1;
}

.st-pm-cat-actions { display: flex; gap: 8px; }

.st-pm-cat-add-row {
    display: flex;
    gap: 10px;
    margin-top: 16px;
    align-items: center;
    flex-wrap: wrap;
}

/* ---- ÖN YÜZ PROJE HEADER ---- */
.st-pm-project-header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

@media (max-width: 640px) {
    .st-pm-cat-add-row { flex-direction: column; align-items: flex-start; }
    .st-pm-cat-add-row .st-pm-input { width: 100%; max-width: 100% !important; }
    .st-pm-project-header-top { flex-direction: column; align-items: flex-start; }
}

/* ---- NOTLAR PANELİ (Admin) ---- */
.st-pm-notes-panel {
    border-top: 2px solid var(--pm-blue-lt);
    margin-top: 0;
}

.st-pm-note-card {
    background: #FFFBEB;
    border: 1px solid #FDE68A;
    border-radius: var(--pm-radius);
    padding: 14px 16px;
    margin-bottom: 10px;
}

.st-pm-note-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}

.st-pm-note-title {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: var(--pm-navy);
    margin-bottom: 2px;
}

.st-pm-note-meta {
    display: block;
    font-size: 11px;
    color: var(--pm-muted);
}

.st-pm-note-actions { display: flex; gap: 6px; flex-shrink: 0; }

.st-pm-note-content {
    font-size: 13px;
    line-height: 1.7;
    color: var(--pm-text);
}
.st-pm-note-content a { color: var(--pm-blue); }

/* ---- NOTLAR BUTONU ---- */
.st-pm-btn-note {
    background: #FEF3C7;
    color: #92400E;
    border: 1px solid #FDE68A;
}
.st-pm-btn-note:hover { background: #FDE68A; }

/* ---- RENK PALETİ ---- */
.st-pm-color-palette {
    display: inline-flex;
    gap: 5px;
    align-items: center;
    margin-left: 6px;
    vertical-align: middle;
}

.st-pm-color-btn {
    width: 22px;
    height: 22px;
    min-width: 22px;
    min-height: 22px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,.7);
    cursor: pointer;
    outline: 1px solid rgba(0,0,0,.2);
    transition: transform .15s, outline-color .15s;
    flex-shrink: 0;
    padding: 0;
    display: inline-block;
    line-height: 1;
}
.st-pm-color-btn:hover { transform: scale(1.25); outline-color: rgba(0,0,0,.5); }

/* ---- NOTLAR PANELİ (Ön Yüz) ---- */
.st-pm-notes-panel-front {
    background: #FFFBEB;
    border-top: 1px solid #FDE68A;
    border-bottom: 1px solid #FDE68A;
    padding: 16px 20px;
}

.st-pm-notes-front-inner { max-width: 100%; }

.st-pm-notes-front-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    font-weight: 700;
    color: var(--pm-navy);
    margin-bottom: 12px;
    flex-wrap: wrap;
    gap: 8px;
}

.st-pm-btn-notes-toggle {
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.35);
    color: #fff;
    padding: 5px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    text-transform: none;
    letter-spacing: normal;
}
.st-pm-btn-notes-toggle:hover,
.st-pm-btn-notes-toggle.st-pm-notes-btn-active {
    background: #000;
    color: #fff;
    border-color: #000;
}

@media (max-width: 640px) {
    .st-pm-note-header { flex-direction: column; }
    .st-pm-color-palette { flex-wrap: wrap; }
}

/* ---- NOT ITEM ---- */
.st-pm-note-item {
    background: #FFFBEB;
    border: 1px solid #FDE68A;
    border-radius: var(--pm-radius);
    padding: 14px 16px;
    margin-bottom: 10px;
}

.st-pm-note-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}

.st-pm-note-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--pm-navy);
    margin-bottom: 2px;
}

.st-pm-note-meta {
    font-size: 11px;
    color: var(--pm-muted);
}

.st-pm-note-actions { display: flex; gap: 6px; flex-shrink: 0; }

.st-pm-note-body {
    font-size: 13px;
    line-height: 1.7;
    color: var(--pm-text);
    word-break: break-word;
}
.st-pm-note-body a { color: var(--pm-blue); }
.st-pm-note-body div,
.st-pm-note-body p { margin: 0; min-height: 1em; }
.st-pm-note-body br { display: block; content: ''; }

/* ---- NOT PANELİ HEADER ---- */
.st-pm-notes-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    flex-wrap: wrap;
    gap: 10px;
}
.st-pm-notes-panel-header strong,
.st-pm-notes-panel-header span {
    font-size: 13px;
    font-weight: 700;
    color: var(--pm-navy);
    text-transform: uppercase;
    letter-spacing: .04em;
}
.st-pm-notes-panel-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* ---- NOT SAYFALAMA ---- */
.st-pm-notes-pag {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 12px;
    flex-wrap: wrap;
}
.st-pm-pag-btn {
    min-width: 32px;
    height: 32px;
    padding: 0 8px;
    border-radius: var(--pm-radius);
    border: 1px solid var(--pm-border);
    background: var(--pm-white);
    color: var(--pm-text);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s, color .15s;
    line-height: 1;
}
.st-pm-pag-btn:hover { background: var(--pm-blue-lt); color: var(--pm-blue); border-color: var(--pm-blue); }
.st-pm-pag-btn.active { background: var(--pm-navy); color: #fff; border-color: var(--pm-navy); }

.st-pm-notes-pag-info {
    font-size: 12px;
    color: var(--pm-muted);
    margin-left: 6px;
}

@media (max-width: 640px) {
    .st-pm-notes-panel-header { flex-direction: column; align-items: flex-start; }
    .st-pm-notes-panel-controls { width: 100%; }
    .st-pm-notes-panel-controls .st-pm-input { width: 100%; max-width: 100% !important; }
}

/* ---- DRAG & DROP ---- */
.st-pm-drag-handle {
    cursor: grab;
    color: var(--pm-muted);
    font-size: 14px;
    padding: 0 6px;
    user-select: none;
    flex-shrink: 0;
    letter-spacing: -2px;
    opacity: .5;
    transition: opacity .15s;
}
.st-pm-drag-handle:hover { opacity: 1; color: var(--pm-navy); }
.st-pm-drag-handle:active { cursor: grabbing; }

.st-pm-task-drag { margin-right: 4px; }

.st-pm-sort-placeholder {
    background: var(--pm-blue-lt);
    border: 2px dashed var(--pm-blue);
    border-radius: var(--pm-radius);
    height: 44px;
    margin-bottom: 4px;
}

/* Sürüklenirken */
.st-pm-tl-inline.ui-sortable-helper,
.st-pm-task-row-inline.ui-sortable-helper {
    box-shadow: 0 8px 24px rgba(0,0,0,.15);
    opacity: .95;
    background: var(--pm-white);
}

/* ---- GÖREV KULLANICI AVATARLARI ---- */
.st-pm-task-avatars {
    display: flex;
    align-items: center;
    gap: -4px;
    flex-direction: row;
}

.st-pm-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    border: 2px solid #fff;
    margin-left: -4px;
    flex-shrink: 0;
    cursor: default;
    position: relative;
    transition: transform .15s, z-index .15s;
    z-index: 1;
}
.st-pm-avatar:first-child { margin-left: 0; }
.st-pm-avatar:hover { transform: scale(1.15); z-index: 10; }

.st-pm-avatar-more {
    background: var(--pm-muted) !important;
    font-size: 9px;
    cursor: pointer;
}
.st-pm-avatar-more:hover { background: var(--pm-navy) !important; }

/* Tooltip */
.st-pm-avatar[title]:hover::after {
    content: attr(title);
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--pm-navy);
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    padding: 3px 8px;
    border-radius: 4px;
    white-space: nowrap;
    pointer-events: none;
    z-index: 100;
}

/* ---- GÖREV AÇIKLAMASI GÖRÜNÜMÜ ---- */
.st-pm-task-desc-view {
    font-size: 13px;
    line-height: 1.7;
    color: var(--pm-text);
    word-break: break-word;
}
.st-pm-task-desc-view br { display: block; content: ''; }
.st-pm-task-desc-view div,
.st-pm-task-desc-view p { margin: 0; min-height: 1em; }

/* ---- GÖREV LİSTESİ ACCORDION ---- */
.st-pm-tl-collapse {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--pm-muted);
    font-size: 11px;
    padding: 0 2px;
    line-height: 1;
    transition: transform .2s, color .15s;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}
.st-pm-tl-collapse:hover { color: var(--pm-navy); }
.st-pm-tl-collapse.st-pm-tl-collapsed { transform: rotate(-90deg); }

.st-pm-tl-body { overflow: hidden; }

/* Ön yüz görev listesi header */
.st-pm-tl-front-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
}
.st-pm-tl-front-header .st-pm-tl-title { margin: 0; }

/* ---- NOTLAR — admin paneli konum düzeltme ---- */
.st-pm-notes-section {
    border-top: 2px solid #FDE68A;
    background: #FFFBEB;
    margin: 0 -20px;
    padding: 16px 20px;
}

/* ---- NOT ACCORDION ---- */
.st-pm-note-header {
    cursor: pointer;
    user-select: none;
}
.st-pm-note-header:hover { background: rgba(0,0,0,.02); }

.st-pm-note-header-left {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    flex: 1;
    min-width: 0;
}

.st-pm-note-arrow {
    font-size: 10px;
    color: var(--pm-muted);
    margin-top: 3px;
    flex-shrink: 0;
    display: inline-block;
    transition: transform .2s;
}

.st-pm-note-body {
    border-top: 1px solid #FDE68A;
    padding-top: 12px;
    margin-top: 4px;
}

/* ---- PROJE SEKMELERİ ---- */
.st-pm-project-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--pm-border);
    margin: 16px 0;
    flex-wrap: wrap;
}

.st-pm-project-tab {
    padding: 10px 20px;
    font-size: 13px;
    font-weight: 600;
    color: var(--pm-muted);
    text-decoration: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: color .15s, border-color .15s;
}
.st-pm-project-tab:hover { color: var(--pm-blue); }
.st-pm-project-tab.active { color: var(--pm-blue); border-bottom-color: var(--pm-blue); }

/* ---- PROJE GRID ---- */
.st-pm-projects-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 16px;
    margin-top: 8px;
}

.st-pm-grid-card {
    background: var(--pm-white);
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    padding: 16px;
    box-shadow: var(--pm-shadow);
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: box-shadow .15s;
}
.st-pm-grid-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,.1); }
.st-pm-grid-card--done { opacity: .7; background: var(--pm-bg); }

.st-pm-grid-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
}

.st-pm-grid-card-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--pm-navy);
    text-decoration: none;
    flex: 1;
    line-height: 1.3;
}
.st-pm-grid-card-title:hover { color: var(--pm-blue); }

.st-pm-fav-star { color: #f59e0b; font-size: 13px; }

.st-pm-grid-card-desc {
    font-size: 12px;
    color: var(--pm-muted);
    margin: 0;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.st-pm-grid-card-users {
    display: flex;
    align-items: center;
    gap: -4px;
    flex-wrap: wrap;
}

.st-pm-grid-card-footer {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid var(--pm-border);
}

/* ---- GÖREV LİSTELERİ — Proje başlığı ---- */
.st-pm-tl-project-header {
    background: var(--pm-navy);
    border-radius: var(--pm-radius);
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.st-pm-tl-project-name {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 4px 0;
    border: none;
    padding: 0;
}

.st-pm-tl-project-desc {
    font-size: 13px;
    color: rgba(255,255,255,.75);
    margin: 0;
}

.st-pm-tl-project-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}

@media (max-width: 768px) {
    .st-pm-projects-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
    .st-pm-projects-grid { grid-template-columns: 1fr; }
    .st-pm-tl-project-header { flex-direction: column; align-items: flex-start; }
}

/* ---- MODAL KULLANICI YÖNETIMI ---- */
.st-pm-user-tags-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
    min-height: 28px;
}
.st-pm-user-search-row {
    position: relative;
    display: flex;
    gap: 8px;
}
.st-pm-user-search-row .st-pm-user-search-dropdown {
    top: 100%;
    left: 0;
    right: 0;
    width: auto;
}

/* ---- KULLANICI DROPDOWN İTEM ---- */
.st-pm-user-search-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 10px;
}
.st-pm-user-item-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--pm-text);
}
.st-pm-user-item-meta {
    font-size: 11px;
    color: var(--pm-muted);
}

/* ==========================================================================
   ÖDEMELER (v1.4.0)
========================================================================== */
.st-pm-notice-success {
    background: #ECFDF5;
    border: 1px solid #A7F3D0;
    color: #047857;
    padding: 10px 14px;
    border-radius: var(--pm-radius);
    margin-bottom: 16px;
    font-size: 13px;
}
.st-pm-notice-error {
    background: #FEF2F2;
    border: 1px solid #FECACA;
    color: #B91C1C;
    padding: 10px 14px;
    border-radius: var(--pm-radius);
    margin-bottom: 16px;
    font-size: 13px;
}

.st-pm-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}
.st-pm-form-row {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.st-pm-form-row label {
    font-size: 12px;
    font-weight: 600;
    color: var(--pm-muted);
}
.st-pm-form-row input,
.st-pm-form-row select {
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    padding: 8px 10px;
    font-size: 13px;
    color: var(--pm-text);
}

.st-pm-payment-preview {
    margin-top: 20px;
    padding: 14px 16px;
    background: var(--pm-bg);
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    font-size: 13px;
    display: grid;
    gap: 6px;
    max-width: 360px;
}
.st-pm-payment-preview-total {
    border-top: 1px dashed var(--pm-border);
    padding-top: 8px;
    margin-top: 4px;
    font-size: 15px;
}

/* Müşteri portalı ödeme kutusu */
.st-pm-payment-box {
    margin-top: 14px;
    padding: 14px 16px;
    background: #FFFBEB;
    border: 1px solid #FDE68A;
    border-radius: var(--pm-radius);
}
.st-pm-payment-box-title {
    font-weight: 700;
    color: var(--pm-navy);
    margin-bottom: 8px;
    font-size: 14px;
}
.st-pm-payment-breakdown {
    display: grid;
    gap: 4px;
    font-size: 13px;
    color: var(--pm-text);
}
.st-pm-payment-total {
    border-top: 1px dashed #FDE68A;
    margin-top: 4px;
    padding-top: 6px;
    font-size: 15px;
}
.st-pm-payment-dates {
    margin-top: 8px;
    font-size: 12px;
    color: var(--pm-muted);
}
.st-pm-iban-box {
    margin-top: 12px;
    padding: 10px 12px;
    background: var(--pm-white);
    border: 1px solid var(--pm-border);
    border-radius: var(--pm-radius);
    font-size: 12px;
    color: var(--pm-text);
}
.st-pm-iban-box-title {
    font-weight: 600;
    margin-bottom: 4px;
    color: var(--pm-muted);
}

/* Son ödeme günü geldiğinde/geçtiğinde vurgulu kırmızı durum */
.st-pm-payment-box-overdue {
    background: #E60000;
    border-color: #E60000;
}
.st-pm-payment-box-overdue .st-pm-payment-box-title,
.st-pm-payment-box-overdue .st-pm-payment-breakdown,
.st-pm-payment-box-overdue .st-pm-payment-dates {
    color: #FFFFFF;
}
.st-pm-payment-box-overdue .st-pm-payment-total {
    border-top-color: rgba(255,255,255,.4);
}
.st-pm-payment-box-overdue .st-pm-iban-box {
    background: rgba(255,255,255,.92);
}

/* Bekleyen ödeme yokken gösterilen olumlu durum kartı */
.st-pm-payment-box-clear {
    background: #ECFDF5;
    border: 1px solid #A7F3D0;
    color: #047857;
    font-weight: 600;
    font-size: 14px;
    text-align: center;
    padding: 16px;
}

/* ---- Trafik Raporu — rapor görünürlüğü checkbox grid'i (v1.6.0) ---- */
.st-pm-report-settings-checks {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 4px 16px;
    margin-bottom: 4px;
}
.st-pm-checkbox-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 400;
    color: var(--pm-text, #1f2937);
    cursor: pointer;
    padding: 4px 0;
}
.st-pm-checkbox-row input[type="checkbox"] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    cursor: pointer;
}

/* ---- TRAFİK RAPORU PANELİ (Ön Yüz) — v1.8.0 ---- */
.st-pm-traffic-panel-front {
    background: #012345;
    border-top: 1px solid rgba(255,255,255,.12);
    border-bottom: 1px solid rgba(255,255,255,.12);
    padding: 16px 20px;
}
.st-pm-traffic-front-inner { max-width: 100%; }

.st-pm-traffic-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    flex-wrap: wrap;
    gap: 10px;
}
.st-pm-traffic-panel-header > span {
    font-size: 13px;
    font-weight: 700;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.st-pm-traffic-period-switch {
    display: inline-flex;
    background: #fff;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 20px;
    padding: 2px;
    gap: 2px;
}
.st-pm-period-btn {
    background: transparent;
    border: none;
    padding: 5px 14px;
    border-radius: 18px;
    font-size: 12px;
    font-weight: 600;
    color: var(--pm-muted);
    cursor: pointer;
}
.st-pm-period-btn.st-pm-period-active {
    background: #FFA84D;
    color: #012345;
}

.st-pm-traffic-section-title {
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
    margin: 18px 0 10px;
    text-transform: uppercase;
    letter-spacing: .03em;
}
.st-pm-traffic-section-title:first-child { margin-top: 0; }

.st-pm-traffic-channel-title {
    font-size: 12px;
    font-weight: 600;
    color: rgba(255,255,255,.75);
    margin: 10px 0 8px;
}

.st-pm-traffic-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.st-pm-traffic-card {
    background: #fff;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: var(--pm-radius);
    padding: 14px 16px;
}
.st-pm-traffic-card-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--pm-muted);
    text-transform: uppercase;
    letter-spacing: .03em;
    margin-bottom: 6px;
}
.st-pm-traffic-card-value {
    font-size: 22px;
    font-weight: 700;
    color: var(--pm-navy);
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
}
.st-pm-traffic-card-sub {
    font-size: 11px;
    color: var(--pm-muted);
    margin-top: 6px;
}

/* Mobil uyum — telefonda kartlar tek sütuna iner, dokunma hedefleri büyür */
@media (max-width: 480px) {
    .st-pm-traffic-panel-front { padding: 14px 12px; }
    .st-pm-traffic-cards { grid-template-columns: 1fr; gap: 10px; }
    .st-pm-traffic-card { padding: 12px 14px; }
    .st-pm-traffic-card-value { font-size: 19px; }
    .st-pm-traffic-panel-header { justify-content: center; text-align: center; }
    .st-pm-traffic-period-switch { width: 100%; justify-content: center; }
    .st-pm-period-btn { flex: 1; padding: 8px 10px; }
    .st-pm-traffic-section-title { font-size: 13px; }
}

/* Koyu panel içindeki boş durum mesajı (ör. "Henüz veri senkronize edilmedi") okunaklı kalsın */
.st-pm-traffic-panel-front .st-pm-empty { color: rgba(255,255,255,.75); }

/* ---- ÖZET GRAFİĞİ (panelin en üstü) — v1.8.3 ---- */
.st-pm-summary-chart-wrap {
    background: #fff;
    border-radius: var(--pm-radius);
    padding: 14px 16px;
    margin-bottom: 16px;
}
.st-pm-summary-chart {
    width: 100%;
}
.st-pm-chart-inner {
    position: relative;
}
.st-pm-summary-chart svg {
    display: block;
}
.st-pm-chart-hit {
    cursor: pointer;
}
.st-pm-chart-tooltip {
    position: absolute;
    top: 4px;
    background: #012345;
    color: #fff;
    border-radius: 6px;
    padding: 8px 10px;
    font-size: 11px;
    line-height: 1.6;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(0,0,0,.25);
    white-space: nowrap;
    z-index: 5;
}
.st-pm-chart-tooltip-date {
    font-weight: 700;
    margin-bottom: 3px;
    color: #FFA84D;
}
.st-pm-chart-legend {
    display: flex;
    gap: 18px;
    justify-content: center;
    margin-top: 6px;
    font-size: 12px;
    color: var(--pm-muted);
}
.st-pm-chart-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.st-pm-chart-legend i {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}
@media (max-width: 480px) {
    .st-pm-summary-chart-wrap { padding: 12px 10px; }
    .st-pm-chart-tooltip { font-size: 10px; padding: 6px 8px; }
}




/* ==========================================================================
   v2.0.0 EKLERİ
========================================================================== */

/* Görev etiketleri — mor arka plan (#640094) */
.st-pm-tag.st-pm-tag--label { background: #640094; color: #FFFFFF; }
.st-pm-tag.st-pm-tag--label a { color: #FFFFFF; opacity: .85; }
.st-pm-tag.st-pm-tag--label a:hover { opacity: 1; }

/* Görev listesi açıklaması — liste adının altında */
.st-pm-tl-inline-titles { flex: 1; min-width: 0; display: flex; flex-direction: column; margin-left: 6px; }
.st-pm-tl-inline-titles .st-pm-tl-inline-name { margin-left: 0; }
.st-pm-tl-inline-desc { display: block; font-size: 12px; font-weight: 400; color: var(--pm-muted); margin-top: 2px; line-height: 1.45; white-space: pre-line; }

/* Listeler arası sürükle-bırak: boş listeye de bırakılabilsin */
.st-pm-tasks-sortable { min-height: 34px; }
.st-pm-tasks-sortable.st-pm-drop-target { background: #F5F3FF; outline: 2px dashed #A78BFA; outline-offset: -4px; }

/* Ödeme ayarları KDV uyarısı */
.st-pm-vat-warning { color: #DC2626; font-size: 13px; line-height: 1.6; font-weight: 500; margin: 16px 0 0; max-width: 820px; }

/* Tarih uyarısı */
.st-pm-date-error { color: #DC2626; font-size: 12px; font-weight: 500; margin: -4px 0 12px; }

/* Zengin metin içerikleri (açıklama, yorum, not) — liste ve paragraf aralıkları */
.st-pm-task-desc-view ul, .st-pm-task-desc-view ol,
.st-pm-comment-body ul, .st-pm-comment-body ol,
.st-pm-note-body ul, .st-pm-note-body ol { padding-left: 22px; margin: 6px 0; }
.st-pm-task-desc-view p, .st-pm-comment-body p, .st-pm-note-body p { margin: 0 0 6px; }
.st-pm-task-desc-view a, .st-pm-note-body a { color: var(--pm-blue); }
.st-pm-comment-editor-label { display: block; font-size: 12px; font-weight: 600; color: var(--pm-muted); margin-bottom: 6px; }

/* TinyMCE — pop-up içinde düzgün görünsün; açılır menüler ve pencereler karartmanın üstünde kalsın */
.st-pm-overlay .mce-tinymce { border: 1px solid var(--pm-border) !important; border-radius: var(--pm-radius); overflow: hidden; box-shadow: none !important; }
.st-pm-overlay .mce-top-part::before { box-shadow: none !important; }
.st-pm-overlay .mce-toolbar-grp { background: #F8FAFC !important; border-bottom: 1px solid var(--pm-border) !important; }
.mce-floatpanel, .mce-menu, .mce-tooltip, .mce-colorbutton-grid { z-index: 100110 !important; }
.mce-window { z-index: 100120 !important; }
#mce-modal-block { z-index: 100115 !important; }
.st-pm-rich-input { min-height: 140px; }

/* Bildirim listesi (admin + panel) */
.st-pm-notif-list { display: flex; flex-direction: column; gap: 8px; }
.st-pm-notif-item {
    display: flex; gap: 12px; align-items: flex-start;
    padding: 12px 14px; background: #FFFFFF; border: 1px solid var(--pm-border); border-radius: var(--pm-radius);
    text-decoration: none; color: var(--pm-text); transition: border-color .15s, background .15s;
}
.st-pm-notif-item:hover { border-color: #94A3B8; color: var(--pm-text); }
.st-pm-notif-item:focus-visible { outline: 2px solid var(--pm-blue); outline-offset: 2px; }
.st-pm-notif-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 7px; flex: 0 0 8px; background: transparent; }
.st-pm-notif-item.is-unread { background: #FFF8F0; border-color: #FFD3A5; }
.st-pm-notif-item.is-unread .st-pm-notif-dot { background: #FF8A1F; }
.st-pm-notif-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.st-pm-notif-type { font-size: 12px; font-weight: 600; color: var(--pm-muted); }
.st-pm-notif-text { font-size: 14px; line-height: 1.5; word-break: break-word; }
.st-pm-notif-text strong { font-weight: 600; color: var(--pm-navy); }
.st-pm-notif-time { font-size: 12px; color: var(--pm-muted); }
.st-pm-notif-unread-info { font-size: 13px; color: var(--pm-muted); }

/* v2.1.0 — Proforma ayarları */
.st-pm-logo-picker { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.st-pm-logo-preview { display: inline-flex; align-items: center; justify-content: center; min-width: 140px; height: 48px; padding: 4px 10px; border: 1px dashed var(--pm-border); border-radius: var(--pm-radius); background: #fff; font-size: 12px; color: var(--pm-muted); }
.st-pm-logo-preview img { max-height: 38px; max-width: 200px; width: auto; display: block; }
.st-pm-seller-preview { margin-top: 18px; padding: 14px 16px; border: 1px solid var(--pm-border); border-radius: var(--pm-radius); background: #F8FAFC; font-size: 13px; line-height: 1.7; max-width: 760px; }
.st-pm-seller-preview-title { font-size: 12px; font-weight: 600; color: var(--pm-muted); margin-bottom: 4px; }

/* v2.1.2 — Ödemeler listesi: bağlı kayıt durumu */
.st-pm-link-status { font-size: 11px; color: var(--pm-muted); margin-top: 2px; }
.st-pm-link-status--trash, .st-pm-link-status--missing, .st-pm-link-status--cancelled { color: #B91C1C; }
.st-pm-link-status--refunded { color: #7C3AED; }
.st-pm-form-row[hidden] { display: none !important; }

/* v2.2.0 — görev penceresi işlem butonları */
.st-pm-task-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 6px; }
.st-pm-task-actions #pm-delete-task { margin-left: auto; }

/* v2.4.0 — En İyi Performans Gösteren Sayfalar / Anahtar Kelimeler */
.st-pm-top-wrap { display: grid; gap: 16px; margin-top: 16px; }
.st-pm-top-card { background: #fff; border: 1px solid #DCE3EB; border-radius: 10px; padding: 18px 20px 16px; color: #26384D; min-width: 0; }
.st-pm-top-title { margin: 0 0 4px; font-size: 16px; font-weight: 700; color: #0F2238; line-height: 1.35; }
.st-pm-top-sub { margin: 0 0 14px; font-size: 13px; color: #5D6F84; }
.st-pm-top-loading, .st-pm-top-empty { margin: 0; color: #5D6F84; font-size: 14px; }
.st-pm-top-table { width: 100%; border-collapse: collapse; font-size: 14px; table-layout: auto; }
.st-pm-top-table th { text-align: right; font-size: 12px; font-weight: 600; color: #5D6F84; padding: 8px 10px; border-bottom: 1px solid #DCE3EB; white-space: nowrap; }
.st-pm-top-table th:first-child { text-align: left; }
.st-pm-top-table td { padding: 10px; border-bottom: 1px solid #EEF2F6; text-align: right; white-space: nowrap; vertical-align: middle; }
.st-pm-top-table td strong { color: #0F2238; font-weight: 600; }
.st-pm-top-table td.st-pm-top-key { text-align: left; white-space: normal; width: 100%; }
.st-pm-top-row.is-hidden { display: none; }
.st-pm-top-key { display: table-cell; }
.st-pm-top-rank { display: inline-block; min-width: 22px; color: #94A3B8; font-size: 12px; font-variant-numeric: tabular-nums; }
.st-pm-top-label { overflow-wrap: anywhere; word-break: break-word; color: #0F2238; font-weight: 500; }
.st-pm-top-label a { color: #1D4A73; text-decoration: none; }
.st-pm-top-label a:hover { text-decoration: underline; }
.st-pm-top-new { display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 999px; background: #E7F0FF; color: #1D4ED8; font-size: 11px; font-weight: 600; vertical-align: 1px; }
.st-pm-top-chg { display: inline-block; margin-left: 6px; font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.st-pm-top-chg.is-up { color: #0E9F6E; }
.st-pm-top-chg.is-down { color: #D92D20; }
.st-pm-top-chg.is-flat { color: #94A3B8; }
.st-pm-top-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 12px; font-size: 13px; color: #5D6F84; }
.st-pm-top-more { border: 1px solid #C7D2DE; background: #fff; color: #0F2238; border-radius: 8px; padding: 8px 14px; font: inherit; font-weight: 600; cursor: pointer; min-height: 40px; }
.st-pm-top-more:hover { border-color: #9FB0C3; background: #F5F8FB; }
.st-pm-top-note { margin: 10px 0 0; font-size: 12px; color: #5D6F84; }

@media (max-width: 640px) {
    .st-pm-top-card { padding: 16px 14px 14px; }
    .st-pm-top-table, .st-pm-top-table tbody { display: block; }
    .st-pm-top-table thead { display: none; }
    .st-pm-top-table tr.st-pm-top-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; padding: 12px 0; border-bottom: 1px solid #EEF2F6; }
    .st-pm-top-table tr.st-pm-top-row.is-hidden { display: none; }
    .st-pm-top-table td { display: block; padding: 0; border: 0; text-align: left; white-space: normal; }
    .st-pm-top-table td.st-pm-top-key { grid-column: 1 / -1; width: auto; }
    .st-pm-top-table td[data-label]::before { content: attr(data-label); display: block; font-size: 11px; font-weight: 600; color: #5D6F84; text-transform: uppercase; letter-spacing: .02em; margin-bottom: 2px; }
    .st-pm-top-table td strong { font-size: 15px; }
    .st-pm-top-foot { flex-direction: column; align-items: stretch; }
    .st-pm-top-more { width: 100%; }
}