/* ===== DTF Directory Plugin - Frontend Styles ===== */
:root {
    --dtfd-primary: #e74c3c;
    --dtfd-accent:  #c0392b;
    --dtfd-dark:    #1a1a1a;
    --dtfd-gray:    #7f8c8d;
    --dtfd-light:   #f5f5f5;
    --dtfd-border:  #e0e0e0;
    --dtfd-white:   #ffffff;
    --dtfd-green:   #27ae60;
    --dtfd-gold:    #b8860b;
    --dtfd-radius:  10px;
}

/* ── Breadcrumb ── */
.dtfd-breadcrumb { font-size:13px; color:var(--dtfd-gray); margin-bottom:16px; }
.dtfd-breadcrumb a { color:var(--dtfd-primary); text-decoration:none; }

/* ── Top Cards Grid ── */
.dtfd-top-cards-wrap { background:#5a5a5a; border-radius:var(--dtfd-radius); padding:20px; margin-bottom:28px; }
.dtfd-top-cards-header h2 { color:#fff; font-size:20px; font-weight:700; margin-bottom:16px; }
.dtfd-top-cards-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }
@media(max-width:900px){ .dtfd-top-cards-grid { grid-template-columns:repeat(3,1fr); } }
@media(max-width:600px){ .dtfd-top-cards-grid { grid-template-columns:repeat(2,1fr); } }

.dtfd-top-card { display:flex; flex-direction:column; align-items:center; background:#fff; border-radius:8px; padding:12px 8px; text-decoration:none; color:var(--dtfd-dark); transition:box-shadow 0.2s; text-align:center; }
.dtfd-top-card:hover { box-shadow:0 4px 16px rgba(0,0,0,0.15); transform:translateY(-2px); }
.dtfd-top-card-logo { width:60px; height:60px; border-radius:6px; overflow:hidden; margin-bottom:8px; display:flex; align-items:center; justify-content:center; background:#e74c3c; }
.dtfd-top-card-logo img { width:100%; height:100%; object-fit:cover; }
.dtfd-top-card-logo .dtfd-logo-text { color:#fff; font-weight:700; font-size:14px; }
.dtfd-top-card-name { font-size:11px; font-weight:600; color:#1a1a1a; margin-bottom:6px; text-transform:uppercase; line-height:1.3; }
.dtfd-top-card-rating { display:flex; flex-direction:column; align-items:center; gap:2px; }
.dtfd-rating-icon { display:inline-flex; align-items:center; gap:4px; color:#fff; font-size:12px; font-weight:600; padding:2px 8px; border-radius:10px; }
.dtfd-review-count { font-size:10px; color:var(--dtfd-gray); }

/* ── List Controls ── */
.dtfd-list-wrap { max-width:1000px; margin:0 auto; }
.dtfd-list-controls { display:flex; justify-content:space-between; align-items:center; margin:20px 0; flex-wrap:wrap; gap:10px; }
.dtfd-filters { display:flex; gap:8px; flex-wrap:wrap; }
.dtfd-select { padding:8px 12px; border:1px solid var(--dtfd-border); border-radius:6px; font-size:13px; background:#fff; cursor:pointer; }
.dtfd-result-count { font-size:13px; color:var(--dtfd-gray); }

/* ── Company Card ── */
.dtfd-company-card { background:#fff; border:1px solid var(--dtfd-border); border-radius:var(--dtfd-radius); margin-bottom:16px; overflow:hidden; transition:box-shadow 0.2s; }
.dtfd-company-card:hover { box-shadow:0 4px 20px rgba(0,0,0,0.1); }
.dtfd-company-card.dtfd-featured { border-color:var(--dtfd-primary); border-left:4px solid var(--dtfd-primary); }
.dtfd-card-top { display:flex; align-items:flex-start; gap:14px; padding:16px; }
.dtfd-card-logo { width:72px; height:72px; border-radius:8px; background:#e74c3c; display:flex; align-items:center; justify-content:center; flex-shrink:0; overflow:hidden; }
.dtfd-card-logo img { width:100%; height:100%; object-fit:cover; }
.dtfd-logo-initials { color:#fff; font-weight:700; font-size:20px; }
.dtfd-card-info { flex:1; min-width:0; }
.dtfd-card-name-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px; }
.dtfd-card-title { margin:0; font-size:17px; font-weight:700; }
.dtfd-card-title a { color:var(--dtfd-dark); text-decoration:none; }
.dtfd-card-title a:hover { color:var(--dtfd-primary); }
.dtfd-card-badges { display:flex; gap:6px; flex-wrap:wrap; }
.dtfd-badge { font-size:11px; font-weight:600; padding:3px 10px; border-radius:4px; letter-spacing:0.02em; }
.dtfd-badge-top      { background:#b8860b; color:#fff; }
.dtfd-badge-featured { background:#6c757d; color:#fff; }
.dtfd-card-rating-row { display:flex; align-items:center; gap:8px; margin-bottom:5px; }
.dtfd-rating-pill { display:inline-flex; align-items:center; gap:4px; color:#fff; font-size:13px; font-weight:700; padding:3px 10px; border-radius:10px; }
.dtfd-reviews-count { font-size:13px; color:var(--dtfd-gray); }
.dtfd-card-meta { font-size:12px; color:var(--dtfd-gray); margin-bottom:6px; text-transform:uppercase; letter-spacing:0.03em; }
.dtfd-card-services { display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:12px; }
.dtfd-services-label { color:var(--dtfd-green); font-weight:600; }
.dtfd-service-tag { background:#f8f9fa; border:1px solid var(--dtfd-border); border-radius:4px; padding:2px 8px; font-size:12px; font-weight:500; }
.dtfd-card-actions { display:flex; flex-direction:column; gap:8px; flex-shrink:0; }
.dtfd-btn { display:inline-block; padding:8px 16px; border-radius:6px; font-size:12px; font-weight:600; text-align:center; cursor:pointer; text-decoration:none; border:none; letter-spacing:0.04em; white-space:nowrap; }
.dtfd-btn-view  { background:#5a5a5a; color:#fff; }
.dtfd-btn-view:hover { background:#444; color:#fff; }
.dtfd-btn-rate  { background:#5a5a5a; color:#fff; }
.dtfd-btn-rate:hover { background:#333; }

.dtfd-card-stats { display:flex; border-top:1px solid var(--dtfd-border); }
.dtfd-stat { flex:1; display:flex; flex-direction:column; align-items:center; padding:10px 6px; border-right:1px solid var(--dtfd-border); text-align:center; }
.dtfd-stat:last-child { border-right:none; }
.dtfd-stat span { font-size:10px; color:var(--dtfd-gray); text-transform:uppercase; letter-spacing:0.05em; margin-bottom:4px; }
.dtfd-stat strong { font-size:14px; font-weight:700; color:var(--dtfd-dark); }

/* ── Single Company Page ── */
.dtfd-single-wrap { max-width:900px; margin:0 auto; }
.dtfd-single-header { background:#f5f5f5; border-radius:var(--dtfd-radius); padding:20px; display:flex; gap:16px; align-items:flex-start; margin-bottom:16px; }
.dtfd-single-logo { width:100px; height:100px; border-radius:8px; background:#e74c3c; display:flex; align-items:center; justify-content:center; overflow:hidden; flex-shrink:0; }
.dtfd-single-logo img { width:100%; height:100%; object-fit:cover; }
.dtfd-logo-initials-lg { color:#fff; font-size:32px; font-weight:700; }
.dtfd-single-info { flex:1; }
.dtfd-single-title { font-size:28px; font-weight:800; color:#1a3a6e; margin:0 0 8px; }
.dtfd-single-rating-row { display:flex; align-items:center; gap:10px; margin-bottom:6px; }
.dtfd-single-cats { font-size:12px; color:var(--dtfd-gray); text-transform:uppercase; letter-spacing:0.05em; }
.dtfd-single-badge-col { display:flex; flex-direction:column; gap:8px; flex-shrink:0; }
.dtfd-btn-follow { background:#b8860b; color:#fff; border:none; padding:7px 16px; border-radius:5px; font-size:12px; font-weight:600; cursor:pointer; letter-spacing:0.03em; }
.dtfd-btn-follow:hover { background:#9a7009; }
.dtfd-single-address { padding:12px 16px; font-size:14px; border-bottom:1px solid var(--dtfd-border); margin-bottom:16px; }

.dtfd-single-details-grid { display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--dtfd-border); border-radius:8px; margin-bottom:20px; overflow:hidden; }
.dtfd-single-contact, .dtfd-single-other { padding:16px 20px; }
.dtfd-single-contact { border-right:1px solid var(--dtfd-border); }
.dtfd-single-contact h3, .dtfd-single-other h3 { margin:0 0 12px; font-size:14px; text-decoration:underline; }
.dtfd-single-contact p, .dtfd-single-other p { font-size:13px; margin:4px 0; }
.dtfd-single-contact a { color:var(--dtfd-primary); }
.dtfd-single-other { text-align:right; }

/* ── Rating Form ── */
.dtfd-rate-section { margin-bottom:20px; }
.dtfd-rate-section h3 { font-size:14px; text-decoration:underline; margin-bottom:14px; }
.dtfd-rating-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.dtfd-rating-label { font-size:13px; font-weight:700; color:var(--dtfd-dark); }
.dtfd-star-input { display:inline-flex; gap:4px; cursor:pointer; }
.dtfd-si-star { font-size:24px; color:#ccc; transition:color 0.15s; }
.dtfd-si-star.active, .dtfd-si-star:hover { color:#f39c12; }
.dtfd-rating-submit-row { display:flex; align-items:center; gap:14px; }
.dtfd-btn-submit-rating { background:var(--dtfd-primary); color:#fff; border:none; padding:9px 22px; border-radius:6px; font-size:13px; font-weight:600; cursor:pointer; }
.dtfd-btn-submit-rating:hover { background:var(--dtfd-accent); }
.dtfd-rating-msg { font-size:13px; font-weight:500; }
.dtfd-rating-msg.success { color:var(--dtfd-green); }
.dtfd-rating-msg.error   { color:var(--dtfd-primary); }

/* ── Gallery ── */
.dtfd-single-gallery-section { margin-bottom:20px; }
.dtfd-single-gallery-section h3 { font-size:14px; text-decoration:underline; margin-bottom:12px; }
.dtfd-gallery-slider { display:flex; gap:10px; overflow-x:auto; padding-bottom:8px; }
.dtfd-gallery-item { flex-shrink:0; width:160px; height:120px; border-radius:6px; overflow:hidden; background:#b0d8d5; }
.dtfd-gallery-item img { width:100%; height:100%; object-fit:cover; }

/* ── Details Table ── */
.dtfd-details-table { width:100%; border-collapse:collapse; margin-bottom:20px; border:1px solid var(--dtfd-border); border-radius:8px; overflow:hidden; }
.dtfd-details-table td { padding:12px 16px; font-size:14px; border-bottom:1px solid var(--dtfd-border); }
.dtfd-details-table tr:last-child td { border-bottom:none; }
.dtfd-table-label { color:var(--dtfd-primary); font-weight:700; width:200px; text-transform:uppercase; font-size:12px; }

/* ── About ── */
.dtfd-about-section h3 { font-size:14px; text-decoration:underline; margin-bottom:10px; }
.dtfd-about-content { font-size:14px; line-height:1.8; color:#333; text-align:justify; }

/* ── Rating Modal ── */
.dtfd-modal-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.55); z-index:9999; align-items:center; justify-content:center; }
.dtfd-modal-overlay.open { display:flex; }
.dtfd-modal { background:#fff; border-radius:var(--dtfd-radius); padding:28px; max-width:420px; width:90%; }
.dtfd-modal h3 { margin:0 0 16px; font-size:17px; }
.dtfd-modal-close { float:right; background:none; border:none; font-size:20px; cursor:pointer; color:var(--dtfd-gray); margin-top:-4px; }

/* ── Responsive ── */
@media(max-width:700px){
    .dtfd-card-top { flex-direction:column; }
    .dtfd-card-actions { flex-direction:row; }
    .dtfd-single-details-grid { grid-template-columns:1fr; }
    .dtfd-single-contact { border-right:none; border-bottom:1px solid var(--dtfd-border); }
    .dtfd-single-other { text-align:left; }
    .dtfd-single-header { flex-direction:column; }
    .dtfd-rating-row { flex-direction:column; align-items:flex-start; }
}
