/* Βήμα 1 «Ταυτότητα» — ενότητα «Εικονίδιο της εφαρμογής» (js/customer_app/identity_icon.js). Ύφος: docs/design/fason */
.cai-ic-layout { display: grid; grid-template-columns: 1fr 220px; gap: 24px; align-items: start; margin: 16px 0; }
.cai-ic-pickers { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.cai-ic-grid { display: grid; grid-template-columns: repeat(8, 64px); gap: 8px; }
.cai-ic-tile { position: relative; width: 64px; height: 64px; padding: 3px; border: 1px solid #CBD5E1; border-radius: 16px; background: #fff; cursor: pointer; }
.cai-ic-tile svg { display: block; width: 100%; height: 100%; }
.cai-ic-tile.is-on { border: 2px solid #2563EB; padding: 2px; }
.cai-ic-check { position: absolute; top: -6px; right: -6px; width: 18px; height: 18px; border-radius: 50%; background: #2563EB; display: flex; align-items: center; justify-content: center; }
.cai-ic-check svg { width: 12px; height: 12px; }
.cai-ic-swatches { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.cai-ic-swatch { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 4px; border: 1px solid #CBD5E1; border-radius: 12px; background: #fff; cursor: pointer; min-height: 44px; }
.cai-ic-swatch.is-on { border: 2px solid #2563EB; padding: 7px 3px; }
.cai-ic-dot { width: 28px; height: 28px; border-radius: 50%; border: 1px solid #CBD5E1; }
.cai-ic-cname { font-size: 12px; text-align: center; overflow-wrap: anywhere; }
.cai-ic-side { display: flex; flex-direction: column; gap: 8px; }
.cai-ic-phone { border: 1px solid #E2E8F0; border-radius: 20px; background: #F1F5F9; padding: 24px 16px; display: flex; justify-content: center; }
.cai-ic-app { display: flex; flex-direction: column; align-items: center; gap: 6px; width: 80px; }
.cai-ic-appname { font-size: 12px; text-align: center; max-width: 80px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 720px) {
  .cai-ic-layout { grid-template-columns: 1fr; }
  .cai-ic-grid { grid-template-columns: repeat(4, 62px); justify-content: center; }
  .cai-ic-swatches { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}