.cha-pcm-admin {
max-width: 1280px;
}
.cha-pcm-page-head {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 24px;
margin: 24px 0;
padding: 24px;
background: #ffffff;
border: 1px solid #e5e7eb;
border-radius: 18px;
box-shadow: 0 12px 30px rgba(15, 23, 42, 0.04);
}
.cha-pcm-page-head h1 {
margin: 0 0 8px;
font-size: 28px;
font-weight: 700;
color: #111827;
}
.cha-pcm-page-head p {
margin: 0;
max-width: 760px;
color: #6b7280;
font-size: 14px;
line-height: 1.6;
}
.cha-pcm-version {
display: inline-flex;
align-items: center;
padding: 6px 12px;
border-radius: 999px;
background: #eef2ff;
color: #3730a3;
font-size: 12px;
font-weight: 700;
}
.cha-pcm-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 16px;
margin-bottom: 20px;
}
.cha-pcm-card,
.cha-pcm-panel {
background: #ffffff;
border: 1px solid #e5e7eb;
border-radius: 18px;
box-shadow: 0 12px 30px rgba(15, 23, 42, 0.04);
}
.cha-pcm-card {
padding: 20px;
}
.cha-pcm-card-label {
display: block;
margin-bottom: 10px;
color: #64748b;
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .06em;
}
.cha-pcm-card strong {
display: block;
margin-bottom: 8px;
color: #0f172a;
font-size: 28px;
line-height: 1;
}
.cha-pcm-card p {
margin: 0;
color: #64748b;
font-size: 13px;
line-height: 1.5;
}
.cha-pcm-panel {
padding: 24px;
}
.cha-pcm-panel h2 {
margin: 0 0 10px;
color: #111827;
font-size: 20px;
}
.cha-pcm-panel p {
margin: 0 0 14px;
color: #64748b;
font-size: 14px;
line-height: 1.6;
}
.cha-pcm-checklist {
margin: 16px 0 0;
padding: 0;
list-style: none;
}
.cha-pcm-checklist li {
position: relative;
margin: 8px 0;
padding-left: 26px;
color: #374151;
}
.cha-pcm-checklist li::before {
content: "✓";
position: absolute;
left: 0;
top: 0;
color: #059669;
font-weight: 800;
}
@media (max-width: 1100px) {
.cha-pcm-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 700px) {
.cha-pcm-page-head {
flex-direction: column;
}
.cha-pcm-grid {
grid-template-columns: 1fr;
}
}
.cha-pcm-readable-payload th {
color: #334155;
font-weight: 700;
}
.cha-pcm-readable-payload td {
color: #0f172a;
}
.cha-pcm-readable-payload .button-small {
margin-right: 8px;
}
.cha-pcm-action-form{margin:0 0 14px;padding:14px;border:1px solid #e5e7eb;border-radius:14px;background:#fff;}
.cha-pcm-action-form label{display:block;font-weight:700;margin:0 0 6px;color:#334155;}
.cha-pcm-action-form textarea,.cha-pcm-action-form input[type="text"],.cha-pcm-action-form select{width:100%;max-width:100%;margin:0 0 10px;border-radius:8px;border:1px solid #cbd5e1;}
.cha-pcm-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.cha-pcm-workflow-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start;}
@media(max-width:1200px){.cha-pcm-workflow-actions,.cha-pcm-form-grid{grid-template-columns:1fr;}} .cha-pcm-admin-v105 .cha-pcm-page-head-compact{margin-bottom:18px;}
.cha-pcm-admin-v105 .cha-pcm-summary-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
.cha-pcm-admin-v105 .cha-pcm-summary-grid .cha-pcm-card strong{font-size:17px;line-height:1.35;}
.cha-pcm-stage-panel{padding:18px 22px;margin-bottom:18px;}
.cha-pcm-stage-panel h2{font-size:16px;margin-bottom:12px;}
.cha-pcm-stage-strip{display:flex;flex-wrap:wrap;gap:8px;}
.cha-pcm-stage-item{display:inline-flex;align-items:center;padding:8px 12px;border:1px solid #e5e7eb;border-radius:999px;background:#f8fafc;color:#475569;font-size:12px;font-weight:700;}
.cha-pcm-stage-item.is-active{background:#eef2ff;color:#3730a3;border-color:#c7d2fe;}
.cha-pcm-main-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;align-items:start;}
.cha-pcm-main-layout main,.cha-pcm-main-layout aside{display:flex;flex-direction:column;gap:18px;}
.cha-pcm-panel-title-row{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px;}
.cha-pcm-panel-title-row h2{margin:0 0 6px;}
.cha-pcm-panel-title-row p{margin:0;}
.cha-pcm-clean-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.cha-pcm-clean-actions .cha-pcm-action-form{height:100%;}
.cha-pcm-stacked-form{display:block;margin:0;padding:0;border:0;background:transparent;}
.cha-pcm-stacked-form label{display:block;font-weight:700;margin:14px 0 6px;color:#334155;}
.cha-pcm-stacked-form textarea,.cha-pcm-stacked-form input[type="text"],.cha-pcm-stacked-form input[type="url"],.cha-pcm-stacked-form input[type="number"],.cha-pcm-stacked-form input[type="date"],.cha-pcm-stacked-form select{width:100%;max-width:100%;border-radius:10px;border:1px solid #cbd5e1;box-shadow:none;}
.cha-pcm-checkline{display:flex!important;align-items:center;gap:8px;margin:14px 0!important;font-weight:700!important;}
.cha-pcm-checkline input{margin:0!important;}
.cha-pcm-current-record{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 16px;padding:12px 14px;border:1px solid #dbeafe;border-radius:14px;background:#eff6ff;color:#1e3a8a;}
.cha-pcm-current-record strong{font-size:14px;}
.cha-pcm-current-record span{font-size:12px;font-weight:700;color:#475569;}
.cha-pcm-option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px;}
.cha-pcm-option-box{padding:16px;border:1px solid #e5e7eb;border-radius:16px;background:#fbfdff;}
.cha-pcm-option-box h3{margin:0 0 10px;font-size:16px;color:#0f172a;}
.cha-pcm-form-grid.compact{grid-template-columns:1fr 110px;}
.cha-pcm-publish-box{margin-top:16px;padding:16px;border:1px solid #c7d2fe;border-radius:16px;background:#f8faff;}
.cha-pcm-publish-box label{display:block;font-weight:700;margin:0 0 6px;color:#334155;}
.cha-pcm-publish-box textarea{width:100%;max-width:100%;border-radius:10px;border:1px solid #cbd5e1;}
.cha-pcm-publish-box p{margin:10px 0 0;font-size:12px;color:#64748b;}
.cha-pcm-sla-box h2{font-size:17px;}
.cha-pcm-details{background:#fff;border:1px solid #e5e7eb;border-radius:18px;box-shadow:0 12px 30px rgba(15,23,42,.04);overflow:hidden;}
.cha-pcm-details summary{cursor:pointer;padding:16px 18px;font-weight:800;color:#0f172a;list-style:none;}
.cha-pcm-details summary::-webkit-details-marker{display:none;}
.cha-pcm-details summary::after{content:'+';float:right;color:#64748b;font-weight:900;}
.cha-pcm-details[open] summary::after{content:'–';}
.cha-pcm-details-body{padding:0 18px 18px;}
.cha-pcm-wide-details{margin-top:18px;}
.cha-pcm-history-grid{display:grid;grid-template-columns:1fr;gap:20px;padding:0 18px 18px;}
.cha-pcm-history-grid h3{margin:10px 0;font-size:16px;color:#0f172a;}
.cha-pcm-inline-form{display:inline;margin:0;padding:0;border:0;background:transparent;}
@media(max-width:1200px){.cha-pcm-main-layout{grid-template-columns:1fr}.cha-pcm-clean-actions,.cha-pcm-option-grid{grid-template-columns:1fr}.cha-pcm-form-grid.compact{grid-template-columns:1fr}.cha-pcm-admin-v105 .cha-pcm-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:700px){.cha-pcm-admin-v105 .cha-pcm-summary-grid{grid-template-columns:1fr}.cha-pcm-panel-title-row{display:block}.cha-pcm-stage-strip{display:block}.cha-pcm-stage-item{margin:0 6px 8px 0}} .cha-pcm-admin-v107 {
max-width: 1440px;
}
.cha-pcm-admin-v107 .cha-pcm-page-head,
.cha-pcm-admin-v107 .cha-pcm-panel,
.cha-pcm-admin-v107 .cha-pcm-card,
.cha-pcm-admin-v107 .cha-pcm-details {
box-sizing: border-box;
}
.cha-pcm-admin-v107 .cha-pcm-summary-grid,
.cha-pcm-admin-v107 .cha-pcm-payments-summary {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.cha-pcm-admin-v107 .cha-pcm-main-layout {
grid-template-columns: minmax(0, 1fr);
}
.cha-pcm-admin-v107 .cha-pcm-main-layout aside {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 18px;
}
.cha-pcm-admin-v107 .cha-pcm-clean-actions,
.cha-pcm-admin-v107 .cha-pcm-option-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.cha-pcm-admin-v107 .cha-pcm-clean-actions {
align-items: stretch;
}
.cha-pcm-admin-v107 .cha-pcm-clean-actions .cha-pcm-action-form:first-child {
grid-column: span 1;
}
.cha-pcm-admin-v107 .cha-pcm-clean-actions .cha-pcm-action-form:last-child {
grid-column: span 2;
border-color: #bfdbfe;
background: #f8fbff;
}
.cha-pcm-admin-v107 input[type="text"],
.cha-pcm-admin-v107 input[type="email"],
.cha-pcm-admin-v107 input[type="url"],
.cha-pcm-admin-v107 input[type="number"],
.cha-pcm-admin-v107 input[type="search"],
.cha-pcm-admin-v107 input[type="date"],
.cha-pcm-admin-v107 input[type="file"],
.cha-pcm-admin-v107 select,
.cha-pcm-admin-v107 textarea {
box-sizing: border-box;
width: 100%;
max-width: 100%;
}
.cha-pcm-admin-v107 input[type="file"] {
padding: 8px;
min-height: 42px;
background: #fff;
border: 1px solid #cbd5e1;
border-radius: 10px;
}
.cha-pcm-admin-v107 .cha-pcm-invoice-box {
border-color: #dbeafe;
background: #fbfdff;
}
.cha-pcm-admin-v107 .cha-pcm-settings-layout {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 18px;
align-items: start;
}
.cha-pcm-admin-v107 .cha-pcm-settings-layout .cha-pcm-panel:nth-child(3),
.cha-pcm-admin-v107 .cha-pcm-settings-layout .cha-pcm-panel:nth-child(5) {
grid-column: 1 / -1;
}
.cha-pcm-admin-v107 .cha-pcm-settings-form label {
display: block;
font-weight: 700;
margin: 12px 0 6px;
color: #334155;
}
.cha-pcm-admin-v107 .cha-pcm-settings-form label small,
.cha-pcm-admin-v107 .description {
display: block;
font-weight: 500;
color: #64748b;
margin-top: 3px;
}
.cha-pcm-admin-v107 .cha-pcm-filter-form {
display: grid;
grid-template-columns: 180px 240px minmax(240px, 1fr) auto auto;
gap: 12px;
align-items: end;
}
.cha-pcm-admin-v107 .cha-pcm-filter-form label {
margin: 0;
font-weight: 700;
color: #334155;
}
.cha-pcm-admin-v107 .cha-pcm-table-responsive th,
.cha-pcm-admin-v107 .cha-pcm-table-responsive td {
vertical-align: top;
}
.cha-pcm-admin-v107 .cha-pcm-sticky-submit {
position: sticky;
bottom: 0;
z-index: 5;
padding: 14px 16px !important;
margin: 18px 0 0 !important;
background: rgba(248, 250, 252, .92);
backdrop-filter: blur(8px);
border: 1px solid #e5e7eb;
border-radius: 16px;
}
@media (max-width: 1200px) {
.cha-pcm-admin-v107 .cha-pcm-summary-grid,
.cha-pcm-admin-v107 .cha-pcm-payments-summary,
.cha-pcm-admin-v107 .cha-pcm-main-layout aside,
.cha-pcm-admin-v107 .cha-pcm-settings-layout,
.cha-pcm-admin-v107 .cha-pcm-clean-actions,
.cha-pcm-admin-v107 .cha-pcm-option-grid {
grid-template-columns: 1fr;
}
.cha-pcm-admin-v107 .cha-pcm-clean-actions .cha-pcm-action-form:last-child,
.cha-pcm-admin-v107 .cha-pcm-settings-layout .cha-pcm-panel:nth-child(3),
.cha-pcm-admin-v107 .cha-pcm-settings-layout .cha-pcm-panel:nth-child(5) {
grid-column: auto;
}
.cha-pcm-admin-v107 .cha-pcm-filter-form {
grid-template-columns: 1fr;
}
} .cha-pcm-policy-box {
padding: 14px 16px;
border: 1px solid #d9f99d;
border-radius: 14px;
background: #f7fee7;
color: #3f6212;
font-weight: 700;
line-height: 1.55;
}