/* =============================================================
   Cloud Clients — Design System v2
   ============================================================= */

/* Hide site header and footer on portal and registration pages */
.cc-portal-page header:not(.cc-header),
.cc-portal-page #header,
.cc-portal-page .site-header,
.cc-portal-page #masthead,
.cc-portal-page .header-main,
.cc-portal-page .navbar,
.cc-portal-page footer,
.cc-portal-page #footer,
.cc-portal-page .site-footer,
.cc-portal-page #colophon,
.cc-portal-page .footer-widgets,
.cc-portal-page .footer-bottom {
	display: none !important;
}

/* Hide page title on portal and registration pages */
.cc-portal-page h1.entry-title,
.cc-portal-page h1.page-title,
.cc-portal-page .page-header,
.cc-portal-page .entry-header {
	display: none;
}

/* Remove theme top padding so portal starts high on the page */
.cc-portal-page .entry-content,
.cc-portal-page .page-content,
.cc-portal-page .site-main > article,
.cc-portal-page .wp-block-group.has-global-padding {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

:root {
	--cc-blue:      #2563eb;
	--cc-blue-dk:   #1d4ed8;
	--cc-blue-lt:   #dbeafe;
	--cc-green:     #16a34a;
	--cc-green-lt:  #dcfce7;
	--cc-red:       #dc2626;
	--cc-red-lt:    #fee2e2;

	--cc-bg:        #f1f5f9;
	--cc-card:      #ffffff;
	--cc-border:    #e2e8f0;
	--cc-border-dk: #cbd5e1;

	--cc-text:      #1e293b;
	--cc-muted:     #64748b;
	--cc-subtle:    #94a3b8;

	--cc-radius:    8px;
	--cc-radius-lg: 12px;

	--cc-shadow-sm: 0 1px 2px rgba(0,0,0,.05);
	--cc-shadow:    0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
	--cc-shadow-md: 0 4px 6px rgba(0,0,0,.07), 0 2px 4px rgba(0,0,0,.05);
}

/* Global site footer */
.cc-site-footer {
	width: 100%;
	border-top: 1px solid var(--cc-border);
	background: transparent;
	color: var(--cc-muted);
}
.cc-site-footer-inner {
	max-width: 1180px;
	margin: 0 auto;
	padding: 8px 18px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-size: .72em;
	letter-spacing: .01em;
	opacity: .82;
}
.cc-site-footer-left,
.cc-site-footer-right {
	white-space: nowrap;
	font-weight: 400;
}

/* ── Base ────────────────────────────────────────────────────── */

.cc-wrap {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.6;
	color: var(--cc-text);
	background: var(--cc-bg);
	min-height: 80vh;
	max-width: 1080px;
	margin: 0 auto;
	padding-bottom: 0;
	box-sizing: border-box;
}

*, *::before, *::after { box-sizing: inherit; }

/* ── Header ──────────────────────────────────────────────────── */

.cc-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding: 16px 24px;
	background: var(--cc-card);
	border-bottom: 1px solid var(--cc-border);
	margin-bottom: 24px;
	border-radius: var(--cc-radius-lg) var(--cc-radius-lg) 0 0;
	box-shadow: var(--cc-shadow-sm);
}

.cc-header-brand {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 1.05em;
	font-weight: 700;
	color: var(--cc-blue);
	text-decoration: none;
}

.cc-header-brand svg { width: 20px; height: 20px; flex-shrink: 0; }

.cc-header-user {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: .86em;
	color: var(--cc-muted);
	flex-wrap: wrap;
}

.cc-header-name { display: inline; font-size: .88em; }

.cc-header-user a {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	color: var(--cc-muted);
	text-decoration: none;
	padding: 5px 12px;
	border: 1px solid var(--cc-border);
	border-radius: 20px;
	transition: all .15s;
	white-space: nowrap;
}

.cc-header-user a:hover { color: var(--cc-text); border-color: var(--cc-border-dk); background: var(--cc-bg); }
.cc-header-user a svg { width: 14px; height: 14px; }
.cc-header-user #cc-open-profile-btn {
	background: #eef2ff;
	color: #1e3a8a;
	border: 1px solid #c7d2fe;
	font-weight: 600;
	padding: 8px 14px;
	min-height: 36px;
	font-size: .86em;
	border-radius: 999px;
	line-height: 1.2;
	white-space: nowrap;
	text-align: center;
	justify-content: center;
}
.cc-header-user #cc-open-profile-btn:hover {
	background: #e0e7ff;
	border-color: #a5b4fc;
	color: #1e40af;
}
.cc-header-user #cc-open-profile-btn.is-active {
	background: var(--cc-blue);
	border-color: var(--cc-blue);
	color: #fff;
	box-shadow: 0 4px 10px rgba(37,99,235,.25);
}
.cc-profile-panel { margin: 0 24px 12px; }
.cc-profile-panel textarea.cc-input { resize: vertical; min-height: 64px; }
.cc-user-strip {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
	margin: 0 24px 14px;
	padding: 10px 12px;
	border: 1px solid var(--cc-border);
	border-radius: var(--cc-radius);
	background: #f8fafc;
}
.cc-user-strip-item {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.cc-user-strip-label {
	font-size: .72em;
	color: var(--cc-muted);
	text-transform: uppercase;
	font-weight: 600;
	letter-spacing: .04em;
}
.cc-user-strip-value {
	font-size: .9em;
	color: var(--cc-text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-weight: 500;
}

/* Client office details strip */
.cc-office-contact-strip {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
	margin: 0 24px 14px;
	padding: 10px 12px;
	border: 1px solid var(--cc-border);
	border-radius: var(--cc-radius);
	background: #f8fafc;
}

.cc-office-contact-item {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.cc-office-contact-label {
	font-size: .72em;
	color: var(--cc-muted);
	text-transform: uppercase;
	font-weight: 600;
	letter-spacing: .04em;
}

.cc-office-contact-value {
	font-size: .9em;
	color: var(--cc-text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cc-office-contact-item-address .cc-office-contact-value {
	white-space: normal;
	line-height: 1.35;
}

/* ── Office Switcher Bar ─────────────────────────────────────── */

.cc-office-switcher-bar {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 24px 14px;
	padding: 8px 14px;
	background: #f0f6ff;
	border: 1px solid #c6deff;
	border-radius: var(--cc-radius);
}

.cc-office-switcher-label {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: .8em;
	font-weight: 600;
	color: var(--cc-blue);
	white-space: nowrap;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.cc-office-switcher-select {
	flex: 1;
	min-width: 0;
	padding: 5px 10px;
	border: 1px solid #c6deff;
	border-radius: var(--cc-radius);
	background: #fff;
	color: var(--cc-text);
	font-size: .9em;
	cursor: pointer;
}

.cc-office-switcher-select:focus {
	outline: none;
	border-color: var(--cc-blue);
	box-shadow: 0 0 0 2px rgba(37,99,235,.12);
}

/* ── Tab Navigation ──────────────────────────────────────────── */

.cc-tabs-nav {
	display: flex;
	gap: 4px;
	padding: 4px;
	background: var(--cc-border);
	border-radius: calc(var(--cc-radius-lg) + 3px);
	margin: 0 24px 24px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.cc-tabs-nav::-webkit-scrollbar { display: none; }

.cc-tab-btn {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 14px;
	border: none;
	background: transparent;
	border-radius: var(--cc-radius);
	cursor: pointer;
	font-size: .84em;
	font-weight: 500;
	color: var(--cc-muted);
	transition: all .18s;
	white-space: nowrap;
	font-family: inherit;
}

.cc-tab-btn svg { width: 14px; height: 14px; stroke: currentColor; flex-shrink: 0; }
.cc-tab-btn:hover { color: var(--cc-text); }
.cc-tab-btn.active { background: var(--cc-card); color: var(--cc-blue); box-shadow: var(--cc-shadow); }

.cc-notif-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 9px;
	background: var(--cc-red);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
}

.cc-notif-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 14px 0;
	border-bottom: 1px solid var(--cc-border);
}
.cc-notif-item:last-child { border-bottom: none; }
.cc-notif-item.unread { background: var(--cc-blue-lt); margin: 0 -20px; padding: 14px 20px; border-radius: var(--cc-radius); }
.cc-notif-dot {
	width: 8px; height: 8px; border-radius: 50%;
	background: var(--cc-blue); flex-shrink: 0; margin-top: 6px;
}
.cc-notif-dot.read { background: var(--cc-border-dk); }
.cc-notif-body { flex: 1; min-width: 0; }
.cc-notif-title { font-weight: 500; color: var(--cc-text); margin-bottom: 2px; }
.cc-notif-meta { font-size: .82em; color: var(--cc-muted); }

/* ── Panels ──────────────────────────────────────────────────── */

.cc-panel { display: none; padding: 0 24px 28px; animation: ccFadeIn .2s ease; }
.cc-panel.active { display: block; }

@keyframes ccFadeIn { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }

/* ── Cards ───────────────────────────────────────────────────── */

.cc-card {
	background: var(--cc-card);
	border: 1px solid var(--cc-border);
	border-radius: var(--cc-radius-lg);
	box-shadow: var(--cc-shadow);
	padding: 20px;
	margin-bottom: 18px;
}

.cc-card-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 18px;
	flex-wrap: wrap;
	gap: 10px;
}

.cc-card-title {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 1em;
	font-weight: 600;
	color: var(--cc-text);
	margin: 0;
}

.cc-card-title svg { width: 16px; height: 16px; stroke: var(--cc-blue); }

/* ── Buttons ─────────────────────────────────────────────────── */

.cc-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 8px 15px;
	border: 1px solid transparent;
	border-radius: var(--cc-radius);
	font-size: .84em;
	font-weight: 500;
	cursor: pointer;
	transition: all .15s;
	text-decoration: none;
	line-height: 1.4;
	white-space: nowrap;
	font-family: inherit;
}

.cc-btn svg { width: 13px; height: 13px; stroke: currentColor; flex-shrink: 0; }

.cc-btn-primary { background: var(--cc-blue); color: #fff; border-color: var(--cc-blue); }
.cc-btn-primary:hover { background: var(--cc-blue-dk); border-color: var(--cc-blue-dk); color: #fff; box-shadow: 0 4px 10px rgba(37,99,235,.25); }

.cc-btn-secondary { background: var(--cc-bg); color: var(--cc-text); border-color: var(--cc-border); }
.cc-btn-secondary:hover { background: var(--cc-border); border-color: var(--cc-border-dk); color: var(--cc-text); }

.cc-btn-danger { background: var(--cc-red-lt); color: var(--cc-red); border-color: #fca5a5; }
.cc-btn-danger:hover { background: var(--cc-red); color: #fff; border-color: var(--cc-red); }

.cc-btn-ghost { background: transparent; color: var(--cc-muted); border-color: transparent; }
.cc-btn-ghost:hover { background: var(--cc-bg); color: var(--cc-text); }

.cc-btn-sm { padding: 4px 10px; font-size: .78em; }
.cc-btn:disabled { opacity: .5; cursor: not-allowed; box-shadow: none !important; }

/* Desktop: slightly larger action buttons for file rows */
.cc-tree-file-actions .cc-btn-sm {
	padding: 6px 12px;
	font-size: .84em;
	min-height: 32px;
}

.cc-tree-file-actions .cc-btn-secondary {
	background: var(--cc-blue);
	color: #fff;
	border-color: var(--cc-blue);
}

.cc-tree-file-actions .cc-btn-secondary:hover {
	background: var(--cc-blue-dk);
	color: #fff;
	border-color: var(--cc-blue-dk);
}

.cc-date-mobile { display: none; }
.cc-tree-file-actions { position: relative; }
.cc-file-more-menu {
	display: none;
	position: absolute;
	right: 0;
	top: calc(100% + 4px);
	min-width: 116px;
	background: #fff;
	border: 1px solid var(--cc-border);
	border-radius: 10px;
	box-shadow: 0 12px 26px rgba(15, 23, 42, .12);
	padding: 6px;
	z-index: 50;
}
.cc-tree-file-actions.menu-open .cc-file-more-menu { display: block; }
.cc-file-more-item {
	display: block;
	width: 100%;
	text-align: left;
	background: transparent;
	border: none;
	padding: 7px 8px;
	border-radius: 8px;
	font-size: .78em;
	color: var(--cc-text);
	cursor: pointer;
}
.cc-file-more-item:hover { background: #f1f5f9; }
.cc-file-more-item.cc-file-more-danger { color: var(--cc-red); }

/* Desktop/tablet: keep original action layout (no "more" menu). */
@media (min-width: 641px) {
	#cc-file-tree .cc-tree-file-actions .js-file-more,
	#cc-file-tree .cc-tree-file-actions .cc-file-more-menu {
		display: none !important;
	}
}

/* ── Forms ───────────────────────────────────────────────────── */

.cc-form-group { margin-bottom: 14px; }


.cc-label {
	display: block;
	font-size: .76em;
	font-weight: 600;
	color: var(--cc-muted);
	margin-bottom: 5px;
	text-transform: uppercase;
	letter-spacing: .05em;
}

.cc-input, .cc-select {
	width: 100%;
	padding: 9px 12px;
	border: 1px solid var(--cc-border);
	border-radius: var(--cc-radius);
	font-size: .93em;
	color: var(--cc-text);
	background: var(--cc-card);
	transition: border-color .15s, box-shadow .15s;
	outline: none;
	box-sizing: border-box;
	font-family: inherit;
}

.cc-input:focus, .cc-select:focus { border-color: var(--cc-blue); box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.cc-input::placeholder { color: var(--cc-subtle); }

.cc-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.cc-upload-grid { display: grid; grid-template-columns: 3fr 2fr; gap: 12px; }
.cc-client-info-chip { margin-top: 5px; font-size: .82em; color: var(--cc-muted); padding: 4px 8px; background: var(--cc-blue-lt); color: #1e3a8a; border-radius: var(--cc-radius); display: none; }
.cc-client-combo { position: relative; }
.cc-client-search { margin-bottom: 0; }
.cc-client-combo #cc-client-search { padding-right: 34px; }
.cc-client-clear-btn {
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
	height: 20px;
	border: none;
	border-radius: 50%;
	background: var(--cc-border);
	color: var(--cc-muted);
	cursor: pointer;
	font-size: 15px;
	line-height: 20px;
	padding: 0;
}
.cc-client-clear-btn:hover {
	background: var(--cc-border-dk);
	color: var(--cc-text);
}
.cc-client-options {
	position: absolute;
	left: 0;
	right: 0;
	top: calc(100% + 6px);
	background: var(--cc-card);
	border: 1px solid var(--cc-border);
	border-radius: var(--cc-radius);
	box-shadow: var(--cc-shadow);
	max-height: 220px;
	overflow-y: auto;
	display: none;
	z-index: 20;
}
.cc-client-options.visible { display: block; }
.cc-client-option {
	display: block;
	width: 100%;
	text-align: left;
	background: transparent;
	border: none;
	border-bottom: 1px solid var(--cc-border);
	padding: 8px 10px;
	cursor: pointer;
	font-size: .86em;
	color: var(--cc-text);
}
.cc-client-option:last-child { border-bottom: none; }
.cc-client-option span {
	display: block;
	font-size: .78em;
	color: var(--cc-muted);
	margin-top: 2px;
}
.cc-client-option:hover { background: #f8fafc; }
.cc-client-option.empty {
	cursor: default;
	color: var(--cc-subtle);
}
.cc-recent-clients {
	display: none;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 8px;
}
.cc-recent-clients.visible {
	display: flex;
}
.cc-recent-client-btn {
	border: 1px solid var(--cc-border);
	background: var(--cc-bg);
	color: var(--cc-text);
	border-radius: 999px;
	padding: 4px 10px;
	font-size: .8em;
	cursor: pointer;
	line-height: 1.2;
}
.cc-recent-client-btn:hover {
	border-color: var(--cc-blue);
	background: var(--cc-blue-lt);
	color: #1e3a8a;
}
.cc-uploader-recent-files {
	margin-top: 8px;
	border: 1px solid var(--cc-border);
	border-radius: var(--cc-radius);
	background: #f8fafc;
	padding: 8px 10px;
}
.cc-uploader-recent-head {
	font-size: .74em;
	font-weight: 700;
	color: var(--cc-muted);
	text-transform: uppercase;
	letter-spacing: .05em;
	margin-bottom: 6px;
}
.cc-uploader-recent-item {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px;
	padding: 4px 0;
	font-size: .84em;
}
.cc-uploader-recent-item strong {
	color: var(--cc-text);
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.cc-uploader-recent-item span {
	color: var(--cc-muted);
	font-size: .9em;
	white-space: nowrap;
}
.cc-uploader-recent-empty {
	font-size: .82em;
	color: var(--cc-subtle);
}

.cc-add-form { display: none; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--cc-border); animation: ccFadeIn .2s ease; }
.cc-add-form.open { display: block; }
.cc-add-form button[type="submit"] { margin-bottom: 20px; }

.cc-cat-add-wrap { padding-top: 0 !important; border-top: none !important; margin-bottom: 20px; }
.cc-cat-add-wrap form { display: flex; flex-direction: row; gap: 10px; align-items: flex-end; }
.cc-cat-add-wrap .cc-form-group { flex: 1; min-width: 0; margin-bottom: 0; }
.cc-cat-add-wrap button[type="submit"] { flex-shrink: 0; white-space: nowrap; margin-bottom: 0; padding-top: 9px; padding-bottom: 9px; }

/* ── Dropzone ────────────────────────────────────────────────── */

.cc-dropzone {
	border: 2px dashed var(--cc-border-dk);
	border-radius: var(--cc-radius-lg);
	padding: 18px 20px;
	text-align: center;
	cursor: pointer;
	transition: all .2s;
	background: var(--cc-bg);
	user-select: none;
}

.cc-dropzone:hover, .cc-dropzone.drag-over { border-color: var(--cc-blue); background: var(--cc-blue-lt); }
.cc-dropzone.drag-over {
	animation: ccDashPulse .9s ease-in-out infinite alternate;
	box-shadow: 0 0 0 4px rgba(37,99,235,.12);
}
.cc-dropzone input[type="file"] { display: none; }
.cc-dropzone-icon { display: flex; justify-content: center; margin-bottom: 10px; color: var(--cc-subtle); }
.cc-dropzone-icon svg { width: 32px; height: 32px; stroke: currentColor; }
.cc-dropzone-text { font-weight: 500; color: var(--cc-muted); font-size: .9em; }
.cc-dropzone-text span { color: var(--cc-blue); text-decoration: underline; text-underline-offset: 2px; }
.cc-dropzone-hint { font-size: .78em; color: var(--cc-subtle); margin-top: 4px; }
.cc-dropzone-filename { margin-top: 10px; font-size: .86em; font-weight: 500; color: var(--cc-blue); display: none; }

@keyframes ccDashPulse {
	0% { border-color: var(--cc-blue); transform: translateY(0); }
	100% { border-color: #60a5fa; transform: translateY(-1px); }
}

/* File queue list */
.cc-file-list { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.cc-file-list-item {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 7px 10px;
	background: var(--cc-card);
	border: 1px solid var(--cc-border);
	border-radius: var(--cc-radius);
	font-size: .86em;
}
.cc-file-list-icon { flex-shrink: 0; color: var(--cc-blue); }
.cc-file-list-icon svg { width: 14px; height: 14px; stroke: currentColor; display: block; }
.cc-file-list-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--cc-text); font-weight: 500; }
.cc-file-list-size { color: var(--cc-muted); font-size: .78em; flex-shrink: 0; }
.cc-file-list-remove {
	background: none;
	border: none;
	cursor: pointer;
	color: var(--cc-muted);
	padding: 2px 5px;
	border-radius: 4px;
	line-height: 1;
	font-size: 1em;
	flex-shrink: 0;
	transition: color .12s, background .12s;
}
.cc-file-list-remove:hover { color: var(--cc-red); background: var(--cc-red-lt); }

/* ── Progress Bar ────────────────────────────────────────────── */

.cc-progress-wrap { display: none; margin-top: 14px; }
.cc-progress-wrap.visible { display: block; }
.cc-progress-track { background: var(--cc-border); border-radius: 99px; height: 6px; overflow: hidden; }
.cc-progress-fill { height: 100%; background: linear-gradient(90deg, var(--cc-blue), #60a5fa); border-radius: 99px; width: 0%; transition: width .15s; }
.cc-progress-label { font-size: .78em; color: var(--cc-muted); margin-top: 5px; text-align: right; }

/* ── Tables ──────────────────────────────────────────────────── */

.cc-table-wrap { overflow-x: auto; border-radius: var(--cc-radius); border: 1px solid var(--cc-border); }
.cc-table { width: 100%; border-collapse: collapse; font-size: .88em; min-width: 400px; }
.cc-table thead th { background: #f8fafc; padding: 10px 13px; text-align: left; font-size: .76em; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--cc-muted); border-bottom: 1px solid var(--cc-border); white-space: nowrap; }
.cc-table tbody td { padding: 11px 13px; border-bottom: 1px solid var(--cc-border); color: var(--cc-text); vertical-align: middle; }
.cc-table tbody tr:last-child td { border-bottom: none; }
.cc-table tbody tr:hover td { background: #f8fafc; }
.cc-table-actions { display: flex; gap: 5px; align-items: center; }

/* ── Tree View ───────────────────────────────────────────────── */

.cc-tree { border: 1px solid var(--cc-border); border-radius: var(--cc-radius-lg); overflow: hidden; }

.cc-tree-node { border-bottom: 1px solid var(--cc-border); }
.cc-tree-node:last-child { border-bottom: none; }

.cc-tree-head {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 13px 16px;
	cursor: pointer;
	background: #f8fafc;
	user-select: none;
	transition: background .12s;
}

.cc-tree-head:hover { background: #f1f5f9; }
.cc-tree-head:focus,
.cc-tree-head:focus-visible {
	outline: none;
	box-shadow: inset 0 0 0 1px var(--cc-border-dk);
}

.cc-tree-arrow {
	display: inline-flex;
	width: 18px;
	height: 18px;
	align-items: center;
	justify-content: center;
	color: var(--cc-muted);
	font-size: 13px;
	transition: transform .2s;
	flex-shrink: 0;
}

.cc-tree-arrow::before { content: '›'; font-size: 16px; line-height: 1; }
.cc-tree-node.open .cc-tree-arrow { transform: rotate(90deg); }

.cc-tree-folder-icon { width: 16px; height: 16px; stroke: var(--cc-blue); flex-shrink: 0; }
.cc-tree-node.open .cc-tree-folder-icon { stroke: var(--cc-blue-dk); }

.cc-tree-name { font-weight: 600; font-size: .9em; flex: 1; }

.cc-tree-count {
	font-size: .75em;
	background: var(--cc-border);
	color: var(--cc-muted);
	padding: 1px 7px;
	border-radius: 99px;
	font-weight: 600;
}

.cc-tree-folder-actions { display: flex; gap: 4px; opacity: 0; transition: opacity .15s; }
.cc-tree-head:hover .cc-tree-folder-actions { opacity: 1; }

.cc-tree-body { display: none; }
.cc-tree-node.open > .cc-tree-body { display: block; }
.cc-tree-body .cc-table-wrap { border-radius: 0; border-left: none; border-right: none; border-bottom: none; }
.cc-tree-body .cc-table { min-width: 340px; }
.cc-tree-body > .cc-tree-node {
	margin-left: 18px;
	border-left: 1px solid var(--cc-border);
}

.cc-tree-empty { padding: 16px 20px; font-size: .88em; color: var(--cc-subtle); }
.cc-tree-file-actions { display: flex; gap: 5px; }

.cc-draggable-file { cursor: grab; }
.cc-draggable-file:active { cursor: grabbing; }
.cc-file-dragging { opacity: .4; }
.cc-tree-drop-target { background: #eff6ff !important; outline: 2px dashed var(--cc-blue); outline-offset: -2px; }
.cc-manager-tools {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	justify-content: flex-end;
	margin-left: auto;
	flex: 1 1 auto;
}
.cc-file-head-actions {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-left: auto;
}
.cc-manager-client-combo {
	position: relative;
	width: 220px;
}
.cc-manager-client-combo #cc-manager-client-search {
	width: 100%;
}
.cc-btn-tiny {
	padding: 2px 8px;
	font-size: .72em;
	line-height: 1.2;
}
.cc-tree-actions-row {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin: 8px 0 10px;
}

@media (min-width: 641px) {
	.cc-panel#cc-panel-manager .cc-card-head {
		display: flex;
		align-items: center;
	}
	.cc-panel#cc-panel-manager .cc-card-head .cc-manager-tools {
		order: 3;
		flex: 0 0 auto;
		margin-left: 10px;
		justify-content: flex-start;
	}
	.cc-panel#cc-panel-manager .cc-card-head .cc-file-head-actions {
		order: 2;
		margin-left: auto;
		width: auto;
		white-space: nowrap;
	}
}

/* ── Categories list ─────────────────────────────────────────── */

.cc-cat-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	border: 1px solid var(--cc-border);
	border-radius: var(--cc-radius);
	margin-bottom: 8px;
	background: var(--cc-bg);
}
.cc-cat-item[draggable="true"] { cursor: grab; }
.cc-cat-item.is-dragging { opacity: .55; cursor: grabbing; }
.cc-cat-item.is-drop-target,
.cc-cat-root-drop.is-drop-target {
	border-color: var(--cc-blue);
	background: #eff6ff;
}

.cc-cat-item-name { flex: 1; font-weight: 500; font-size: .92em; }

.cc-cat-edit-input { display: none; flex: 1; }
.cc-cat-item.editing .cc-cat-item-name { display: none; }
.cc-cat-item.editing .cc-cat-edit-input { display: block; }

.cc-cat-actions {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
}

.cc-cat-order-btns {
	display: flex;
	flex-direction: column;
	gap: 1px;
}
.cc-btn-order {
	padding: 1px 6px;
	font-size: 11px;
	line-height: 1.4;
	background: transparent;
	border: 1px solid var(--cc-border);
	color: var(--cc-muted);
	border-radius: 4px;
	cursor: pointer;
}
.cc-btn-order:hover:not(:disabled) {
	background: var(--cc-bg);
	color: var(--cc-text);
	border-color: var(--cc-blue);
}
.cc-btn-order:disabled {
	opacity: .3;
	cursor: default;
}

/* ── Badges ──────────────────────────────────────────────────── */

.cc-badge { display: inline-block; padding: 2px 7px; border-radius: 99px; font-size: .73em; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.cc-badge-blue  { background: var(--cc-blue-lt);  color: var(--cc-blue); }
.cc-badge-green { background: var(--cc-green-lt); color: var(--cc-green); }
.cc-badge-gray  { background: var(--cc-bg); color: var(--cc-muted); border: 1px solid var(--cc-border); }

/* ── Alerts ──────────────────────────────────────────────────── */

.cc-alert { padding: 10px 14px; border-radius: var(--cc-radius); font-size: .88em; margin-bottom: 14px; }
.cc-alert-success { background: var(--cc-green-lt); color: #14532d; border: 1px solid #86efac; }
.cc-alert-error   { background: var(--cc-red-lt);   color: #7f1d1d; border: 1px solid #fca5a5; }
.cc-alert-info    { background: var(--cc-blue-lt);  color: #1e3a8a; border: 1px solid #93c5fd; }

.cc-storage-usage {
	border: 1px solid var(--cc-border);
	background: #f8fafc;
	border-radius: var(--cc-radius);
	padding: 10px 12px;
	margin-bottom: 12px;
}
.cc-storage-usage-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	font-size: .86em;
	margin-bottom: 8px;
}
.cc-storage-usage-head span { color: var(--cc-muted); }
.cc-storage-usage-bar {
	height: 8px;
	background: var(--cc-border);
	border-radius: 999px;
	overflow: hidden;
}
.cc-storage-usage-bar > span {
	display: block;
	height: 100%;
	width: 0%;
	background: linear-gradient(90deg, var(--cc-blue), #60a5fa);
}
.cc-storage-usage-bar.warn > span { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.cc-storage-usage-bar.danger > span { background: linear-gradient(90deg, #ef4444, #f87171); }
.cc-storage-usage-text {
	margin-top: 7px;
	font-size: .8em;
	color: var(--cc-muted);
}

/* ── Loading / Empty ─────────────────────────────────────────── */

.cc-loading { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 40px; color: var(--cc-muted); font-size: .9em; }
.cc-spinner { width: 18px; height: 18px; border: 2px solid var(--cc-border); border-top-color: var(--cc-blue); border-radius: 50%; flex-shrink: 0; animation: ccSpin .7s linear infinite; }
@keyframes ccSpin { to { transform: rotate(360deg); } }

.cc-empty { text-align: center; padding: 44px 20px; color: var(--cc-muted); }
.cc-empty-icon { display: flex; justify-content: center; margin-bottom: 12px; opacity: .35; }
.cc-empty-icon svg { width: 40px; height: 40px; stroke: currentColor; }
.cc-empty-text { font-size: .9em; }

/* ── Login card ──────────────────────────────────────────────── */

.cc-login-wrap {
	display: flex;
	align-items: stretch;
	justify-content: flex-start;
	min-height: 80vh;
	padding: 0 0 32px;
	flex-direction: column;
	gap: 16px;
	background: var(--cc-bg);
	width: 100%;
	max-width: 100%;
	margin: 0;
}
.cc-register-wrap {
	background: var(--cc-bg);
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0 0 36px;
	min-height: auto;
	align-items: stretch;
}

.cc-login-outer { width: 100%; max-width: 420px; margin: 0 auto; padding: 0 14px; }
.cc-login-card { background: var(--cc-card); border: 1px solid var(--cc-border); border-radius: var(--cc-radius-lg); box-shadow: var(--cc-shadow-md); overflow: hidden; }
.cc-login-head { background: linear-gradient(135deg, #2563eb, #1d4ed8); padding: 24px 28px; text-align: center; }
.cc-login-head-icon { display: flex; justify-content: center; margin-bottom: 10px; }
.cc-login-head-icon svg { width: 32px; height: 32px; stroke: #fff; opacity: .9; }
.cc-login-head h2 { margin: 0 0 4px; font-size: 1.2em; color: #fff; font-weight: 700; }
.cc-login-head p  { margin: 0; font-size: .82em; color: rgba(255,255,255,.75); }
.cc-login-body { padding: 24px 28px; }

.cc-login-body #loginform { padding: 0; margin: 0; border: none; box-shadow: none; background: none; }
.cc-login-body #loginform p { margin-bottom: 14px; }
.cc-login-body #loginform label { display: block; font-size: .76em; font-weight: 600; color: var(--cc-muted); margin-bottom: 5px; text-transform: uppercase; letter-spacing: .05em; }
.cc-login-body #loginform .input { width: 100%; padding: 9px 12px; border: 1px solid var(--cc-border); border-radius: var(--cc-radius); font-size: .93em; color: var(--cc-text); background: var(--cc-card); transition: border-color .15s, box-shadow .15s; outline: none; box-sizing: border-box; }
.cc-login-body #loginform .input:focus { border-color: var(--cc-blue); box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.cc-login-body #loginform .forgetmenot { display: flex; align-items: center; gap: 7px; }
.cc-login-body #loginform .submit { margin-top: 4px; }
.cc-login-body #loginform #wp-submit { width: 100%; padding: 10px; background: var(--cc-blue); border: 1px solid var(--cc-blue); border-radius: var(--cc-radius); color: #fff; font-size: .93em; font-weight: 600; cursor: pointer; transition: background .15s; font-family: inherit; }
.cc-login-body #loginform #wp-submit:hover { background: var(--cc-blue-dk); border-color: var(--cc-blue-dk); }

#cc-email-otp-login-form p { margin-bottom: 14px; }
#cc-email-otp-login-form label {
	display: block;
	font-size: .76em;
	font-weight: 600;
	color: var(--cc-muted);
	margin-bottom: 5px;
	text-transform: uppercase;
	letter-spacing: .05em;
}
#cc-email-otp-login-form .input {
	width: 100%;
	padding: 9px 12px;
	border: 1px solid var(--cc-border);
	border-radius: var(--cc-radius);
	font-size: .93em;
	color: var(--cc-text);
	background: var(--cc-card);
	transition: border-color .15s, box-shadow .15s;
	outline: none;
	box-sizing: border-box;
}
#cc-email-otp-login-form .input:focus {
	border-color: var(--cc-blue);
	box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}
#cc-email-otp-login-form .submit {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 4px;
}

#cc-email-otp-login-form .submit .cc-btn {
	min-height: 38px;
	padding: 8px 14px;
}
.cc-login-signup-wrap {
	margin: 8px 0 0;
	text-align: center;
	font-size: .84em;
	color: var(--cc-muted);
}
.cc-login-signup-wrap a {
	font-weight: 600;
	color: var(--cc-blue);
	text-decoration: none;
}
.cc-login-signup-wrap a:hover { text-decoration: underline; }

#cc-send-email-otp-btn {
	background: var(--cc-blue);
	color: #fff;
	border-color: var(--cc-blue);
}

#cc-send-email-otp-btn:hover {
	background: var(--cc-blue-dk);
	color: #fff;
	border-color: var(--cc-blue-dk);
}

.cc-login-role-switch {
	display: inline-flex;
	width: 100%;
	background: var(--cc-bg);
	border: 1px solid var(--cc-border);
	border-radius: var(--cc-radius);
	padding: 3px;
	margin-bottom: 14px;
}

.cc-login-role-btn {
	flex: 1;
	border: none;
	background: transparent;
	padding: 8px 10px;
	border-radius: calc(var(--cc-radius) - 2px);
	font-size: .86em;
	color: var(--cc-muted);
	font-weight: 600;
	cursor: pointer;
}

.cc-login-role-btn.active {
	background: var(--cc-card);
	color: var(--cc-blue);
	box-shadow: var(--cc-shadow-sm);
}

/* Office registration layout */
.cc-register-outer {
	max-width: 640px;
	width: 100%;
	padding: 8px 14px 0;
	margin: 0 auto;
}

.cc-register-body {
	padding: 28px 32px;
}

.cc-reg-grid-2 {
	grid-template-columns: 1fr 1fr;
}

/* ── Client portal layout ────────────────────────────────────── */

.cc-client-content { padding-bottom: 8px; }

/* Client portal tabs */
.cc-client-panel { display: none; }
.cc-client-panel.active { display: block; }
.cc-client-tab-btn { flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border: none; background: transparent; border-radius: var(--cc-radius); cursor: pointer; font-size: .84em; font-weight: 500; color: var(--cc-muted); transition: all .18s; white-space: nowrap; font-family: inherit; }
.cc-client-tab-btn svg { width: 14px; height: 14px; stroke: currentColor; flex-shrink: 0; }
.cc-client-tab-btn:hover { color: var(--cc-text); }
.cc-client-tab-btn.active { background: var(--cc-card); color: var(--cc-blue); box-shadow: var(--cc-shadow); }

/* ── Admin panel ─────────────────────────────────────────────── */

.cc-admin-page { max-width: 980px; }
.cc-admin-section { background: #fff; border: 1px solid #e0e0e0; border-radius: 6px; padding: 18px 22px; margin-bottom: 22px; box-shadow: 0 1px 3px rgba(0,0,0,.05); }
.cc-admin-section h2 { margin: 0 0 14px; padding-bottom: 10px; border-bottom: 1px solid #e8e8e8; font-size: .98em; color: #1e293b; }

/* ═══════════════════════════════════════════════════════════════
   MOBILE — max-width: 640px
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 640px) {
	.cc-site-footer-inner {
		padding: 8px 12px;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: 8px;
		font-size: .58em;
		opacity: .8;
	}
	.cc-site-footer-left,
	.cc-site-footer-right {
		white-space: nowrap;
	}
	.cc-site-footer {
		position: static;
		background: transparent;
		margin-top: auto;
	}
	body.cc-portal-page {
		padding-bottom: 0 !important;
	}
	body.cc-portal-page,
	body.cc-portal-page #page,
	body.cc-portal-page .site,
	body.cc-portal-page #content,
	body.cc-portal-page .site-content,
	body.cc-portal-page .site-main,
	body.cc-portal-page #main,
	body.cc-portal-page #primary {
		min-height: 100vh !important;
		display: flex !important;
		flex-direction: column !important;
	}
	.cc-login-wrap,
	.cc-register-wrap,
	.cc-dashboard,
	.cc-client-portal {
		padding-bottom: 0 !important;
	}
	.cc-col-desktop { display: none; }

	/* Clients list — two-column only, no scroll */
	#cc-clients-list .cc-table-wrap { overflow-x: visible; border: none; border-radius: 0; }
	#cc-clients-list .cc-table { min-width: 0; width: 100%; font-size: .9em; }
	#cc-clients-list .cc-table thead th { padding: 8px 10px; }
	#cc-clients-list .cc-table tbody td { padding: 10px 10px; vertical-align: middle; }
	#cc-clients-list .cc-table tbody td:first-child { font-weight: 500; }
	#cc-clients-list .cc-table tbody td:last-child { text-align: right; white-space: nowrap; }
	#cc-clients-list .js-view-dashboard { font-size: .82em; padding: 7px 12px; }

	.cc-wrap { font-size: 14px; max-width: 100%; min-height: 0; }

	/* Stretch portal edge-to-edge on mobile so all tabs fit; remove bottom space */
	.cc-portal-page .entry-content,
	.cc-portal-page .page-content,
	.cc-portal-page .site-main > article,
	.cc-portal-page .wp-block-group.has-global-padding {
		padding-left: 0 !important;
		padding-right: 0 !important;
		padding-bottom: 0 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		margin-bottom: 0 !important;
	}
	body.cc-portal-page,
	body.cc-portal-page #page,
	body.cc-portal-page .site,
	body.cc-portal-page #content,
	body.cc-portal-page .site-content,
	body.cc-portal-page .site-main,
	body.cc-portal-page #main,
	body.cc-portal-page #primary {
		height: auto !important;
		min-height: 0 !important;
		padding-bottom: 0 !important;
		margin-bottom: 0 !important;
	}
	/* Zero out Gutenberg block inline margin/padding causing bottom whitespace */
	body.cc-portal-page main,
	body.cc-portal-page .wp-site-blocks main {
		margin-top: 0 !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		margin-bottom: 0 !important;
	}
body.cc-portal-page .wp-block-group.alignfull,
body.cc-portal-page .wp-block-group.has-global-padding {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}
	body.cc-portal-page,
	body.cc-portal-page #page,
	body.cc-portal-page .site,
	body.cc-portal-page #content,
	body.cc-portal-page .site-content,
	body.cc-portal-page .site-main,
	body.cc-portal-page #main,
	body.cc-portal-page #primary,
	body.cc-portal-page .entry-content,
	body.cc-portal-page .page-content {
		background: var(--cc-bg) !important;
	}
	body.cc-portal-page .cc-wrap,
	body.cc-portal-page .cc-client-portal,
	body.cc-portal-page .cc-dashboard {
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
	}

	.cc-header {
		padding: 12px 10px;
		margin-bottom: 16px;
		border-radius: var(--cc-radius) var(--cc-radius) 0 0;
		flex-wrap: nowrap;
		align-items: center;
		gap: 8px;
	}
	.cc-header-brand {
		font-size: .92em;
		min-width: 0;
		flex: 1 1 auto;
	}
	.cc-header-name { display: none; }
	.cc-header-user {
		width: auto;
		max-width: 100%;
		margin-left: auto;
		justify-content: flex-end !important;
		align-self: flex-end;
		gap: 6px;
		flex-wrap: nowrap;
		flex: 0 0 auto;
	}
	.cc-header-user a {
		flex-shrink: 0;
		padding: 5px 9px;
		font-size: .78em;
	}
	.cc-header-user #cc-open-profile-btn {
		padding: 6px 9px;
		min-height: 34px;
		font-size: .82em;
		font-weight: 500;
		white-space: nowrap;
		flex-shrink: 0;
		text-align: center;
		justify-content: center;
	}

	.cc-tabs-nav { margin: 0 14px 16px; padding: 4px; gap: 3px; }
	.cc-profile-panel { margin: 0 14px 12px; }
	.cc-user-strip { grid-template-columns: 1fr 1fr; margin: 0 14px 12px; }
	.cc-office-contact-strip { grid-template-columns: 1fr 1fr; margin: 0 14px 12px; }
	.cc-office-switcher-bar { margin: 0 14px 12px; }
	.cc-tab-btn, .cc-client-tab-btn { padding: 8px 10px; font-size: .78em; gap: 4px; }
	.cc-tab-btn svg, .cc-client-tab-btn svg { display: none; }
	.cc-upload-grid { grid-template-columns: 1fr; }
	.cc-manager-tools {
		width: 100%;
		display: grid;
		grid-template-columns: 1fr;
		align-items: center;
		gap: 8px;
		justify-content: initial;
		order: 3;
		flex: 1 1 100%;
		margin-left: 0;
	}
	.cc-manager-tools #cc-file-search {
		width: 100% !important;
		min-width: 0;
		grid-column: 1 / -1;
	}
	.cc-manager-tools #cc-manager-filter {
		width: 100% !important;
		min-width: 0 !important;
		grid-column: 1 / -1;
	}
	.cc-manager-client-combo {
		width: 100%;
		grid-column: 1 / -1;
	}
	.cc-manager-client-combo #cc-manager-client-search {
		width: 100%;
	}
	.cc-file-head-actions {
		display: inline-flex;
		margin-left: auto;
		margin-top: 0;
		width: auto;
		order: initial;
		justify-content: flex-end;
		white-space: nowrap;
	}
	.cc-btn-tiny {
		font-size: .7em;
		padding: 2px 7px;
	}
	.cc-tree-actions-row { margin-top: 0; }

	.cc-panel { padding: 0 14px 20px; }

	.cc-card { padding: 14px; }
	.cc-card-head { margin-bottom: 12px; }

	.cc-form-grid { grid-template-columns: 1fr; gap: 10px; }


	.cc-tree-head { padding: 11px 12px; }
	.cc-tree-folder-actions { opacity: 1; } /* always visible on mobile (no hover) */

	.cc-table { font-size: .82em; min-width: 300px; }
	.cc-table thead th, .cc-table tbody td { padding: 8px 10px; }

	/* Mobile compact file rows (office files tab): reduce clutter */
	#cc-file-tree .cc-table { min-width: 0; table-layout: fixed; }
	#cc-inline-file-tree .cc-table { min-width: 0; table-layout: fixed; }
	#cc-file-tree .cc-table thead th:nth-child(2),
	#cc-file-tree .cc-table thead th:nth-child(3),
	#cc-file-tree .cc-table tbody td:nth-child(2),
	#cc-file-tree .cc-table tbody td:nth-child(3) {
		display: none;
	}
	#cc-inline-file-tree .cc-table thead th:nth-child(2),
	#cc-inline-file-tree .cc-table thead th:nth-child(3),
	#cc-inline-file-tree .cc-table tbody td:nth-child(2),
	#cc-inline-file-tree .cc-table tbody td:nth-child(3) {
		display: none;
	}
	#cc-file-tree .cc-table thead th:nth-child(1) { width: 46%; }
	#cc-file-tree .cc-table thead th:nth-child(4) { width: 22%; }
	#cc-file-tree .cc-table thead th:nth-child(5) { width: 32%; text-align: right; }
	#cc-inline-file-tree .cc-table thead th:nth-child(1) { width: 54%; }
	#cc-inline-file-tree .cc-table thead th:nth-child(4) { width: 18%; }
	#cc-inline-file-tree .cc-table thead th:nth-child(5) { width: 28%; text-align: right; }
	#cc-file-tree .cc-table tbody td:nth-child(1) {
		word-break: break-word;
		overflow-wrap: anywhere;
	}
	#cc-inline-file-tree .cc-table tbody td:nth-child(1) {
		word-break: break-word;
		overflow-wrap: anywhere;
	}
	#cc-file-tree .cc-table tbody td:nth-child(4) {
		font-size: .78em;
		color: var(--cc-muted);
		white-space: normal;
		word-break: break-word;
	}
	#cc-inline-file-tree .cc-table tbody td:nth-child(4) {
		font-size: .78em;
		color: var(--cc-muted);
		white-space: normal;
		word-break: break-word;
	}
	#cc-file-tree .cc-table tbody td:nth-child(4) .cc-date-full { display: none; }
	#cc-file-tree .cc-table tbody td:nth-child(4) .cc-date-mobile { display: inline; }
	#cc-inline-file-tree .cc-table tbody td:nth-child(4) .cc-date-full { display: none; }
	#cc-inline-file-tree .cc-table tbody td:nth-child(4) .cc-date-mobile { display: inline; }
	#cc-file-tree .cc-table tbody td:nth-child(5) {
		text-align: right;
		white-space: nowrap;
		overflow: visible;
	}
	#cc-inline-file-tree .cc-table tbody td:nth-child(5) {
		text-align: right;
		white-space: nowrap;
		overflow: visible;
	}
	#cc-file-tree .cc-tree-file-actions {
		display: flex;
		flex-wrap: nowrap;
		gap: 4px;
		justify-content: flex-end;
		align-items: center;
		min-width: 0;
	}
	#cc-inline-file-tree .cc-tree-file-actions {
		display: flex;
		flex-wrap: nowrap;
		gap: 4px;
		justify-content: flex-end;
		align-items: center;
		min-width: 0;
	}
	#cc-file-tree .cc-tree-file-actions .cc-btn {
		padding: 4px 7px;
		font-size: .68em;
		min-height: 25px;
		border-radius: 7px;
	}
	#cc-inline-file-tree .cc-tree-file-actions .cc-btn {
		padding: 4px 7px;
		font-size: .68em;
		min-height: 25px;
		border-radius: 7px;
	}
	#cc-file-tree .cc-tree-file-actions > .js-rename-file {
		display: none;
	}
	#cc-inline-file-tree .cc-tree-file-actions > .js-rename-file {
		display: none;
	}
	#cc-file-tree .cc-tree-file-actions > .js-delete-file {
		display: none;
	}
	#cc-inline-file-tree .cc-tree-file-actions > .js-delete-file {
		display: none;
	}
	#cc-file-tree .cc-tree-file-actions .js-file-more {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 26px;
		font-size: .95em;
		line-height: 1;
		padding: 0;
	}
	#cc-inline-file-tree .cc-tree-file-actions .js-file-more {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 26px;
		font-size: .95em;
		line-height: 1;
		padding: 0;
	}
	#cc-file-tree .cc-tree-file-actions.menu-open > .js-file-more {
		display: none;
	}
	#cc-inline-file-tree .cc-tree-file-actions.menu-open > .js-file-more {
		display: none;
	}
	#cc-file-tree .cc-tree-file-actions.menu-open > .js-rename-file,
	#cc-file-tree .cc-tree-file-actions.menu-open > .js-delete-file {
		display: inline-flex;
	}
	#cc-inline-file-tree .cc-tree-file-actions.menu-open > .js-rename-file,
	#cc-inline-file-tree .cc-tree-file-actions.menu-open > .js-delete-file {
		display: inline-flex;
	}
	/* Keep layout stable: hide date text only, keep date column width */
	/* Keep layout stable: hide date text only, keep date column width */
	#cc-file-tree .cc-draggable-file.cc-row-menu-open td:nth-child(4) .cc-date-full,
	#cc-file-tree .cc-draggable-file.cc-row-menu-open td:nth-child(4) .cc-date-mobile {
		visibility: hidden;
	}
	#cc-inline-file-tree .cc-draggable-file.cc-row-menu-open td:nth-child(4) .cc-date-full,
	#cc-inline-file-tree .cc-draggable-file.cc-row-menu-open td:nth-child(4) .cc-date-mobile {
		visibility: hidden;
	}
	#cc-file-tree .cc-file-more-menu {
		display: none !important;
	}
	#cc-inline-file-tree .cc-file-more-menu {
		display: none !important;
	}
	#cc-file-tree .cc-file-name-cell {
		cursor: default;
	}
	#cc-inline-file-tree .cc-file-name-cell {
		cursor: default;
	}

	/* Client dashboard files tab: hide "By" column on mobile only */
	#cc-client-panel-files .cc-table thead th:nth-child(3),
	#cc-client-panel-files .cc-table tbody td:nth-child(3) {
		display: none;
	}
	#cc-client-panel-files .cc-table thead th:nth-child(1) { width: 54%; }
	#cc-client-panel-files .cc-table thead th:nth-child(2) { width: 24%; }
	#cc-client-panel-files .cc-table thead th:nth-child(4) { width: 22%; text-align: right; }
	#cc-client-panel-files .cc-table tbody td:nth-child(4) {
		text-align: right;
		white-space: nowrap;
	}

	.cc-login-wrap { min-height: 68vh; padding: 0 0 28px; max-width: 100%; }
	.cc-register-wrap { max-width: 100%; padding: 0 0 28px; }
	.cc-login-outer { margin: 0 auto; padding: 0 12px; max-width: 100%; }
	.cc-register-outer { padding: 10px 12px 0; }
	.cc-login-head { padding: 20px 20px; }
	.cc-login-body { padding: 18px 20px; }
	#cc-email-otp-login-form .input { font-size: 16px; }
	#cc-email-otp-login-form .submit { gap: 8px; }
	#cc-email-otp-login-form .submit .cc-btn {
		flex: 1 1 calc(50% - 8px);
		min-width: 0;
		justify-content: center;
	}
	.cc-login-role-btn { padding: 9px 8px; font-size: .84em; }

	.cc-btn { padding: 7px 12px; font-size: .8em; }
	.cc-btn-sm { padding: 4px 8px; font-size: .75em; }

	.cc-dropzone { padding: 22px 14px; }

	/* Client portal sections full-width */
	.cc-client-content [style*="padding:0 28px"] { padding: 0 14px !important; }
	.cc-client-content [style*="padding:0 28px 20px"] { padding: 0 14px 14px !important; }
	.cc-client-content [style*="padding:0 28px 28px"] { padding: 0 14px 20px !important; }

	.cc-register-outer { max-width: 100%; padding: 0 8px; }
	.cc-register-body { padding: 18px 14px; }
	.cc-reg-grid-2 { grid-template-columns: 1fr; gap: 10px; }
}

@media (max-width: 400px) {
	.cc-office-contact-strip { grid-template-columns: 1fr; }
	.cc-login-body { padding: 16px 14px; }
	#cc-email-otp-login-form .submit .cc-btn {
		flex: 1 1 100%;
		width: 100%;
	}
	.cc-login-role-switch { margin-bottom: 12px; }
}

/* Final mobile override: keep footer at bottom in normal flow (non-floating). */
@media (max-width: 640px) {
	body.cc-portal-page,
	body.cc-portal-page #page,
	body.cc-portal-page .site,
	body.cc-portal-page #content,
	body.cc-portal-page .site-content,
	body.cc-portal-page .site-main,
	body.cc-portal-page #main,
	body.cc-portal-page #primary {
		display: flex !important;
		flex-direction: column !important;
		min-height: 100vh !important;
		height: auto !important;
	}
	body.cc-portal-page .cc-wrap,
	body.cc-portal-page .cc-client-portal,
	body.cc-portal-page .cc-dashboard {
		flex: 1 0 auto !important;
	}
	.cc-site-footer {
		position: static !important;
		margin-top: auto !important;
	}
}

/* ─── Trash Folder ─────────────────────────────────────────────────────────── */

/* "Trash Folder" link at the bottom of File Manager */
.cc-trash-link-wrap {
	padding: 18px 0 4px;
	border-top: 1px solid var(--cc-border);
	margin-top: 16px;
	display: flex;
	align-items: center;
}
.cc-trash-link-btn {
	color: var(--cc-muted);
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
}
.cc-trash-link-btn:hover {
	color: var(--cc-text);
}
.cc-trash-link-btn svg {
	flex-shrink: 0;
}

/* Trash view toolbar (Back / Title / Clear Trash) */
.cc-trash-toolbar {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 0 0 14px;
	border-bottom: 1px solid var(--cc-border);
	margin-bottom: 14px;
}
.cc-trash-toolbar-title {
	flex: 1;
	font-weight: 600;
	font-size: 15px;
	color: var(--cc-text);
}

/* Trash note */
.cc-trash-note {
	font-size: 12px;
	color: var(--cc-muted);
	margin: 0 0 12px;
}

/* Restore button in trash */
.cc-btn-restore {
	background: transparent;
	border: 1px solid var(--cc-blue);
	color: var(--cc-blue);
}
.cc-btn-restore:hover {
	background: #eff6ff;
}

/* Danger/ghost variant for permanent delete */
.cc-btn-danger-ghost {
	background: transparent;
	border: 1px solid #e05252;
	color: #e05252;
}
.cc-btn-danger-ghost:hover {
	background: #fef2f2;
}

/* Empty state */
.cc-trash-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 40px 20px;
	color: var(--cc-muted);
	font-size: 14px;
}
.cc-trash-empty svg {
	opacity: .45;
}

/* ── Desktop table ── */
.cc-trash-table-wrap {
	overflow-x: auto;
}
.cc-trash-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}
.cc-trash-table th,
.cc-trash-table td {
	padding: 9px 10px;
	text-align: left;
	border-bottom: 1px solid var(--cc-border);
	vertical-align: middle;
}
.cc-trash-table th {
	background: var(--cc-bg);
	font-weight: 600;
	font-size: 12px;
	color: var(--cc-muted);
	white-space: nowrap;
}
.cc-trash-table tbody tr:hover {
	background: var(--cc-bg);
}
.cc-td-name {
	display: flex;
	align-items: center;
	gap: 6px;
	max-width: 200px;
}
.cc-td-filename {
	word-break: break-word;
}
.cc-file-icon {
	flex-shrink: 0;
	font-size: 15px;
}
.cc-path-badge {
	display: inline-block;
	background: var(--cc-bg);
	border: 1px solid var(--cc-border);
	border-radius: 4px;
	padding: 2px 7px;
	font-size: 11px;
	color: var(--cc-muted);
	white-space: nowrap;
	max-width: 160px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.cc-autodel-date {
	font-size: 12px;
	color: #c0392b;
	font-weight: 500;
}
.cc-td-actions {
	white-space: nowrap;
}
.cc-td-actions .cc-btn {
	margin-right: 4px;
}
.cc-th-actions {
	min-width: 140px;
}
.cc-th-path {
	min-width: 130px;
}

/* ── Mobile cards (hidden on desktop, shown on mobile) ── */
.cc-trash-mobile-card {
	display: none;
}

@media (max-width: 640px) {
	/* Hide desktop table rows, show mobile cards */
	.cc-trash-table thead {
		display: none;
	}
	.cc-trash-row {
		display: none;
	}
	.cc-trash-mobile-card {
		display: table-row;
	}
	.cc-trash-mobile-card > td {
		padding: 0;
		border-bottom: 1px solid var(--cc-border);
	}
	.cc-tmcard {
		padding: 12px;
		display: flex;
		flex-direction: column;
		gap: 6px;
	}
	.cc-tmcard-name {
		font-weight: 600;
		font-size: 13px;
		display: flex;
		align-items: center;
		gap: 6px;
		word-break: break-word;
	}
	.cc-tmcard-meta {
		font-size: 12px;
		color: var(--cc-muted);
		display: flex;
		align-items: flex-start;
		gap: 5px;
		flex-wrap: wrap;
	}
	.cc-tmcard-label {
		font-weight: 600;
		color: var(--cc-text);
		white-space: nowrap;
	}
	.cc-tmcard-actions {
		display: flex;
		gap: 8px;
		margin-top: 6px;
	}
	.cc-tmcard-actions .cc-btn {
		flex: 1;
		justify-content: center;
	}
	/* Trash toolbar stacks on mobile */
	.cc-trash-toolbar {
		flex-wrap: wrap;
		gap: 8px;
	}
	.cc-trash-toolbar-title {
		width: 100%;
		order: -1;
	}
}